Default mutation function, POST, PATCH, etc

[ysageev]

Hi,

We've successfully migrated our app to useQuery. The app uses a defaultQueryFn everywhere, and we've found tanstack/react-query to be very slick.

I would like to do the same thing for mutations.

Currently, we use a homebrewed useHTTP for mutations and imperative data fetching, which exposes (GET, PUT, PATCH, POST, DELETE). I would like to migrate those to useMutation

What I'm asking:

1. Is there a place to define a defaultMutationFn?
2. How, in that mutationFn, do you distinguish between a PUT, PATCH, DELETE or POST? Is it possible to have a defaultInsertFn and defaultUpdateFn etc.?

IOW, is this a thing?

// Default QC that gets attached to the Provider
const qc = new QueryClient({
	defaultOptions: {
		queries: { queryFn: defaultQueryFn },
		inserts: { insertFn: defaultInsertFn },
		updates: { updateFn: defaultUpdateFn },
		deletes: { deleteFn: defaultDeleteFn },
	},
})

🙏

[TkDodo]

Is there a place to define a defaultMutationFn?

You can add a mutationFn to defaultOptions of mutations in the QueryClient, just like you can with queries:

new QueryClient({
  defaultOptions: {
    mutations: {
      mutationFn: () => ...
    }
  }
})

How, in that mutationFn, do you distinguish between a PUT, PATCH, DELETE or POST?

That’s up to you. You can pass it in as part of the variables, or you can set meta to contain that.

Is it possible to have a defaultInsertFn and defaultUpdateFn etc.?

No because react-query isn’t tied to http

[ysageev]

Got it, thank you.