Page MenuHomePhabricator

Revise design of the Mentee overview filter for recent days
Open, Needs TriagePublic

Assigned To
None
Authored By
RHo
Thu, Jun 23, 12:53 PM
Referenced Files
F35268163: image.png
Thu, Jun 23, 3:23 PM
F35267800: image.png
Thu, Jun 23, 12:53 PM
F35267793: image.png
Thu, Jun 23, 12:53 PM

Description

The current display of the "Most recent edit" time period in the mentees overview module on the mentor dashboard is shown as two separate button groups when there is only 1 selection, which may be confusing to someone making selections.
Unlike the other filter options, there is also no selected value to let the mentor know what the default selected period is to which the table has been set.

Current filter:

image.png (1×1 px, 160 KB)

Proposed update:

  • Simplify the selection to a single form component for selection (removing the confusion that there are two separate buttongroups but only 1 value is selectable across both).
  • Show the default value selected. (making it clearer to the mentor what is the default value).
  • Revised label above the button group.
  • Change from using the buttongroup to a single dropdown selection with the benefits:
    • More flexibility to add more options in future.
    • More mobile-friendly, esp. for narrow devices as 6 buttons may lead to overflow issues.
    • More details, clearer labels relating to time ago options ("Past 24 hours")
    • Potential to allow commonly used filter options as links to pre-fill the combo (which is less feasible using ButtonGroup).

image.png (1×872 px, 145 KB)

Note: An earlier proposal was to combine to a single ButtonGroup, but this was revised due to the above benefits noted relating to the single dropdown.

image.png (1×758 px, 78 KB)

Event Timeline

kostajh added subscribers: Urbanecm_WMF, kostajh.

@Urbanecm_WMF I'll let you decide when we get to this. Presumably it would happen after we finish the initial Vue migration.

@Urbanecm_WMF I'll let you decide when we get to this. Presumably it would happen after we finish the initial Vue migration.

Hi @kostajh - actually I talked with @Sgs about this design change happening as part of the migration as this also removes the dependency/need for the ButtonGroup widget, which is not yet available in Codex.

Thanks for the ping and info. No issues with chaging the design to F35268163 from my side, if it makes the migration easier.