useMutation 'invalidates' field

[UltimateGG]

From the docs:

Usually when a mutation in your app succeeds, it's VERY likely that there are related queries in your application that need to be invalidated and possibly refetched to account for the new changes from your mutation.

With the removal of the onSuccess hook, something for QOL could be implemented:

useMutation({
    mutationFn: async () => {
      await updateTodo();

      // await queryClient.invalidateQueries({ queryKey: ['todos'] }); // Moved
    },
    invalidates: ['todos']
  });

Where if the mutation succeeds, the query keys in the invalidates array are refetched automatically.

Not sure if this breaks any react query methodology but just a suggestion that could save some lines as its a very common pattern.

[TkDodo]

With the removal of the onSuccess

onSuccess wasn't removed from mutations ...

as its a very common pattern.

there are too many different cases to consider, for example:

• should this run in onSuccess or in onSettled ?
• should the invalidations be awaited, or should they fire as background refetches. The differences determines how long the mutation itself stays in pending state.
• what happens if you provide additional invalidations in callbacks? Will they be merged or will they cancel each other out?
• do you only allow one key, or should it be an array of keys?

Because of questions like this, and likely everybody expecting something slightly different depending on their use-case, we haven't implemented anything like that. That said, it's very easy to do this in user-land with meta and global cache callbacks:

const queryClient = new QueryClient({
  const mutationCache = new MutationCache({
    onSuccess: async (_data, _variables, _context, mutation) => {
      if (mutation.meta.invalidates) {
        await queryClient.invalidateQueries(mutation.meta.invalidates)
      }
    }
  })
})

usage:

useMutation({
    mutationFn: async () => {
      await updateTodo();
    },
    meta: {
      invalidates: ['todos']
    }
  });

[UltimateGG]

Awesome! Is onSuccess recommended still for mutations or is there a better pattern?

[TkDodo]

onSuccess or onSettled - whatever suits you better