Similar to this post, I would like to hide facet title’s that no longer have any hits, based off of other facet filters that are selected.
In this example, Qml category is still showing, but there is nothing to refine. This is the code I have so far for the panel:
// =================================
// Panel
// =================================
const refinementListWithPanel = instantsearch.widgets.panel({
hidden(options) {
return options.results.nbHits === 0;
},
collapsed: options => {
return options && options.state && options.state.query.length === 0;
},
cssClasses: {
root: 'facet-header',
noRefinementRoot: 'hidden',
},
})(refinementList);
So I have tried hidden and it has not worked, but I tried collapsed as well and it didn’t work. I’m not sure what do here.
Can I get some guidance on how to make these headers attach a class only if there is nothing to refine?
Thank you in advance!