Infinite scroll or Pagination things

[kurroo10]

Hello guys, thanks for this package, so help me a lot.

it is possible for this package to implement infinite scrolling ? i mean, it will paginate to server to fetch more data when user reach the end of the scroll because i dont see any handling for scrolling

Thanks

[harshzalavadiya]

Hi @bobbyrinaldy,

Unfortunately this package isn't designed to handle infinite scrolling you might want to look at https://react-select.com/

[kurroo10]

ah, ok then , thanks for your reply btw

[scarow]

Hey there! I wanted to piggy-back this question and ask about hooking into the search functionality. When a user updates their search query, I'd like to hit the API and update the dropdown options accordingly. Is there a way to do this?

I'm currently trying to hack around the filterOptions as that seems to be the only place where the search filter gets exposed, but maybe I'm just missing it.

[scarow]

Update, I figured out how to make the API calls:

// inside react component
const [filter, setFilter] = useState('');

useEffect(() => {
    if (apiFilterFunction) {
      // call API with filter
      apiFilterFunction({ query: filter });
    }
}, [filter])

const filterOptions = (options: DropdownOption[], filter: string) => {
    if (!filter) {
      return options;
    }

    // use hook to update filter
    setFilter(filter);

    const re = new RegExp(filter, "i");
    return options.filter(({ label }) => label && label.match(re));
}

however, I am getting an error in the js console:

Warning: Cannot update a component (`Dropdown`) while rendering a different component (`SelectPanel`). To locate the bad setState() call inside `SelectPanel`, follow the stack trace as described in https://fb.me/setstate-in-render
    in SelectPanel (created by Dropdown)
    in div (created by Dropdown)
    in div (created by Dropdown)
    in div (created by Dropdown)
    in Dropdown (created by MultiSelect)
    in div (created by MultiSelect)
    in MultiSelectProvider (created by MultiSelect)
    in MultiSelect (at Dropdown/index.tsx:53)
    in div (at Dropdown/index.tsx:51)

I'm worried that I won't be able to update the dropdown with new options while it's still open without triggering this error!

[harshzalavadiya]

@scarow I have created a seprate issue to track this since async filterOptions can be a new enhancement