Display current and default branch at the top of the branch selector
Design questions
- How is the dropdown in the branch selector organized?
- Would it be useful to display the current branch at the top?
- Would it be useful to display the default branch at the top, when users are not on the default branch?
Current: Default branch does not appear at the top |
---|
default-branch.mov |
Current: Selected branch does not appear the top |
---|
selected.mov |
Design recommendation
See #518021 (comment 2482397152).
This design recommendation will address the following issues related to the repository branch selector:
- Display current and default branch at the top o... (#518021 - closed)
- FY25 PCSAT --> Add a "Copy Branch Name" button ... (#346777 - closed)
- Branch selector field is too small (#438154) • Alyssa Trinh • Backlog
Non-default branch selected | Default branch selected | Copy button toast |
---|---|---|
![]() |
![]() |
![]() |
Design details
-
Default branch should be at the top of the "Branches" section (unless the default branch is already selected)
- If the default branch is selected and appears in the "Selected" section, the default branch does not need to be duplicated at the top of the "Branches" section.
-
Currently selected branch should go in the "Selected" section (new). The copy button will allow users to copy the full branch name to address user needs in #346777 (closed).
-
After the user presses the "Copy" button in the disclosure, show a toast confirmation "Branch name copied to clipboard."
-
Branch field should be much larger. I will leave it up to front-end to advise on how best to do this. Perhaps #438154 (comment 2347281243) will help:
Dropdowns have a fluid-width option which could be useful here, as branch names can be pretty long.
This lets the dropdown expand based on the inner content, between a min and max width (this is documented in the Component Library file, but not Pajamas). But it's just adding fluid-width somewhere here.