Type error when using useInfiniteQuery
Argument of type '{ cursor: number; location: string; }' is not assignable to parameter of type 'Omit<{ cursor: string; location: string; }, "cursor">'.
Object literal may only specify known properties, and 'cursor' does not exist in type 'Omit<{ cursor: string; location: string; }, "cursor">'.Argument of type '{ cursor: number; location: string; }' is not assignable to parameter of type 'Omit<{ cursor: string; location: string; }, "cursor">'.
Object literal may only specify known properties, and 'cursor' does not exist in type 'Omit<{ cursor: string; location: string; }, "cursor">'.That's the type error I am getting.
I am using trpc with nextjs
This is the query I am making:
const {
data,
isLoading,
error,
hasNextPage,
isFetchingNextPage,
fetchNextPage,
} = api.products.getAllByLocationPaginated.useInfiniteQuery(
{ cursor: page, location },
{
enabled: locationSelected,
getNextPageParam: (lastPage) =>
lastPage.currentPage === lastPage.totalPages ? null : lastPage.nextPage,
getPreviousPageParam: (page) => page.prevPage,
}
); const {
data,
isLoading,
error,
hasNextPage,
isFetchingNextPage,
fetchNextPage,
} = api.products.getAllByLocationPaginated.useInfiniteQuery(
{ cursor: page, location },
{
enabled: locationSelected,
getNextPageParam: (lastPage) =>
lastPage.currentPage === lastPage.totalPages ? null : lastPage.nextPage,
getPreviousPageParam: (page) => page.prevPage,
}
);This is how it's handled on the trpc router:
getAllByLocationPaginated: publicProcedure
.input(z.object({ location: z.string(), cursor: z.string() }))
.query(async ({ input }) => {
const { data } = await axios.get<{
prevPage: number;
currentPage: number;
nextPage: number;
totalPages: number;
products: IProduct[];
}>(
`${baseUrl}/products/get-all-paginated-by-location-code/?pageNumber=${input.cursor}&warehouseCode=${input.location}`
);
if (!data) {
throw new TRPCError({
code: "NOT_FOUND",
message: "Failed to fetch products!",
});
}
return data;
}), getAllByLocationPaginated: publicProcedure
.input(z.object({ location: z.string(), cursor: z.string() }))
.query(async ({ input }) => {
const { data } = await axios.get<{
prevPage: number;
currentPage: number;
nextPage: number;
totalPages: number;
products: IProduct[];
}>(
`${baseUrl}/products/get-all-paginated-by-location-code/?pageNumber=${input.cursor}&warehouseCode=${input.location}`
);
if (!data) {
throw new TRPCError({
code: "NOT_FOUND",
message: "Failed to fetch products!",
});
}
return data;
}),
