Issue outline:

The filters within the Gradebook designs share common UI patterns. it would be beneficial to introduce a new reusable filter output component within the Gradebook, with an eye to eventually standardise the output of similar filtering elements used across Moodle.

Summary:

Based on the requirements defined on the Figma prototype for the Gradebook 4.2 project, we will introduce a new option around how the filtering content is displayed within the course Gradebook, focusing on the grader report page initially.

This issue will also bring in an example implementation of the new tertiary navigation dropdown component, in which we will migrate the current initials bar filtering into the new dropdown component within the tertiary navigation area in the Grader report. This change is expected to improve the usability by de-cluttering the page via progressive disclosure and will aid in the creation of consistency when it comes to presenting the filtering options within the Gradebook.

Scope:

1. Review existing/future filter implementations to make sure that we have a good understanding of the most common use cases
   1. So that we may have an idea on how such items could be migrated into the tertiary nav
2. Implement a generic filter tertiary nav output component
   1. Likely to be a core tertiary nav object that both core and third party alike could use to create dropdowns in the tertiary nav
3. Migrate first/last name filtering whilst utilising the new tertiary navigation output component
4. Implement reasonable automated testing

Out of scope:

1. Implementation of the new component outside of Gradebook
2. Migrating currently rendered initials filters into the new tertiary dropdown component
3. The creation of any new filters (Only reuse current filtering but modify output options)
4. Migration of the current table output within the grader report to use the filtering bought in during the participants project