Updated dropdowns in cherry-pick commit modal
What does this MR do and why?
What
This MR is a solution to #388550 (closed), which is follow-up work to changes made in !110012 (merged).
The changes made improve the consistency of the cherry-pick dropdowns by removing the functionality that filters the result of the dropdown by default. The selected item is then pushed to the top of the list. This improves visibility in situations where there are many items, eg. the branches dropdown.
There are also some other small code clean-ups that add consistency to both dropdowns.
Update
Based on the discussion here !112031 (comment 1282371600), the dropdown only pushes the selected item to the top of the list, when the user is not searching.
This MR also implements a fix for #391892 (closed), to stop a long item name causing the dropdown to overflow out of the modal.
Why
As seen in #388550 (closed), these changes were decided based on the discussion: !110012 (comment 1255182921).
The aim here is to improve the UX of the dropdowns by removing the odd behaviour that was introduced as a result of the dropdown component migration. The existing behaviour of filtering the dropdowns by default just doesn't work well with the new Pajamas components.
This is an MVC to help improve UX while waiting for gitlab-org/gitlab-services/design.gitlab.com#1509 to be completed.
Screenshots or screen recordings
I have a number of before and after screenshots which show:
- Default items when the dropdown is opened
- Dropdown with search results
- Dropdown without search results
| Before | After |
|---|---|
 |
 |
 |
 |
 |
 |
Screenshots for the fix to #391892 (closed)
| Before | After |
|---|---|
 |
 |
How to set up and validate locally
Numbered steps to set up and validate the change are strongly suggested.
- Go to the list of commits in https://gitlab.com/gitlab-org/gitlab/
- Select Commit
- Select Options > Cherry-pick
- Click on dropdown "Pick into branch"
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Related to #388550 (closed)