Add branch rules status check

What does this MR do and why?

Add status check in the branch rules page. As of this MR, edit or delete buttons are not functioning.

Part 2 of Issue: #439396 (closed)

⚠ Note: changes in this MR are behind the :edit_branch_rules feature flag.

Implementation breakdown:

Description	Issue/MR
Add status checks drawer placeholder component	!160804 (merged)
Add status check in drawer	👈 This MR
Edit status check in drawer	follow-up MR
Update doc	follow-up MR

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Screenshots are required for UI changes, and strongly recommended for all other merge requests.

Screen_Recording_2024-07-31_at_3.07.55_PM

⚠ currently, the BE mutation does not support creating status checks for all branches so this MR temporarily keeps the existing UI that links to merge request setting page. this will be addressed in #478016 (closed)

How to set up and validate locally

Numbered steps to set up and validate the change are strongly suggested.

1. Enable the edit-branch-rules feature flag
2. Add a Branch rule
   • Navigate to Project > Repository > Settings > Branch rules > Add branch rule
3. View the branch rule created in step 1
   • Navigate to Project > Repository > Settings > Branch rules > View details
4. Select add status check should open a drawer with service name and api fields
5. Fill in two fields
6. A success toast should appears and drawer should close
7. Click on the edit button of the newly created status check
8. Drawer should populate with correct information

Related to #439401 (closed)