Loading state for useQueries?

[asheerrizvi]

Hi all,

What's the most appropriate way to check if all queries within the useQueries hook have finished? Should I just look for "some" query within the array to have status as loading (with something like Array.some) and conclude that all of them have not finished?

I currently do something like this, but I am not sure if there's a better way:

    const someQueries = useQueries(...);
    const isLoading = someQueries.some(query => query.status === 'loading');

Thanks!

[sleonia]

@asheerrizvi
Hi. Can it help in your case?
#2004

[asheerrizvi]

Oh shoot. Somehow I missed this thread when I searched for similar questions.

[mingirc]

Hi,

#2004 did not work for me.
I have been looking for a solution to the same issue.
I could not find anything after looking into React Query docs and some other sites.
At last, I tried the following solution and It worked for me. I hope it will help someone too.

const someQueries = useQueries(...);
const isQueriesLoaded = someQueries.every(item => !item.isLoading)

then use isQueriesLoaded as a boolean inside the return block of React.

[TkDodo]

you want combine in v5:

https://tanstack.com/query/v5/docs/framework/react/reference/useQueries#combine