TanStackT
TanStack•16mo ago•
2 replies
thick-teal

Using react/query for non-async/global store.

Hey all I am attempting to use React Query to store some positions I am calculating onLayout.
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";

export const useGetLinePositionById = ({ id }: { id: string }) => {
  return useQuery({
    queryKey: ["line_positions", id],
    initialData: [],
  });
};

export const useSetLinePositions = () => {
  const queryClient = useQueryClient();
  return useMutation({
    mutationFn: async (data: any) => {
      return data;
    },

    onSuccess: (data) => {
      queryClient.setQueryData(["line_positions", data.id], (old) => {
        console.log("data", data);
        return data.line_positions;
      });
    },
  });
};

I can see in my log, I am getting the data correctly in my mutation, but my query in my component is not being updated
  const { data: linePositions } = useGetLinePositionById({ id: id as string });

console.log('linePositions', linePositions) // logs []

any ideas? Thanks for looking!
Was this page helpful?