useAsyncList prevent initial fetch - provide predicate?

[binaryartifex]

Im following along with this example here of how to make the humble search field. requirements are simple - no fetching until at least 3 debounced characters are ready to provide as the initial query. No client side filtering necessary as the api response has that handled. The response popover should be navigable via the up and down arrows while permitting further typing, which i belief useComboBox already does. Onpress for any option simply navigates to that particular page. I "think" i can achieve most of this with react-aria, but im stuck on enforcing some type of predicate against the useAsyncList on initial render, as these search items are information rich and an initial search on an empty string is expensive....

[SteffenFrankSDC]

You can just add an early return to your load callback, that returns an empty result set if the input is less than three characters long:

async load({ signal, cursor, filterText }) {
   if (!filterText || filterText.length < 3) return {items: []};
   // ...
}

[binaryartifex]

that was my initial thought as well, however you'll find that if your items array is initially empty, you need to set the allowsEmptyCollection predicate when you declare the useComboBoxState hook. what happens in this instance is that when your load predicate is met, and the results are fetched, the dropdown doesn't appear, but subsequent characters will. so the search results seem to be out of sync with the dropdown state. I did manage to fix the issue (although a few concerns remain outstanding, within an issue i submitted at #4016)