-
|
Hi community, Has anyone experienced an infinite query that does not return page params correctly when it reaches the 3 index of the array? Am I missing something with my implementation? useInfiniteQuery hook Page params array result I tested my API and is working correctly |
Beta Was this translation helpful? Give feedback.
Answered by
TkDodo
Aug 19, 2024
Replies: 1 comment 4 replies
-
|
@TkDodo Sorry to tag you, but I'm still stuck trying to make it work. I hope you can help me. |
Beta Was this translation helpful? Give feedback.
4 replies
-
|
you are not using the |
Beta Was this translation helpful? Give feedback.
Answer selected by
csulit
-
Thanks you solved my problem! Now it's a type problem react query now return unknown type? import axios from 'axios';
import { useInfiniteQuery } from '@tanstack/react-query';
import { Configs } from '@/constants/Configs';
import { cleanObject } from '@/utils/clean-object';
import { Property, PropertyListingSearchQuery } from '@/interface';
export const useInfinitePropertyListingSearch = (
params: Partial<PropertyListingSearchQuery> = {},
enabled = false,
) => {
return useInfiniteQuery({
enabled,
initialPageParam: 1,
getPreviousPageParam: (firstPage) => {
// firstPage becomes unknown type?
return firstPage.data.previousPage;
},
getNextPageParam: (lastPage) => {
// lastPage becomes unknown type?
return lastPage.data.nextPage;
},
queryKey: ['infinite-query-property-listing', JSON.stringify(params)],
queryFn: async ({ pageParam }) => {
return await axios.get<{
properties: {
results: Property[];
};
totalRecords: number;
totalPages: number;
currentPage: number;
nextPage: number;
previousPage: number;
}>('/api/properties', {
baseURL: Configs.listdApiUrl,
params: cleanObject({ ...params, nextPage: pageParam }),
});
},
});
}; |
Beta Was this translation helpful? Give feedback.
-
|
Don't mind Copilot solves the issue thanks import axios from 'axios';
import { QueryFunctionContext, useInfiniteQuery } from '@tanstack/react-query';
import { Configs } from '@/constants/Configs';
import { cleanObject } from '@/utils/clean-object';
import { Property, PropertyListingSearchQuery } from '@/interface';
export const useInfinitePropertyListingSearch = (
params: Partial<PropertyListingSearchQuery> = {},
enabled = false,
) => {
return useInfiniteQuery({
enabled,
initialPageParam: 1,
getPreviousPageParam: (firstPage) => {
return firstPage.data.previousPage;
},
getNextPageParam: (lastPage) => {
return lastPage.data.nextPage;
},
queryKey: ['infinite-query-property-listing', JSON.stringify(params)],
queryFn: async ({ pageParam }: QueryFunctionContext) => {
return await axios.get<{
properties: {
results: Property[];
};
totalRecords: number;
totalPages: number;
currentPage: number;
nextPage: number;
previousPage: number;
}>('/api/properties', {
baseURL: Configs.listdApiUrl,
params: cleanObject({ ...params, cursor: pageParam }),
});
},
});
}; |
Beta Was this translation helpful? Give feedback.
-
|
Beta Was this translation helpful? Give feedback.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
you are not using the
pageParamthat gets injected into thequeryFnat all.