kirill-konshin / next-redux-wrapper

Redux wrapper for Next.js

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

HYDRATE happens too many times

ra250416 opened this issue · comments

Describe the bug

After upgrading to v8.0.0, I see that that there is an additional dispatch of the HYDRATE action upon loading a statically generated page in the browser. This breaks a lot of essential functionality in the app, as it causes the state to be reset.

   "@reduxjs/toolkit": "^1.8.3",
    "next": "^12.2.4",
    "next-redux-wrapper": "^8.0.0",
    "react": "^18.2.0",
    "react-redux": "^8.0.2"

Expected behavior

HYDRATE only happens once

Screenshots

image

Additional context

_app.tsx

export const App = ({ Component, ...rest }: AppProps) => {
  const { store, props } = wrapper.useWrappedStore(rest);
  const { appShellProps, ...restOfPageProps } = props.pageProps;
  return (
    <Provider store={store}>
      <ThemeProvider theme={theme}>
        <AppShell {...appShellProps}>
          <Component {...restOfPageProps} />
        </AppShell>
      </ThemeProvider>
    </Provider>
  );
};

Issue did not occur in v7.0.5

looks like duplicate #496

I think there is a difference between #496 since that seems to go away by not using wrapper.getInitialAppProps, which I'm not doing anyway.

commented

@ra250416 I think #502 might fix this. Can you try that?

@voinik @kirill-konshin
OMG, this issue seems like my case, but i already open a question in stackoverflow.
stackoverflow
Is my case are related to this issue ? Need to uprade 8.1.0 version ?

commented

@dc198689 see my comment above

@ra250416 I think #502 might fix this. Can you try that?

@voinik Thanks a lot to reply !
I have to see that, but the conversation too long, I still feel confused and don't know where I can change my code.
Any summarize in the case ?

commented

@dc198689 Np, one way is to remove this package from your package.json, create a new file in your repo (‘next-redux-wrapper.tsx’ for example), and paste in the code from #502 from the ‘packages/wrapper/src/index.tsx’ file in this repo.

Then use your new file everywhere instead of the node_modules package

@voinik
Thanks bro, I will try later,
Will the next-redux-wrapper package plan to release a new version include the fix in the future ?
OR if I downgrade to 7.0.5 version, is it the best solution ?

commented

@dc198689 No problem! #502 is planned to be merged, but it depends on when @kirill-konshin has time to review it. Hopefully it’ll be soon 🙂

In the meantime you can downgrade, sure. Although I’d love to know if #502 fixes your problem