useInfiniteQuery: initial pageParams is unknown until first fetch

I have two APIs that will fetch chat messages

api/chat/private/{roomId} - fetches latest bucket, for example if the latest bucket is ID 41, it will, fetch ID 41 without specifying bucketId
api/chat/private/{roomId}/{bucketId} - fetches the specified bucket ID

pageParams = bucketId

the problem i am facing is that the app does not know what is the initial bucketId to put into the pageParams for useInfiniteQuery, so i'm using such work around

    queryFn: async ({ queryKey, signal, pageParam }) => {
      let response;
      if (pageParam === undefined) {
        response = call first API
        );
      } else {
        response = call second API with the pageParam
      }
      return response.data;
    },

    queryFn: async ({ queryKey, signal, pageParam }) => {
      let response;
      if (pageParam === undefined) {
        response = call first API
        );
      } else {
        response = call second API with the pageParam
      }
      return response.data;
    },

    queryFn: async ({ queryKey, signal, pageParam }) => {
      let response;
      if (pageParam === undefined) {
        response = call first API
        );
      } else {
        response = call second API with the pageParam
      }
      return response.data;
    },

    queryFn: async ({ queryKey, signal, pageParam }) => {
      let response;
      if (pageParam === undefined) {
        response = call first API
        );
      } else {
        response = call second API with the pageParam
      }
      return response.data;
    },

because the first API response will return the bucketId, i want to link this pageParam = bucketId instead of null after the first API is called, is there anyway to do it?

i'm trying to replace pageParams null value with pages[0].bucketId

useInfiniteQuery: initial pageParams is unknown until first fetch

Similar Threads

Similar Threads

Similar Threads