Mini beautifying the UI: branch rules edition

Everyone can contribute. Help move this issue forward while earning points, leveling up and collecting rewards.

• Close this issue

Here is a list of potential issues we would like to address:

1. always show descriptions for "allow to push", "require code owner approval"
   • currently they are only show when toggle is on
   • status: workflowdesign this is still the desired behaviour as there might have been previous conversations on the topic. original issue for context
   • can be grouped with The sequence of the toast and the state change of the toggle is not instant and Move the top margin from the first protection toggle to be a bottom margin of a Crud component above it
2. when there is one option of "branch name or pattern", we could default to a button "Add branch rule" directly
   • status: workflowready for development
3. Put the group scope search first for dropdowns
   • can be grouped with Clipping of placeholder text in group search in approval drawer
   • status: workflowready for development
4. don't disable the "Save changes" button when there are no changes
   • for "allowed to push and merge" and "allowed to merge" drawer, remove the disable of the button and add a "no change has been made" toast
   • status: workflowready for development
5. Do not reload MR approvals on any Branch rule edits
   • status: workflowready for development
6. add the headline to the roles checkboxes
   • status: workflowdesign. do we want to have an icon? if so, which one?
7. Add a keyboard trap to the drawer, allowing users to get back to the x close button easily
   • status: workflowready for development