TanStackT
TanStack13mo ago
2 replies
primary-violet

Query returning old data after mutation when manually setting data using setQueryData

import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { getCompanies } from "../services/auth";

const COMPANY_KEY = 'companies';
const SELECTED_COMPANY_KEY = 'selectedCompany';

const useCompanies = () => {
  return useQuery({
    queryKey: [COMPANY_KEY],
    queryFn: async () => {
      return getCompanies();
    },
  });
};

const useSelectedCompany = () => {
  const queryClient = useQueryClient();
  return useQuery({
    queryKey: [SELECTED_COMPANY_KEY],
    queryFn: () => {
      return queryClient.getQueryData([SELECTED_COMPANY_KEY]);
    }
  });
};


const useSelectedCompanyMutation = () => {
  const queryClient = useQueryClient();

  return useMutation({
    mutationFn: async (company) => {
      queryClient.setQueryData([SELECTED_COMPANY_KEY], company);
    },
    onSettled: async () => {
      queryClient.invalidateQueries();
    }
  });
};

export { useCompanies, useSelectedCompanyMutation, useSelectedCompany };
Was this page helpful?