Using multiple virtual Menus for disjunctive faceting

In a recent question about disjunctive facteing, @haroen recommended this approach to join widgets using OR:

Yes, because the default operation to apply between different widgets is AND, if you wanted that behaviour you could use multiple virtual Menus.

Is there an example of this approach somewhere? I’m intercepting this.state.refinementList in onSearchStateChange, and using it to build an OR-joined filters parameter string used in a <Configure /> component, which doesn’t seem to be enough to override the default behavior or returned hits.

Hi Jed!

I have no experience with Instantsearch’s Virtual Menus yet.

Would this guide help? https://community.algolia.com/react-instantsearch/guide/Virtual_widgets.html

Thanks @adrien.joly1! Unfortunately, it doesn’t cover anything related. There doesn’t seem to be a lot of documentation around the interaction between faceting widgets.

Hey Jed,

This makes sense, indeed between the different widgets, you will always have “and”, because of the way our filters work. The way to work around that is making indeed sure that you do the disjunctive faceting yourself in a custom made widget, which will then be “and” to the rest of the page.

Can you give a codeSandbox of what you have so far? We have an example here.

Thanks, @haroen, does this help?

So what you should make now from that (and sorry for answering late) is:

  1. make versions of RefinementList which don’t actually refine

You can do this by going to the source in the “components” directory, and taking those

  1. have those communicate to their parent

  2. create a <Configure/> with the filters you calculate from that.

Hope that helps!

1 Like