(v4) invalidateQueries + refetchPage + refetchType: 'none' does not work

[alioshr]

I am currently using V4 (stuck on React 17) and have the following scenario:

• I am using useInfiniteQuery and have the following requirements:

I have a queries with this structure: ['myUniquePrefix', 'my multiple complex filtering string result', 'myUniqueWhateverEntityId']

It is a table and it has various filters etc.

• For 2 min all of the queries derived from 'myUniquePrefix' must be cached (staleTime)
• After 2 min I need to mark all queries derived from my 'myUniquePrefix' as stale and ensure to have just page 1 is refetched once a user triggers a new request.

I thought that I could just combine invalidateQueries + refetchType: 'none' + refetchPage to ensure that I would mark all queries as stale and still ensure to refetch just the first page of each query (in case any of them have more than 1 page saved).

1. Get all queries related to my unique prefix:

 const cachedQueries = getCache(queryClient, queryKey);

  if (!cachedQueries?.length) return;

  cachedQueries.forEach(async (c) => {
    const cachedQueryKey = c[0];

  // Invalidated my queries below 

1. Invalidate in the loop

await queryClient.invalidateQueries<InfiniteData<unknown>>({
    queryKey: cachedQueryKey,
    refetchType: 'none',
    refetchPage: (lastPage, index) => {
      return index === 0;
    },
  });

Docs here for refetchPage

Result: It invalidated, but it still fetches all pages saved in cache.

So this made me go a BIG way around to solve the issue.

I had to have staleTime & cacheTime as Infinity and manually manage cache & query state (invalidate) manually in an interval callback + lazy invalidation of active queries. All manually. It feels really bad to need to write so much code for something that should work out of the box.

My hopes here is that I am totally wrong and there is a very simple way to achieve what I want =D