How to check, whether query with accurate data comes from cache?

[zgrybus]

Hello,
I guess, I found a issue that is blocking my current "task".
What I want to achieve?

1. User goes to /form page and he fetches data ( that I shared below )

type MyCompProps = {
  id: string;
};
const MyComp: React.FC<MyCompProps> = ({ id }) => {
  const { data } = useQuery({
    queryKey: ['TODO', id],
    queryFn: () => ({ percent: 2 | 5 | 1 }), 
  });

  if (!data?.percent !== 1) {
    return null;
  }

  return <div>You completed form!</div>;
};

2. When isCompleted is set to true, we want to show You completed form! text - BUT ONLY, WHEN previous data was 0.5.

So.. how can I find out if the previous percent value was 0.5? I may invalidate that query in other screens as well.

I tried with getQueryData, getQueryCache, but these values are always the same as data :( Is there any solution for that?

[TkDodo]

you can read previous data inside the queryFn:

useQuery({
    queryKey: ['TODO', id],
    queryFn: ({ queryKey }) => {
      const previousData = queryClient.getQueryData(queryKey)
      const newData = await fetch(...)
      // now do with those two what you want ...
    }
})