Keep refinements while <RefinementList /> is not rendered

I have a use case where the <RefinementList /> is not always showed, it only appears when the user wants to filter the items. I implemented this behaviour, but whenever the <RefinementList /> is not rendered, the refinements are disabled.

Is there a way to keep the refinements even if the <RefinementList /> component is not visible? My guess is that I may need to use Virtual Widgets, but I’m not sure how it can be done.

Hi @lucasharada5

If you want to keep the refinements and still hide <RefinementList /> I suggest you rather use <RefinementList hidden={true}/>, which will effectively hide the component without unmount it (and therefore keep the refinement).

I hope this helps!

Hello, @Youcef.

The RefinementList API page doesn’t show hidden as a valid prop. I tried adding it and doesn’t seen to work.

I managed to make it work by conecting the RefinementList and controlling internally on the connected component.