Is there a way to monitor queries from a parent component?
Hello! I'm currently trying to figure out the best way to monitor queries in a parent component that are happening in children components.
Consider something like this:
Each
My thinking was that I could look at the QueryCache in the
- QueryCache API. This seemed like the way to go since I can easily monitor all queries. Originally I intended to have this in my
- QueryObserver API. This seems to work very well as I have the entire request (status, data, etc) of a query I want to observe. But the issue is it requires the same query key and query function, which might not always be easy to get from a child component to a parent component.
- Utilizing
Anyway, I'd love some more thoughts on this. It seems like observing queries running in child components from some arbitrary parent component could be a powerful pattern, and I'm guessing people have run into similar situations like this before, so I'd love to hear your experiences. Thank you!
Consider something like this:
Each
ChildComponentuseQueryuseQueriesNoAuthFallbackPagechildrenPermissionGateMy thinking was that I could look at the QueryCache in the
PermissionGate- QueryCache API. This seemed like the way to go since I can easily monitor all queries. Originally I intended to have this in my
PermissionGate- QueryObserver API. This seems to work very well as I have the entire request (status, data, etc) of a query I want to observe. But the issue is it requires the same query key and query function, which might not always be easy to get from a child component to a parent component.
- Utilizing
ErrorBoundaryPermissionGateErrorBoundarythrowOnError: trueChildComponentNoAuthFallbackPageAnyway, I'd love some more thoughts on this. It seems like observing queries running in child components from some arbitrary parent component could be a powerful pattern, and I'm guessing people have run into similar situations like this before, so I'd love to hear your experiences. Thank you!
The QueryCache is the storage mechanism for TanStack Query. It stores all the data, meta information and state of queries it contains.
Normally, you will not interact with the QueryCache directly and instead use the QueryClient for a specific cache.
Normally, you will not interact with the QueryCache directly and instead use the QueryClient for a specific cache.
QueryObserver
The QueryObserver can be used to observe and switch between queries.
The QueryObserver can be used to observe and switch between queries.
