Using Promise.all inside component causes indefinite suspend

[EmilEriksen]

According to the migration docs waitForAll is no longer needed because you can just use Promise.all however if I use the new method the way I would normally use waitForAll my component suspends indefinitely for some reason. You can see an example here. I'm not sure if this is a bug or intended behavior.

[dai-shi]

Yeah, creating a new atom in render can cause infinite loop.

You want to define the atom outside. Here's the fix:
https://codesandbox.io/s/jotai-promise-all-indefinite-suspend-forked-80yo88?file=/src/Example.js

Granted, waitForAll as well as other utils had a special caching mechanism, which Promise.all doesn't have. Currently, there are no easy solution other than defining an atom outside component. For more complex use cases, we may need some kind of memoization. Let us know if you are in such situation.

[EmilEriksen]

Thanks for the quick reply! Yes, I suppose having to define the atom outside the render function isn't too bad, but I do think the old API
with waitForAll was a bit better DX (even though I also think v2 seems to be a fundamentally better approach overall).

I did eventually figure out the fix myself, but it took quite a while because an infinite loop isn't necessarily so easy to spot, and I was expecting Promise.all to just work the same way waitForAll works like it says in the migration docs. Maybe this issue could be added to the migration docs or somewhere else? Or if it's possible to detect, it would be even better with an error message (but that seems hard).

[dai-shi]

#1783