Small question

[VictorPulzz]

Hello! Can you help me with some problem? How I can implement several redux persist for different object in store. For example: I have this tree structure:

store: {
     user: {
        token: ... ,
        name: ...
     },
     global: {
        theme: ....
     }
}

I want split on module, and in every module set: global module: user module: Can you help me, or share example (without react-toolkit) Many thanks!:)

[VictorPulzz]

Also, could you show how to connect several middlewares?

[bjoluc]

How I can implement several redux persist for different object in store.

You mean how can you persist several subtrees of your state? With Redux Persist or with next-redux-cookie-wrapper? With Redux Persist, your setup looks just fine – you simply persist the reducers individually. With next-redux-cookie-wrapper, you do not configure persistence on a reducer level, but globally. That is, you would use

{ subtrees: ["user.userData"] }

to configure the middleware according to your "user module" screenshot. Does that answer your question?

Also, could you show how to connect several middlewares?

The Redux docs are your friend: https://redux.js.org/api/applymiddleware

[VictorPulzz]

@bjoluc Thank you for answers! Yesterday I carefully studied everything and I managed to connect your library, thank you very much for your work! :D

I only have one last question left: 1 - I have connected your library and configured it. Now I store data in a cookie that needs to be transmitted to the server (admit a token) (I also connected Redux-Persist to store data in local storage that is not needed at the SSR level)

2 - Then I save the user's token in a cookie, but after the page has been rendered, it didn't sync with the Store until I used in any component method - getServerSideProps. Correctly, I understand, it works like this - First, you check isServer, if this is the server your lib calls dispatch with data from the cookie (SSR), and I need to process them using the method: HYDRATE (where it need).

Sorry for the big questions, I just want to clarify! xD

[bjoluc]

You're right about the HYDRATE action on the server. However, you should not need to modify the HYDRATE reducer specifically for next-redux-cookie-wrapper, since HYDRATE is used on the server and the client anyway (https://github.com/kirill-konshin/next-redux-wrapper#how-it-works). Consider using the debug option of next-redux-wrapper and maybe logging the payload of the HYDRATE action to the console. If a cookie is present for user.token, the state should be contained in the first HYDRATE action on the server – unless you are using getStaticProps, of course.

---

Offtopic: There are a few obsolete spreads in your code – maybe check your applyMiddleware() call and the HYDRATE reducer. You can also spread undefined! Plus: You could get rid of large portions of your code using configureStore from redux-toolkit!

[VictorPulzz]

Thanks! Yea, I already thought about React toolkit) About HYDRATE, I don't know why, but my HYDRATEis called only when I use getServerSideProps somewhere, if I don't have getServerSideProps (in any component), then HYDRATE is not called when the application is first loaded) :)

[bjoluc]

if I don't have getServerSideProps (in any component), then HYDRATE is not called when the application is first loaded) :)

I think that makes sense, given that next-redux-cookie-wrapper can only read cookies in "Phase 1" which seems to be skipped if no getServerSideProps function is present.

[VictorPulzz]

Thanks you very much!

[bjoluc]

You're welcome!