new QueryClient instantiated in a function component

export const RQClientProvider = ({
  children,
}: {
  children: React.ReactNode;
}) => {
  const toast = useToastController();
  const queryClient = new QueryClient({
    defaultOptions: {
      queries: {
        retry: 1,
        refetchOnWindowFocus: false,
        staleTime: 10_000,
      },
    },
    queryCache: new QueryCache({
      onError: (error_: any) => {
        const error = error_ as AxiosError;
        toast.show("Error", {
          customData: {
            preset: "error",
          },
          message:
            error.response?.status === 404 ? "Not found" : error.message,
        });
      },
    }),
  });

  return <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>;