I've been struggling with this issue. I'm on react 17 and next 12.3.4
I am using an internal UI library in my next JS based app that uses the useIsSSR() from react-aria function to handle some logic.
So I did wrap my app in a SSRProvider like this
function MyApp({ Component, pageProps }) {
return (
<>
<SSRProvider>
<Component {...pageProps} />
</SSRProvider>
</>
);
}
Locally, this works fine. I printed out the value of useIsSSR() in the app, and also inside the UI library (inside the node modules) and see the value is true in both places on a server-side render.
But for some reason, in the production build, the value of useIsSSR() is true which is correct, but inside the UI library it's false. The provider isn't working properly, and isn't propagating the value all the way down. I need the value of useIsSSR() to be true inside of the component too.
Am I missing something here?
I already tried moving around the provider closer to the component, but no luck