useQuery handle logout for 401 errors in global callback

const queryClient = new QueryClient({
  queryCache: new QueryCache({
    onError: (error, query) => {
      console.log("error triggered onError");
      if (error.response?.status === 401) {
        // i want to handle logout here
      }
      if (query.state.data !== undefined) {
        toast.error(`Something went wrong: ${error.message}`);
      }
    },
  }),
});

const queryClient = new QueryClient({
  queryCache: new QueryCache({
    onError: (error, query) => {
      console.log("error triggered onError");
      if (error.response?.status === 401) {
        // i want to handle logout here
      }
      if (query.state.data !== undefined) {
        toast.error(`Something went wrong: ${error.message}`);
      }
    },
  }),
});

const logoutUserAsync = () => {
  return authFetch("/auth/logout");
};
export const useLogoutUser = () => {
  const queryClient = useQueryClient();
  const navigate = useNavigate();

  return useMutation({
    mutationFn: logoutUserAsync,
    onSuccess: () => {
      navigate("/login");
      queryClient.clear();
      queryClient.removeQueries("user");
    },
  });
};

const logoutUserAsync = () => {
  return authFetch("/auth/logout");
};
export const useLogoutUser = () => {
  const queryClient = useQueryClient();
  const navigate = useNavigate();

  return useMutation({
    mutationFn: logoutUserAsync,
    onSuccess: () => {
      navigate("/login");
      queryClient.clear();
      queryClient.removeQueries("user");
    },
  });
};