Widget to filter on a specific attribute

Hello everyone,

This topic is about React-Instantsearch

I am looking to add a widget to refine my search based on a specific attribute. It would be used like this by a user:

  1. The user do a search with the searchbox on all attributes of my records
  2. The user refine results with another searchbox that will search on a specific attribute

I found the widget RefineList with the property “withSearchBox” but the user has to select manually found items like this:


(here, I have to select manually “bathroom and bedroom”. I would like the widget to automatically refine the results with the search “b” on the selected attribute.

I tried to customize the “toggleconnector” without success:
I managed to search on a specific attribute but this search is very strict and works only if I enter exactly the correct content of the attribute.

I guess that searchForItems with a customconnector may be the solution but I have a lot of difficulties to understand how customconnector works.

Any idea of a quick solution ?

I did it very easily with searchkit and elasticsearch using the composant:
InputFilter
http://docs.searchkit.co/stable/docs/components/navigation/input-filter.html

This is a very basic feature and it would be great to have a widget for this.

Thank you,

Vincent

1 Like

Hi @vincent, thanks a lot for giving this very detailed feedback and proposing a solution. I think InputFilter makes a lot of sense for react-instantsearch and I am down implementing it, what do you think?

As a searchkit user we would love your feedback on react-instantsearch:

  • good parts
  • bad parts
  • not easy parts

Anything really anything hit us and give us your honest feedback like you just did.

Thanks again.

Hi vvo ! Thanks for the quick answer, I spent my afternoon on some of your components on algolia github :slight_smile:

That would be great to implement this component !

After 2 days on react-instantsearch I really like it:
It seems more flexible than searchkit (thanks to connectors) and I love to use algolia dashboard with it.

It has a few bad parts but I am sure that are already working on it:

  • the number of widget is still limited and using connectors has a learning curve: For instance I spent a few hours to implement the airbnb reostat slider as the sample code was not fitting all my needs => I wanted it to detect automatically min and max value of the attribute (and I did not find reostat css code in the doc :wink: )
    This widget is very simple to implement with searchkit and you even have a beautiful histogram.
  • Algolia css theme could be improved

Thanks for this library !

Vincent

2 Likes

Thanks a lot for this feedback, this is important to us and we are on the same page: we want to make what you named easier to do and with a better theme.

Thanks!