Improve approver search and selection
### What is the opportunity to improve upon?
When selecting approvers, it can sometimes be hard to find the users/groups that you’re looking for. There are some specific problems:
1. The first suggested results that appear when opening the dropdown are groups that the current user is a member of, even if these groups are not part of the current group/project tree.
1. Searching returns group results from the whole GitLab instance.
1. It’s not possible to search for the specific group path, only the group name.
1. Groups have rounded avatars instead of the typical squared avatars associated with groups and projects.
Users struggle in finding the specific group or user that they want to add as an approver, which can lead to spending unnecessary time in this UI or even making incorrect selections.
### Any evidence of user complaints?
Katherine created these great summary videos of opportunities to improve the experience for users based on research. In the [UI Polish episode (5:34)](https://www.youtube.com/watch?v=yLaqC_hb9vs&list=PL05JrBw4t0KrPNM6WFlrsVM8tWwkYDyio&index=3&t=5m34s) the adding approvers was identified as an opportunity for improvement.
- When using the approvers dropdown, you are shown a list of groups but its not showing who is in each group or why certain groups appear (`Senior Developers` does not appear)
- Katherine was searching for the group `Senior Developers` and had to type the whole string before it appeared.
We have recently identified these issues again in the [Code Review Category Maturity Scorecard](https://dovetailapp.com/projects/ac5e32e9-616d-4ddd-a1bb-1eb49084fe4e/insights/84c14e3e-c72a-44d2-8d34-10208a133674).
### What are the potential solutions?
1. https://gitlab.com/gitlab-org/gitlab/-/issues/28902: In the suggested results, only show groups and users that are able to be added as approvers.
1. In detail, we can sort the suggested results by how close the result is to the project (prioritize people from the project first, then people from the containing group, then groups from the containing group, and then other public people and groups that have access to the project (if the project is public/internal)).
1. Allow fuzzy string searching by group names and paths (for example, root-group/sub-group/another-subgroup).
1. Highlight the matching strings when searching users and groups (for example, searching for “nuki” would return “group-ta**nuki**-inc“
1. In both the dropdown and already-selected list, style groups with squared avatars and users with rounded avatars.
epic