Back to Designs page

Table of Contents

Related Research

No research entries have been linked to this design.

Resources

No resources available for this entry.

Additional tags

No tags are assigned to this entry.

Filters

Design type: Filtering | Product area: Hybrid Cloud Console

Author: Kevin Hatchoua
Last edit: March 21, 2023

Sentence case in filters

The filter input field’s searching category should be in lower case


Default for “Name” column/filter

The default filter name is different for each app

  • Advisor - Name (used to be Recommendation)

Filter column title is different for each app

  • Recommendation: Name (changed from Description)
  • Topics: Name
  • Vulnerability: CVE ID
  • Compliance: Policy/Rule
  • Patch advisories: Name
  • Policies: Name
  • Remediations: Playbook 
  • Resource optimization: Name

Proposal:

  • The default filter is Name
  • The first column title is called Name when appropriate

Links:

https://projects.engineering.redhat.com/browse/RHCLOUD-7081

https://github.com/RedHatInsights/insights-advisor-frontend/pull/684


 


Checkbox vs radio select in filters

Avoid using radio select in your filters as much as possible. The only time you should have a radio select is when the user can only pick one option out of the given options. You should not use radio select to show a “default All” state. Instead, you should show the options available using checkboxes, and assume that if nothing is selected, then “All” results are showing.
 


 


“All” state

On cloud.redhat.com, we do not have a selection option called “All” in our filters.

If no selections have been made in the filter dropdown, then you can assume an “All” state. Since no filtering is taking place, you should not have chips present in the toolbar (ie: you should never have a chip to indicate that all results are being shown, and no filtering is being applied).

However, if every filtering option is selected, the chips should reflect what is selected, as that is an “All” state that was caused due to the user selection of filter options. 


The main rule to follow is to only show chips for filters that are actually selected - whether that is because the user selected them, or whether that’s because we have chosen a default state to show the table in (eg: filter by active status by default).
 


 


Clearing filters

On all tables, there is a button that allows users to wipe their filters clean, removing or resetting the chips in the table. Here is some guidance for what the button label should be - “Reset filters” or “Clear filters”, depending on your bundle’s table behavior.
 

If some of your tables have default filters →  Button should say “Reset filters” (across all tables in your bundle)

When the table has default filters, pressing the “Reset Filters” button resets to the default filter.

When the table has no default filter, pressing the “Reset Filters” clears all filters
 


 

If none of your tables have default filters → Button should say “Clear filters” (across all tables in your bundle)

The “Clear filters” button will wipe all filters clean

 

Reasoning behind this decision: on Jan 28th, 2021, we decided this at design share through a vote. Margot presented 3 options to the team, and everyone agreed on the option presented above as it was deemed the simplest, most straightforward option. We agreed to let each bundle decide depending on what their table behavior is.  If your bundle has some pre-filtered tables, use the “Reset button”. If your bundle has no pre-filtered tables, use the “Clear filters” button.