ambitious-aqua

Type for global error in QueryCache & MutationCache

I have a little issue. I want to define my own types for global onError callback in queryCache & mutationCache. I need error to be type of AxiosError. I can't find a working solution. I'd be glad if someone helped me. Thanks!

const [queryClient] = useState(
  () =>
    new QueryClient({
      queryCache: new QueryCache({
        onError: (error) => {
          // "error" is of type Error but I need AxiosError
        },
      }),
      mutationCache: new MutationCache({
        onError: (error) => {
          // Same here, "error" has to be type of AxiosError
        },
      }),
      defaultOptions: {
        queries: {
          staleTime: 10 * 60 * 1000,
        },
      },
    }),
);

const [queryClient] = useState(
  () =>
    new QueryClient({
      queryCache: new QueryCache({
        onError: (error) => {
          // "error" is of type Error but I need AxiosError
        },
      }),
      mutationCache: new MutationCache({
        onError: (error) => {
          // Same here, "error" has to be type of AxiosError
        },
      }),
      defaultOptions: {
        queries: {
          staleTime: 10 * 60 * 1000,
        },
      },
    }),
);

2 Replies

extended-salmon•2y ago

It's quite well documented: https://tanstack.com/query/v5/docs/framework/react/typescript#typing-the-error-field https://tanstack.com/query/v5/docs/framework/react/typescript#registering-a-global-error

TypeScript | TanStack Query Docs

React Query is now written in TypeScript to make sure the library and your projects are type-safe! Things to keep in mind:

ambitious-aquaOP•2y ago

Thanks, I've tried it but forgot

import "@tanstack/react-query";

import "@tanstack/react-query";

💀

Gaming

Programming

Type for global error in QueryCache & MutationCache

Did you find this page helpful?