useFetchers doesn't fire with idle state

[theocerutti]

Hello,

I'm trying to know when one of my fetcher (from useFetchers) has finished submitting.
In other word I want to know when my fetcher is "done".

For that I just have to check if the fetcher state go from "idle" to "loading|submitting" to "idle".

However when I use useFetchers (with an S) there are no "idle" state..
There is only "submtting" and "loading" state.

In the documentation it says it returns all the "in-flight" fetchers, does it means that it's not returning "idle" state ?

If so, how can I get done state from a fetcher using useFetchers ??

[akamfoad]

In the documentation it says it returns all the "in-flight" fetchers, does it means that it's not returning "idle" state ?

Yes, the idle fetchers are not included from the useFetchers hook.

If so, how can I get done state from a fetcher using useFetchers ??

If you're interested in one of the fetcher's state, give it a key when you use it, like below

// somewhere in the app
const fetcher = useFetcher({ key: "THE_INTERESTING_FETCHER" })

Then anywhere in your app you want to check that fetcher, you can call useFetcher with same key, and you get the same result

// somewhere else in the app
const sameFetcher = useFetcher({ key: "THE_INTERESTING_FETCHER" })

But note that if the component that calls useFetcher({ key: "THE_INTERESTING_FETCHER" }) is no longer rendered, and it doesn't have any requests in-flight, the call will return a new Fetcher instance, not the old instance, this is expected if you just want to check the state, but if you want to check data or formData, the old fetcher instance will be destryed when it's no longer active in the React tree and it doesn't have any requests going on.