Stop async calls in selectorFamily if component unmounts.

[artem-tarasenko]

Hey everyone,

I have a problem I have tried to solve with selectorFamily, so I was hoping maybe someone will have an idea about the solution. So...

Let's say I have an atom (atom family, doesn't really matter) with data about entities, starting with an empty array. Through user interaction, this atom will be filled with items. Each item contains an ID that can be used for an async call to API to get some data.

Looks just about right for selectorFamily async query. But here is the catch - the data on API are not immediately available and will be in about 1-5 minutes after some backend magic and queueing. So the async call is doomed to fail.

I have used recursive call with a delay - worked perfectly, with a suspended state of the component and so on, but...

How can I clean up this "effect" in case the entity is deleted?
I have tried to approach this as with useEffect and refs for a cleanup cb, passing one as a param to selectorFamily along with the ID but that doesn't work (expected).

Any ideas would be appreciated!