Declaring dependencies and auto-invalidating
To keep my components cleared of query logic, passing around query keys to child components and/or bubbling them up to parents, I'd ideally like to simply declare a relation/dependency somewhere. So that when api/entities/registration is posted to, api/entities/ and api/entity-types/ gets invalidated automatically.
E.g. you have a list view with a create button, which opens up a child component that adds something to said list through the backend, meaning you'd want to invalidate the list's query-key at that on-submit point via the child's onSuccess mutation. As far as I know, you'd pass the list's querykey to the child or have a callback onSubmit exposed from the child that the parent provides, meaning one of them still has to get the QueryClient and then call its invalidate along with the appropriate key.
Since I have many different pages doing the same logic, just to different entity-types, I'd ideally just not have any of the invalidation and querykey-management logic in those components. Any tips?
Context, for if it matters: Using Orval to generate the API from an OpenApi file, meaning I have generated hooks.
2 Replies
inland-turquoise•2y ago
use the global onSuccess callback of the MutationCache and do the invalidation there depending on the
mutationKey (or meta) of the mutationstormy-goldOP•2y ago
I'll check it out, thanks for the tip!