#optimistic update via UI in different component

3 messages · Page 1 of 1 (latest)

dusk sage
#

Hey all!
I'm poking around the docs - https://tanstack.com/query/v5/docs/framework/react/guides/optimistic-updates#if-the-mutation-and-the-query-dont-live-in-the-same-component
and there's a part that i can't quite understand how to use when updating ui in a separate component that i can't seem to dig up an answer to.

I have a component making a mutation and would like to update the UI using above method. The variables returned from useMutationState is an array and the docs mention the following:

"If we need a unique key for the items, we can also select mutation.state.submittedAt. This will even make displaying concurrent optimistic updates a breeze."
Question is - how do we use the submittedAt field to narrow down the variables array appropriately? Thanks!
Link above has full context w/ example.

React Query provides two ways to optimistically update your UI before a mutation has completed. You can either use the onMutate option to update your cache directly, or leverage the returned variables...

night karma
#

narrow it down to what?

#

If you want to find "your" mutations only, give them a mutationKey and filter by that