jotai/urql suspends forever with React concurrent mode

pmndrs / jotai

👻 Primitive and flexible state management for React

https://jotai.org

MIT License

18.67k stars 614 forks source link

jotai/urql suspends forever with React concurrent mode #1358

Closed lukechu10 closed 2 years ago

lukechu10 commented 2 years ago

When using jotai/urql with React 18 in concurrent mode, the component is suspended forever.

Example:

Non concurrent mode (ReactDOM.render): https://codesandbox.io/s/jotai-urql-react-17-gwbou1
Broken: Concurrent mode (root.render): https://codesandbox.io/s/jotai-urql-react-18-broken-47bdb9

dai-shi commented 2 years ago

Thanks for reporting. Didn't know that. We need to add tests. Would you be willing to help??

I'm planning to have a big rewrite for jotai/urql to mainly support error handling. Let's tackle this too.

Wait, you need to have <Suspense> inside <Provider>. Can you try?

lukechu10 commented 2 years ago

Ah yes, that fixed it: https://codesandbox.io/s/jotai-urql-react-18-broken-forked-g9lznj

Do you still want to keep this issue open? It's not immediately obvious why Suspense needs to be inside Provider.

dai-shi commented 2 years ago

If Provider is inside Suspense, when a component suspends, Provider with all atom values is cleared with remount (this maybe happens only for the initial render). (I think it's described somewhere in docs, but it should probably be more clarified.)

Closing this.