undefined `direction` for useInfiniteQuery

I got my input schema from https://trpc.io/docs/client/react/useInfiniteQuery, and fetchNextPage / fetchPreviousPage both show undefined for direction when called, but I'm expecting "forward" or "backward" from https://tanstack.com/query/latest/docs/framework/react/guides/query-functions#queryfunctioncontext. I'm using tRPC v11 and react table v8 to implement pagination. I'm not sure if I'm misunderstanding something here, but for now I'll define direction with useState separately. Here's how I'm using infinite queries (the Button is in a different file):
const {
data: discountCodes,
isFetchingNextPage,
isFetchingPreviousPage,
isFetching,
hasNextPage,
hasPreviousPage,
fetchNextPage,
fetchPreviousPage,
} = consoleApi.codes.getDiscountCodes.useInfiniteQuery(
{
limit: pagination.pageSize,
},
{
getNextPageParam: ({ hasMoreNext, nextCursor }) => {
return hasMoreNext ? nextCursor : null;
},
getPreviousPageParam: ({ hasMorePrev, prevCursor }) => {
return hasMorePrev ? prevCursor : null;
},
},
);

...
<Button
onClick={() => {
dataFetchNextPage();
table.nextPage();
}}
...
const {
data: discountCodes,
isFetchingNextPage,
isFetchingPreviousPage,
isFetching,
hasNextPage,
hasPreviousPage,
fetchNextPage,
fetchPreviousPage,
} = consoleApi.codes.getDiscountCodes.useInfiniteQuery(
{
limit: pagination.pageSize,
},
{
getNextPageParam: ({ hasMoreNext, nextCursor }) => {
return hasMoreNext ? nextCursor : null;
},
getPreviousPageParam: ({ hasMorePrev, prevCursor }) => {
return hasMorePrev ? prevCursor : null;
},
},
);

...
<Button
onClick={() => {
dataFetchNextPage();
table.nextPage();
}}
...
Query Functions | TanStack Query Docs
A query function can be literally any function that returns a promise. The promise that is returned should either resolve the data or throw an error. All of the following are valid query function configurations:
1 Reply
antoine
antoine8mo ago
nevermind, seems to be fixed in the latest v11 beta
Want results from more Discord servers?
Add your server