How to handle the loader in a common way(middleware) using RTK Query?

Question

I am new to RTK queries, and I like to work with RTK queries.

In my project, I would like to add a common loader where if any request is running show the page loader and once the response comes back either success or failure, I would like to hide the loader.

Please let me know if anyone has more context on this.

Thanks in Advance.

Answer 1

Right now, nothing like that is implemented out of the box - but of course, the data is all available in the Redux store.

So you can probably do something like (pseudocode, check with the devtools if I have all the data structures right here, I can't look it up right now)

const isAnythingLoading = useSelector(state => Object.values(state.api.queries).some(entry => entry.status == 'loading'))