Render components only after we have collected the Ion props

[marcaaron]

This PR is an attempt to solve the problem of all connected React components rendering without any initial data from the Ion. It achieves this without the addition of a memory cache and all other Ion.connect() usages and subscribers will remain untouched.

As far as I can tell, there seem to be no performance impact here and there is not much difference between first getting this data from storage and loading it with a single call to render vs. mounting the component and then rendering many times as data is sent back to each connection.

The main change is that a component connected withIon will take the Ion props along with it for the first render. I think this is a really important change to make early on because:

1. Not doing this will cause hacks around componentDidUpdate() to replace prop handling logic done in componentDidMount() or the constructor()
2. We can stop worrying about what props exist or don't exist in components for the first lifecycle method. If the component renders with a null prop for any value then there is no key for that value. It won't first render with undefined then appear to be null so we can get more value out of things like propTypes and write less confusing code.

cc @tgolen and cc @chiragsalian who just ran into an issue related to initial props being unknown

Curious to hear everyone's thoughts on this. This is my best attempt at staying respectful of the Ion philosophy while also keeping React best practices in mind.

[tgolen]

I really like the core idea for this, and it was actually just something that had run through my mind when I was thinking about it with Chirag last week. I think it's a good change that will make working with withIon easier for engineers new to the codebase.

[marcaaron]

Took another crack at this one.

[chiragsalian]

Damn, it works so well in my initial testing ✨
It also just does a component render once instead of twice which is so great for our performance.

Reviewing and testing some more.

[tgolen]

This looks really great!

[chiragsalian]

Left one comment to get your thoughts. Rest looks awesome and works great. Am hype 🙂

[chiragsalian]

This logic is a bit confusing with .reduce and prev and curr. If i understand correctly we just want all keys except where initWithStoredValues is defined as false.

Then could this logic be used since it looks easier,

const requiredKeysForInit = _.chain(mapIonToState)
    .omit(value => value.initWithStoredValues === false)
    .keys()
    .value();

[chiragsalian]

Tested the same,

Notice i just got key "myPersonalDetails" and "network" but didn't get "testSomeKey" since it had initWithStoredValues as false.

[marcaaron]

Nice tips @chiragsalian will update with that change!

[chiragsalian]

LGTM