useInfiniteQuery is fetching twice the first page

Hi,

I’ve been reading the doc and trying to figure out what I’m doing wrong but.

I have this code

  const { status, data, error, isFetching, isFetchingMore, fetchMore, canFetchMore } = useInfiniteQuery(
    "activities",
    async (_key: any, nextPage = 1) => {
      return eventsServices.getActivities({ ...selectedParams, page: nextPage, perPage: 30 });
    },
    {
      getFetchMore: (lastGroup: IActivity[], groups: IActivity[][]) => {
        return lastGroup?.length ? groups.length : false;
      }
    }
  );

The firs time the page loads it will fetch my activities from page one, then when I scroll and fetchMore it’s called, it’s still fetching the first page. According to the docs, there should be a nextCursor property in lastGroup but either the docs aren’t up to date or I’m doing something wrong because I’m getting an undefined.

Also, according to the docs, By default, the info returned from getFetchMore will be supplied to the query function. So I’m wondering if there’s something I’m doing wrong but it should be pretty straight forward according to the docs.

Any help would be greatly appreciated.

[alveshelio]

Thank you very much for the help, really appreciated guys. I’ve solved the problem by completely uninstalling react-query.

[TkDodo]

Now i would either add code to the working example until it looks like your code, or work from your code backwards until it looks like the example.

Could it be that the second request you are seeing is just because of refetchOnWindowFocus, because that happens a lot…