HYDRATE Action Dispatched twice with redux-toolkit

[AlaaMX]

When using the redux toolkit and configuring store and importing slices the Hydrate action is dispatched twice for each page on SSR and SSG even when not using App.getInitialProps !

[fostyfost]

Do you use react strict mode?

[igdev116]

Same, It's send duplicate data whenever I refresh f5 my page

[magicDvlp]

Also faced this problem. Hydration occurs twice when using redux toolkit.

[kirill-konshin]

Can anyone provide a reproducible scenario? Issues w/o codesandbox are not reviewed.

FYI https://github.com/kirill-konshin/next-redux-wrapper#app-and-getserversideprops-or-getstaticprops-at-page-level there are cases when HYDRATE can be dispatched twice.

[WanLinLin]

Seems it's because reactStrictMode: true in next.config.js. If reactStrictMode is enabled, withRedux(App)'s constructor is called twice. Therefore we got 2 HYDRATE actions.

I've made a codesandbox here. In the repo, toast is pushed only once in pages/index.js's getServerSideProps. But the console logs two toasts.

https://codesandbox.io/s/gifted-sun-mjun5

If I change reactStrictMode to false, the console only logs one toast.

However, it's only affected in development mode. See https://reactjs.org/docs/strict-mode.html#detecting-unexpected-side-effects

[kirill-konshin]

@WanLinLin https://github.com/kirill-konshin/next-redux-wrapper/pull/419 check the new PR

[0x29a]

@WanLinLin, @kirill-konshin, I still experience the issue with the two consecutive hydration actions when reactStrictMode is enabled. Am I right, that such behavior is expected?

[WanLinLin]

Hi @0x29a, please disable reactStrictMode so you won't get two hydration actions.

[0x29a]

Hey @WanLinLin, thanks for the suggestion. Indeed, it works. However, doesn't this option exist to detect some undesired side effects during development?

[kirill-konshin]

@WanLinLin is absolutely right, it is the behavior baked in Strict Mode, this library has nothing to do with it. Moreover, I should not override it anyhow. The entire tree has to be rendered twice, by design of Strict Mode.