How to reset a Hit list in instantSearch in a react native app?

Open Q&A
1

In a react native mobile app, I am using react-instantsearch-native <InstantSearch> in a modal to let users search and select a list of items.
I am first filtering the list with <Configure> then I use <SearchBox> to let users type the name of the item, and further reduce the list displayed using “connectInfiniteHits”.
Users can tap on an item to select it, and tap a confirm button to close the modal and continue in the app.

  • When a user selects one item, the Searchbox shows the full name of the item. How can I avoid this?
  • If the user later wants to select another item and opens the pop-up modal, the searchbox will still display the name of the last item selected, and therefore the list is filtered and shows only the last item. They first need to clear the searbox to reset the list of Hits. How can I reset the list of Hits once an item has been selected and confirmed, when I close the search modal?
2

In case this helps someone else: The search state, query field was not being reset properly after selecting an item or cancelling the search and closing the modal…

1 Like