Custom Select dropdown for paginated data. | Mantine | Page 1

I have a list of paginated data to 'feed' my selection component, and to solve this, I planned to use the Infinite Queries feature (https://tanstack.com/query/v4/docs/react/guides/infinite-queries) following the first example from the link. However, I haven't found a way to render my list of data along with the button to add more data from the next pages within the dropdown of the Select component. Is there a more correct way to solve this?

Infinite Queries | TanStack Query Docs

Rendering lists that can additively "load more" data onto an existing set of data or "infinite scroll" is also a very common UI pattern. TanStack Query supports a useful version of useQuery called useInfiniteQuery for querying these types of lists.

When using useInfiniteQuery, you'll notice a few things are different:

#Custom Select dropdown for paginated data.