Using setQueryData inside a Mutation/QueryCache

So I am in a situation where the API, often throws MFArequired error, so i felt it is not intuitive to constantly throw a callback (onError) in a useMutation to load a state to open a modal.
So I saw on the docs we can use Mutation/QueryCache to catch the response. So I am wondering if i will run into any issues and if there is a better way to do this.

TLDR:
Can i use

setQueryData

setQueryData

inside

QueryClient

QueryClient

?

queryClient.ts

import { MutationCache, QueryCache, QueryClient } from "@tanstack/react-query";

export const allAuthQueryClient = new QueryClient({
  queryCache: new QueryCache({
    onError: (err, query) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { message: err.message });
    },
  }),
  mutationCache: new MutationCache({
    onError: (err, _variables, _context, mutation) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { payload: err as any });
    },
  }),
});

import { MutationCache, QueryCache, QueryClient } from "@tanstack/react-query";

export const allAuthQueryClient = new QueryClient({
  queryCache: new QueryCache({
    onError: (err, query) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { message: err.message });
    },
  }),
  mutationCache: new MutationCache({
    onError: (err, _variables, _context, mutation) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { payload: err as any });
    },
  }),
});

TanStack•6mo ago•

1 reply

urgent-maroon

Using setQueryData inside a Mutation/QueryCache

setQueryData

setQueryData

inside

QueryClient

QueryClient

?

queryClient.ts

import { MutationCache, QueryCache, QueryClient } from "@tanstack/react-query";

export const allAuthQueryClient = new QueryClient({
  queryCache: new QueryCache({
    onError: (err, query) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { message: err.message });
    },
  }),
  mutationCache: new MutationCache({
    onError: (err, _variables, _context, mutation) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { payload: err as any });
    },
  }),
});

import { MutationCache, QueryCache, QueryClient } from "@tanstack/react-query";

export const allAuthQueryClient = new QueryClient({
  queryCache: new QueryCache({
    onError: (err, query) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { message: err.message });
    },
  }),
  mutationCache: new MutationCache({
    onError: (err, _variables, _context, mutation) => {
      // some criteria to identify MFA required errors
      allAuthQueryClient.setQueryData(["mfaRequired"], { payload: err as any });
    },
  }),
});

Using setQueryData inside a Mutation/QueryCache

Similar Threads

Using setQueryData inside a Mutation/QueryCache

Similar Threads

Similar Threads

Similar Threads