Fix Version/s: None
The current search UI includes a "Clear refinements" button, but the refinements UI isn't complete yet. Let's try to finish it:
- Include breadcrumbs for individually active refinements ([currentRefinements|https://www.algolia.com/doc/api-reference/widgets/current-refinements/react/] widget)
- Hide the "Clear refinements" button if there aren't any refinements
Feedback from Gregory:
It’s not clear what a “refinement” is until you actually play with the system for a while - then it becomes clear that it’s only an action on the content types or author checkboxes, but not, say, adding an additional search term. The lack of an “active” vs “greyed-out” state on the “Clear all refinements” button makes it hard to tell what it’s going to do. If it started out grey and only went “live” when a checkbox was checked, it would be easier to become confident about the behavior.
This PR replaces the ClearRefinements widget with the CurrentRefinements widget. The advantage of this new widget is that it shows what refinements are active and lets the user clear them individually. We don't have enough refinements currently to justify an additional ClearRefinements widget, but we could bring it back.
When there are no refinements, no UI is present (unlike the previous solution where the "Clear all refinements" button was always present.
A complication of this implementation is the need to map refinement labels to human-readable names (e.g. contentCategories.lvl0 to Content type). This is accomplished with a mapping inside the currentRefinements.js module. As more refinements are added to search interfaces, we'll need to expand that mapping.