infinite query with pagination

[IlyaShorin]

Hello!
I'm using v4
i have struggled with this task, maybe someone can help me, explaining how i can achieve required behavior.

I have a page with an issue history, this page should have page-by-page pagination according to the backend contract.
I receive a response in the form of { data: [{}], pagination: { total: number, limit: number, page: number } }, and i store current page in query params

Currently, the page has a “show more” button, clicking on which uses useInfiniteQuery to request the next page of data. However, this way, the pagination component’s numbers do not change, and if you click on them, no data request is made.

But I need to achieve the following behavior:

1. When you click on a number in the pagination, a request is made for data from that page, and show only data from that page
2. There should be buttons above and below the history - “show next” and “show previous” - clicking on which should make a request, and the data from it should be glued to the previous result.
3. With first load of the page, query should be done to the page from query params
   Maybe someone has implemented something similar and can advise me? Maybe useInfinteQuery is not something that i need?

[TkDodo]

i don't think you want an infinite query here, but just a regular useQuery ?

[IlyaShorin]

Thank you for quick reply!
Okay, I'll try one more time with useQuery.

And I forget one question, maybe you can suggest a direction where I can find the solution.

I need to show pages in "reversed" order, pagination will start from the highest page and go to the lowest, can it be accomplish with useQuery?
I don't understand how I can send first request for data with the highest page, if I don't know yet what number is highest

[TkDodo]

I don't understand how I can send first request for data with the highest page, if I don't know yet what number is highest

how would you do that without react-query ?