Further improvements to filtering in demo-store template

[andy-schneidr]

The following is a list of improvements that could be made to the filtering implemented on the demo-store template. These would really improve the quality of the filtering experience a merchant gets 'out of the box'!

1. Prevent deadends when filtering (video) - there isn't anything to prevent selecting a combination of filters which will return null results

   • On top of this, we could have a numerical indication of how many results will be left if the filter is applied
   • Example on dawn theme:
     

2. Implement a filter with visual representation (little images or colour swatches) as an example

   • There's an existing rough implementation of this here which could be used as a guideline

3. In the filters drawer, have an indication for which filter values are currently selected. I believe we currently only get an underline on the most recently clicked filter value since it gets focus

   • An example of how this can look, on the dawn theme:
     

4. Show how many total results there are in the collection after applying the selected filters

5. Show an indication as to whether a filter is an OR filter or an AND filter.

6. Additionally, pull all of the AND'ed filter values to the top of the list on the client side (this grouping isn't automatically done by the API)

7. This one is subjective, but in the filters drawer, it may be nice if clicking filter values which are already active could turn them off like a toggle.

[blittle]

Thank you for the suggestions. @mynameisadamf any thoughts on this?

[mynameisadamf]

@blittle, it would be great to revisit filters. A lot of the suggestions were in the original design, but not implemented. See attached.

Addresses deadends with null/disabled if 0
Indication for which filter values are currently selected by using a checkbox (underline is supposed to only be reserved for collections which are links)
Total results (can we do this now? There were technical limitations previously.

Questions:
What’s an example of an OR filter vs an AND filter