React query not updating data even after refetch shows new data from api

I am using react query to fetch a list of items. After creating a new item, I am calling refetch on my query to get the updated list. I see a new api call is made, and the new item I just created is returned as part of the api response. However, react-query is not updating its data value.

My code has a useQuery wrapped in a hook to be able to be used in multiple places, as the query fn and its dependencies are complex:

// simplified version of the useQuery:

export const useItemsQuery = (search = "") => {
  const { user } = usePermissions();
  const filter = useStore((state) => state.projects.filter);

  const projects = useQuery({
    queryKey: [
      "Items list",
      `Items by ${filter}`,
      `User: ${user.id}`
    ],
    queryFn: () => complexQueryFunction(filter, user.id)
  });

  return projects;
};

In a few other components

// Component 1
const items = useItemsQuery()

items.data.map(...etc)
// Component 2
const items = useItemsQuery()

items.data.find(...etc)

The most confounding this is that even if I do into my react-query devtools and manually click “invalidate”, the api call is made, and a new list is fetched. I can see that the data in the api call does not match the data in the react query devtools:

In the api call, 10 items:

enter image description here

In the react query devtools, where I clicked “invalidate” that caused the above api call, 9 items:

enter image description here

I find it bizarre that not only calling refetch or queryClient.invalidateQuery({queryKey: [<the query key>]}) calls the api correctly and gets new data, but using the actual react-query devtools calls the api and gets the new data, but the data in reat-query’s cache is not updated.

What might be causing this? Someone mentioned in another question that if you had mutated the data directly in place, react-query will not work properly and not update the cache. I checked my code and I don’t believe this is the case. What else might be causing react-query to not update its .data to the value coming from the network call?