Instantsearch.js: Hits shown for empty search

[smkhalsa]

I'm using react-instantsearch on react native. When I first open the search screen, the connected searchBox is empty, but my hits ListView is populated with results.

[vvo]

Hi @smkhalsa to solve this you can do:

import {Hits} from 'react-instantsearch/dom';
import {connectSearchBox} from 'react-instantsearch/connectors';

const Results = connectSearchBox(
  ({currentRefinement}) =>
  currentRefinement
  ? <Hits />
  : null
);

What it does is looking at the current query before trying to display Hits.

It's not perfect because it will still trigger a search, @mthuret any idea?

[mthuret]

The Conditional Display trick can also be used. But it will not solve the extra search issue.

[bobylito]

In the context of an app, you can decide not to display the whole instantsearch until you reach a specific route / state of the app. Would you like to display the search bar even though you are not searching? This first request is based on our experience of search, it initiates the conversation with the user and displays the items based on your metrics (custom ranking). This is usually recommended to do that @smkhalsa

[vvo]

@smkhalsa If you still need help on this, please add a new comment to the issue.

[fatbattk]

There really should be an option to NOT have default hits on an empty search.

Using the autocomplete search box with _searchAsYouType_ and _debounce_ will always create a flicker of results since the initial hits is always filled. Tried force blanking out the results but the default hits always gets returned.

Or is this a separate issue that I should file?

[francoischalifour]

There's a section on our Conditional Display page that talks about handling empty queries. There are two workarounds for now. We are aware that those are not optimal though.