I'm currently working on a feature where I need to build a dynamic dropdown that integrates with a paginated endpoint (it uses page and perPage parameters). I want this dropdown to fetch and update items dynamically as the user interacts with it.
Ideally, I'd like to avoid adding a "Load more" button or manual triggers. Instead, I'd like a scroll-based pagination (infinite scroll) so that new items are loaded automatically when the user scrolls near the bottom of the dropdown.
Has anyone here dealt with a similar use case? Are there recommended patterns or libraries to achieve this efficiently across multiple apps?
if your dropdown options are stored in a variable, I think you could use my_variable.setIn([my_variable.value.length], new_items_to_add) inside a JS Query that constantly calls your endpoint getting the next page until the items returned is less than perPage, because at this point you know there are no more items to load.... every time you get a page you'd either iterate thought the items returned and decide if you want to add it to my_variable.value using the code above or you could just add all the items returned to the end of your variable all at once and immediately get the next page.
I don't think you want to load when the user scrolls near the bottom though, depending on the persons network you could be scrolled all the way at the bottom and think that was it when really the 'loading' was just slower than your scrolling.
