I have a React frontend, which is querying Solr (through Python/Django) with the users search text and filter selections. Solr returns the product results with facets, dynamically updating which facets are shown and the count of products in each facet (or facet.pivot).
I am trying to allow the user to multi-select two filters in a single filter group. The issue is that as soon as the user selects a filter, the Solr query is narrowed down and the neighboring filter is not shown any more. For example, once the user selects "Men's", an updated facet group is returned, and "Women's" is not an option anymore.
An attempted solution was to store the old state and re-inject it into the new filter group. So if a user selected "Men's" and queried Solr, the filter group would still show up ["Men's", "Women's"]:
if (specs_update) {
json.specs[this.state.spec_clicked_info.group] = this.state.spec_clicked_info.specs;
}
This doesn't work. Imagine that the user decided to select both "Men's" and "Women's", then he selected "T-shirt" (there are only men's t-shirts in our store). If he were to now deselect "Men's", the query to Solr would still include the now stale choice of "Women's" and display zero results to the user.