useSyncExternalStore causes Error on Hydration of SSR React Page

[MikeMatrix]

Intended outcome:
MobX shouldn't throw an error and function as expected when part of a SSR stack. It should provide a getServerSnapshot parameter to the useSyncExternalStore call, which is required for hydrating pages.

Actual outcome:
Currently after the latest update (which to my knowledge moved MobX' React Integration to support useSyncExternalStore hydration of pages using MobX will cause

react-dom.development.js?ac89:16784 Uncaught Error: Missing getServerSnapshot, which is required for server-rendered content. Will revert to client rendering.
    at mountSyncExternalStore (react-dom.development.js?ac89:16784:1)
    at Object.useSyncExternalStore (react-dom.development.js?ac89:17727:1)
    at useSyncExternalStore (react.development.js?1b7e:1676:1)
    at useObserver (useObserver.js?cb83:74:25)
    at eval (observer.js?b6e3:42:27)
    at renderWithHooks (react-dom.development.js?ac89:16305:1)
    at updateFunctionComponent (react-dom.development.js?ac89:19588:1)
    at updateSimpleMemoComponent (react-dom.development.js?ac89:19425:1)
    at updateMemoComponent (react-dom.development.js?ac89:19284:1)
    at beginWork (react-dom.development.js?ac89:21673:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js?ac89:4164:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?ac89:4213:1)
    at invokeGuardedCallback (react-dom.development.js?ac89:4277:1)
    at beginWork$1 (react-dom.development.js?ac89:27451:1)
    at performUnitOfWork (react-dom.development.js?ac89:26557:1)
    at workLoopSync (react-dom.development.js?ac89:26466:1)
    at renderRootSync (react-dom.development.js?ac89:26434:1)
    at performConcurrentWorkOnRoot (react-dom.development.js?ac89:25738:1)
    at workLoop (scheduler.development.js?bcd2:266:1)
    at flushWork (scheduler.development.js?bcd2:239:1)
    at MessagePort.performWorkUntilDeadline (scheduler.development.js?bcd2:533:1)

How to reproduce the issue:
I have a fairly complex setup and sadly not enough time to provide a reproduction of the effect.
It occurs for me when I utilize the observer(Component) wrapper function, from what I can see.

Versions
4.0.2

[urugator]

I have a PR ready (#3670), but to be clear, does it throw on the server or during hydration on the client? React documentation is perhaps a bit misleading?

If you omit this argument, rendering the component on the server will throw an error.

Actually throws on the client? ...

If there is no meaningful initial value for the server rendering, omit this argument to force rendering on the client.

But then it throws ? ...

[MikeMatrix]

From what I checked, yes it throws.
To give some additional context, this is running on a nextjs setup, however the error seems to be thrown here:

https://github.com/facebook/react/blob/afea1d0c536e0336735b0ea5c74f635527b65785/packages/react-reconciler/src/ReactFiberHooks.js#L1592

I appreciate your effort, I might have the chance to check your PR out if it would fix my problem tomorrow.

[cmdcolin]

I had the same issue and tested out the PR at #3670 and looks like it fixed it for me. my setup is fairly weird...a web worker generates some html and we use it to hydrate stuff on the main thread

I added a console.log right before the throw to determine if it's on the server side (which in my case is a web worker) or main thread, and it is main thread

[cmdcolin]

might be able to see reproduction here https://codesandbox.io/s/great-carlos-l6ewrk?file=/App.js (see problems tab)

[MikeMatrix]

Just finished testing and based on 58bb052 it seems to work properly now.
Thank you very much for the fast Fix! 👍