Beta 20 -> context api & getStore

[etiennecl]

I've just seen that you added a new context api to kea. I've tried updating the example with the new versions and updating the example with these modifications in the store:

export const initStore = (initialState) => {
  resetContext()
  return getStore({ preloadedState: initialState })
}

On SSR the store doesn't seems to get the initialState, but after that everything seems to be working. When navigating to another route, the logic doesn't get connected to the component, probably because of the restContext() being inside of the initStore function.

I've tried lazymounted the logic but without success and calling resetContext() outside the initStore fucntion but then the store is undefined.

[mariusandra]

Hi @etiennecl

The latest code in the master branch of this repo seems to already work a lot better that before. I still did not try adding sagas, but managed to fix many other issues.

The biggest problem I had was that when changing routes, everything would crash. I traced it down to something still wanting to render the old page even though it has already been removed from redux:

So I added two new properties to context to try something:

  resetContext({
    attachStrategy: 'replace',
    detachStrategy: 'lazy'
  })

They toggle what happens when a logic is mounted to redux.

• attachStrategy has two options: dispatch (default), replace
• detachStrategy has four options: dispatch (default), replace, persist, lazy

They work like this:

• With dispatch, every time a logic is connected to redux, we dispatch an action to regenerate the store.
• With replace we call store.replaceReducer() to replace the store
• With persist, logic is never detached from the store
• With lazy, we detach the logic from the store, but don't regenerate the store until some action in the future triggers it.

With the detachStrategy at lazy, the code that for some reason renders the old route after the new one has been mounted, will be satisfied as it will (hopefully?) still find what it needs in the store. Due to memoization nothing will actually be rendered anyway.

It feels kind of hacky, but it seems to work for now.

Some other things I did with:

• I removed the next-redux-wrapper in order to get more control into the process.

• In beta.22, the Kea component (what you get after const Kea = kea(input)(Component)) now stores the following references: Kea._wrappedKlass === Component and Kea._wrapper === kea(input). This allows me to directly run the getInitialProps of the component in _app.js without relying on a plugin to proxy the field. It also lets me mount the logic immediately before calling getInitialProps.

• Passing initialState seems to work and initialize the defaults. Due to the context being reset on every new server render, all the inline paths seem to be in sync with what they would be on the client... so we don't even need to specify paths for the logics. This needs to be tested and verified more, but seems to work.

So many changes... and it seems to work quite well.

However like I said, I still didn't get the chance to try out redux-saga. That's for another day... unless you manage to get it working first :).