Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Change some dropdowns from Select component to Combo box on request form and management pages #2311

Open
3 tasks
gabydisarli opened this issue Jun 13, 2024 · 2 comments · May be fixed by #3302
Open
3 tasks
Assignees
Labels
dev issue is for the dev team fav Cameron's secret label Feature: ❔ Request a Domain skipped design Design artifact(s) will need to be updated

Comments

@gabydisarli
Copy link
Contributor

gabydisarli commented Jun 13, 2024

Issue description

The federal agency dropdown uses the Select USWDS component, but there are a lot of items in the list leading to a less than ideal UX. Currently, users have to navigate a massive list just by scrolling, with a combo box, they can narrow the list down by typing in a keyword first. This same problem also occurs on the state / territory dropdowns on the request form and management pages. USWDS's recommends using the select component when the user has to select from a small number of items and recommends the combo box component when the number of items is more than 15.

From the USWDS guidance:

Use a combo box when there are more than 15 choices in a drop-down list. With so many options, users may find it difficult to navigate with scrolling only.

Use the select component only when a user needs to choose from about seven to 15 possible options and you have limited space to display the options.

Screenshot 2024-06-13 at 1 51 50 PM

Acceptance criteria

  • change federal agency dropdown from select to combo box on the request form
  • change federal agency dropdown from select to combo box on the organization name and mailing address page on the request form (note that this dropdown is disabled right now, but we should make sure the component is matching the request form).
  • change State, territory, or military post dropdown on Organization name and mailing address in the request form and domain management pages

Additional context

See slack thread for more details

Links to other issues

No response

@gabydisarli gabydisarli added the dev issue is for the dev team label Jun 13, 2024
@gabydisarli gabydisarli added the skipped design Design artifact(s) will need to be updated label Jun 13, 2024
@gabydisarli gabydisarli changed the title Change Federal agency dropdown from Select component to Combo box on request form and management pages Change some dropdowns from Select component to Combo box on request form and management pages Jun 14, 2024
@PaulKuykendall PaulKuykendall moved this from 👶 New to 🍦 Backlog in .gov Product Board Jun 24, 2024
@h-m-f-t h-m-f-t added the fav Cameron's secret label label Jun 24, 2024
@h-m-f-t
Copy link
Member

h-m-f-t commented Sep 30, 2024

Adding refinement to discuss in ref meeting.

@PaulKuykendall PaulKuykendall moved this from 🍦 Backlog to 🎯 Ready in .gov Product Board Sep 30, 2024
@abroddrick abroddrick added the Feature: 🧮 Analyst Experience Issue to improve the Analysts workflow label Nov 22, 2024
@katypies
Copy link
Contributor

@abroddrick would it make sense to do something here that automatically sets a combo box if there are 15+ items, and a select if there are fewer, for consistency across the application?

@lizpearl lizpearl removed the Feature: 🧮 Analyst Experience Issue to improve the Analysts workflow label Dec 5, 2024
@dave-kennedy-ecs dave-kennedy-ecs self-assigned this Jan 2, 2025
@dave-kennedy-ecs dave-kennedy-ecs moved this from 🎯 Ready to 🏗 In progress in .gov Product Board Jan 6, 2025
@dave-kennedy-ecs dave-kennedy-ecs linked a pull request Jan 6, 2025 that will close this issue
32 tasks
@dave-kennedy-ecs dave-kennedy-ecs moved this from 🏗 In progress to 👀 In review in .gov Product Board Jan 8, 2025
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
dev issue is for the dev team fav Cameron's secret label Feature: ❔ Request a Domain skipped design Design artifact(s) will need to be updated
Projects
Status: 👀 In review
Development

Successfully merging a pull request may close this issue.

7 participants