Error in react query Typescript while deploying on vercel

117 views Asked by At

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.

0

There are 0 answers