Mutate in useQuery

[bpCodes]

If i have multiple useQuery instances when I make a mutation in onSuccess it fetches multiple times

Example

const { status, data, isFetching, error, failureCount, refetch } = useQuery(
    ["todos", { filter }],
    () => fetchTodos({ filter }),
    {
      onSuccess: (data) => {
        if(data.length === 0){
          return finishTask.mutate({ taskName: "Some" });  
        }
      }
    }
  );

.mutate sends multiple request

Why is this happening?

[TkDodo]

Because onSuccess is called for every useQuery instance.

[bpCodes]

is there a recommended way to make dependant mutation? Because the only way I think is

  const { data } = useQuery());

  React.useEffect(() => {
    if(data && data.length === 0){
      finishTask.mutate()
    }
  }, [data])

Thanks for response

[TkDodo]

the effect will also run once for every component that has the effect, so it's pretty much the same as using onSuccess. Only difference is that onSuccess is not called if data is only read from the cache, e.g. if you have a staleTime set.

The global cache callbacks provide a way to perform side effects globally once.

You could also just run a second request in side the queryFn.