Open Bug 1489808 Opened 6 years ago Updated 3 years ago

Improve flag UI by using buttons instead of dropdown list

Categories

(bugzilla.mozilla.org :: User Interface, enhancement)

Production
enhancement
Not set
normal

Tracking

()

People

(Reporter: kohei, Unassigned)

References

Details

(Keywords: bmo-ux, ux-efficiency, Whiteboard: [october-2019-bmo-triage])

Attachments

(1 file)

Attached image flag-ui.png (deleted) —
Bugzilla’s current flag UI is a `<select>` dropdown list, but given that a flag is a simple quad state field with short label values (unset, `?`, `+`, or `-`), it’s better to use buttons instead for easier selection. Usage of dropdown lists should be avoided whenever possible especially when the values are not many. Implementation-wise, these buttons will be elements having the `radio` ARIA role, not `button`. See the attached image for a quick mockup.
Keywords: ux-efficiency
FYI review flags for Firefox and related products will be going away as all reviews are moved to Phabricator. We'll be wanting to move the remaining flags (e.g. uplift-approval flags) at some point as well (not entirely sure how, maybe as revision tags). So although this will be useful for any other products still using attachment flags, the overall impact will be lower than it might have been in the past.
I know the review flag is going away, but give that there are still other various quad state fields, this is worth doing. Part of the style has already been added in Bug 1489718.
Depends on: 1489718
Status: NEW → ASSIGNED

If these can be handled the same way that the changes to the bug type field were made (keeping them accessible.)

However, I think I'd rather see these treated as tags (which use : as a field separator for tuples) in a general tag field to reduce complexity of the bug edit view.

I'm inclined to wontfix this and review how we want to manage tags.

Assignee: kohei.yoshino → nobody
Status: ASSIGNED → NEW
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: