1

I am using react-query, I have used useInfinteQuery.
I'm getting error in getNextPageParams.

I have created queriesandmutaion.tsx file and write the code in it:

     return useInfiniteQuery({
         queryKey: [QUERY_KEYS.GET_INFINTE_POSTS],
         queryFn: getInfintePost,
         getNextPageParam: (lastPage) => {
             //if there's no data there are no more page
             if(lastPage && lastPage.documents.length === 0){
                 return null;
             }
 
             const lastId = lastPage?.documents[lastPage.documents.length - 1].$id;
             return lastId;
         }
    }) };

Error of getNextPageParam is:

Error of getNextPageParam

Wrote my code for getInfintePost in api.tsx:

export async function getInfintePost({ pageParam }:{ pageParam: number}){
  
  const queries: any[] = [Query.orderDesc("$updatedAt"), Query.limit(9)];
    
  if(pageParam) {
    queries.push(Query.cursorAfter(pageParam.toString()));
  }
  
  try {
    const posts = await databases.listDocuments(
      appwriteConfig.databaseId,
      appwriteConfig.postCollectionId,
      queries,
    );

    if(!posts) throw Error;

    return posts;
  } 
  
  catch (error) {
    console.log(error);
  }
};

Using this useGetPost in explore.tsx:

const { data: posts, fetchNextPage, hasNextPage } = useGetPosts();

Mentioned error while deploying:

[21:59:13.838] Running build in Washington, D.C., USA (East) – iad1
[21:59:13.952] Cloning github.com/Ishu070303/CircleUp (Branch: master, Commit: 9a9b9b2)
[21:59:14.293] Cloning completed: 343.289ms
[21:59:14.314] Previous build cache not available
[21:59:14.520] Running "vercel build"
[21:59:15.019] Vercel CLI 33.2.0
[21:59:15.770] Installing dependencies...
[21:59:24.078] 
[21:59:24.079] added 348 packages in 6s
[21:59:24.079] 
[21:59:24.080] 69 packages are looking for funding
[21:59:24.080]   run `npm fund` for details
[21:59:24.109] Detected `package-lock.json` generated by npm 7+
[21:59:24.111] Running "npm run build"
[21:59:24.635] 
[21:59:24.635] > [email protected] build
[21:59:24.635] > tsc && vite build
[21:59:24.636] 
[21:59:29.976] src/_root/pages/PostDetails.tsx(15,52): error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
[21:59:29.976]   Type 'undefined' is not assignable to type 'string'.
[21:59:29.977] src/lib/react-query/queriesAndMutations.ts(167,29): error TS2769: No overload matches this call.
[21:59:29.977]   Overload 1 of 3, '(options: UndefinedInitialDataInfiniteOptions<any, Error, InfiniteData<any, unknown>, QUERY_KEYS[], any>, queryClient?: QueryClient | undefined): UseInfiniteQueryResult<...>', gave the following error.
[21:59:29.978]     Argument of type '{ queryKey: QUERY_KEYS.GET_INFINTE_POSTS[]; queryFn: any; getNextPageParam: (lastPage: any) => any; }' is not assignable to parameter of type 'UndefinedInitialDataInfiniteOptions<any, Error, InfiniteData<any, unknown>, QUERY_KEYS[], any>'.
[21:59:29.978]       Property 'initialPageParam' is missing in type '{ queryKey: QUERY_KEYS.GET_INFINTE_POSTS[]; queryFn: any; getNextPageParam: (lastPage: any) => any; }' but required in type 'UseInfiniteQueryOptions<any, Error, InfiniteData<any, unknown>, any, QUERY_KEYS[], any>'.
[21:59:29.978]   Overload 2 of 3, '(options: DefinedInitialDataInfiniteOptions<any, Error, InfiniteData<any, unknown>, QUERY_KEYS[], any>, queryClient?: QueryClient | undefined): DefinedUseInfiniteQueryResult<...>', gave the following error.
[21:59:29.978]     Argument of type '{ queryKey: QUERY_KEYS.GET_INFINTE_POSTS[]; queryFn: any; getNextPageParam: (lastPage: any) => any; }' is not assignable to parameter of type 'DefinedInitialDataInfiniteOptions<any, Error, InfiniteData<any, unknown>, QUERY_KEYS[], any>'.
[21:59:29.978]       Property 'initialPageParam' is missing in type '{ queryKey: QUERY_KEYS.GET_INFINTE_POSTS[]; queryFn: any; getNextPageParam: (lastPage: any) => any; }' but required in type 'UseInfiniteQueryOptions<any, Error, InfiniteData<any, unknown>, any, QUERY_KEYS[], any>'.
[21:59:29.978]   Overload 3 of 3, '(options: UseInfiniteQueryOptions<any, Error, InfiniteData<any, unknown>, any, QUERY_KEYS[], any>, queryClient?: QueryClient | undefined): UseInfiniteQueryResult<...>', gave the following error.
[21:59:29.978]     Argument of type '{ queryKey: QUERY_KEYS.GET_INFINTE_POSTS[]; queryFn: any; getNextPageParam: (lastPage: any) => any; }' is not assignable to parameter of type 'UseInfiniteQueryOptions<any, Error, InfiniteData<any, unknown>, any, QUERY_KEYS[], any>'.
[21:59:29.979]       Property 'initialPageParam' is missing in type '{ queryKey: QUERY_KEYS.GET_INFINTE_POSTS[]; queryFn: any; getNextPageParam: (lastPage: any) => any; }' but required in type 'UseInfiniteQueryOptions<any, Error, InfiniteData<any, unknown>, any, QUERY_KEYS[], any>'.
[21:59:30.019] Error: Command "npm run build" exited with 2
[21:59:30.207] 

I apologize, but I am unable to upload images as it is not working. This is my first time, so please help me with the deployment.

1
  • Would be also nice if you could post your code snippets directly as text [when adequate] (not just images), so any viewer could reproduce them literally. Even more, to be able to do copy-paste that could detect any typo instantly. Commented Jan 20, 2024 at 18:09

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.