fix(autocomplete): hide header when there are no items to display

[FabienMotte]

Summary

This PR fixes the headerComponent being displayed even when there are no items, such as when using showRecent.headerComponent without any recent searches.

Result

Before

After

[Haroenv]

fix looks good, can you add a test?

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 2db7a3f:

Sandbox	Source
example-instantsearch-getting-started	Configuration
example-react-instantsearch-getting-started	Configuration
example-react-instantsearch-next-app-dir-example	Configuration
example-react-instantsearch-next-routing-example	Configuration
example-vue-instantsearch-getting-started	Configuration

[Haroenv]

so the issue is that unlike other sources, which only render if there are results, recent searches is rendered, and therefore renders the header. This feels like a correct fix, but alternatively we also could have made the whole recent searches source conditional based on the items, and not just the header, as we now are still rendering the parent div.

[FabienMotte]

so the issue is that unlike other sources, which only render if there are results, recent searches is rendered, and therefore renders the header. This feels like a correct fix, but alternatively we also could have made the whole recent searches source conditional based on the items, and not just the header, as we now are still rendering the parent div.

Good point, should I also add a condition to only display the "Recent searches" source when there are items to show?
Or should we return null if there are no items to display in the AutocompleteIndex component?