Add approval rules vue app to group-level settings (FE)

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

• Close this issue

Problem to solve

In pursuit of the holistic solution outlined in &4367, this issue is a smaller implementation issue to iteratively move elements of project-level merge request approval rules to the group-level.

This issue focuses on copying the approval rules vue app from projects to groups.

Please see &4367 for the discovery and implementation discussion.

Intended users

• Cameron (Compliance Manager)
• Sidney (Systems Administrator)

User experience goal

A group owner can configure this setting - Approval rules - at the group level.

Proposal

This should be behind the feature flag :group_merge_request_approval_setting_feature_flag.

Add the setting Approval rules to the group level.

Stretch Goal: Enabling this setting should inherit it down to all projects, but still allow maintainers to change this setting.

Further details

We should build this behind the feature flag :group_merge_request_approval_setting_feature_flag so we can complete the entire implementation before enabling that flag by default. This should help us ensure there's a solid UX that accounts for the different preferences our users have around inheritance and enforcement.

Design

Out of scope ❗

• Rule inheritance
• Rule overrides
• Rule enforcement
• Rule locking/unlocking

Implementation plan

frontend - 3️⃣

Note this could be split into smaller MR's fairly easily. Refactoring and adding to group settings would be a good split

1. Need to add allowMultiRule and canEdit from ee/app/assets/javascripts/approvals/mount_project_settings.js:20 to ee/app/assets/javascripts/approvals/mount_group_settings.js:13
2. Move shared actions from ee/app/assets/javascripts/approvals/stores/modules/project_settings/actions.js and add to a new shared rule actions file
   • Add to ee/app/assets/javascripts/approvals/stores/modules/group_settings/actions.js
3. Duplicate ee/app/helpers/ee/projects_helper.rb:101 updating it to use the group API endpoints for them to be saved in the state
   • Remove references to security, vulnerability and license checks in group settings HAML data
4. Move ee/app/assets/javascripts/approvals/components/project_settings/project_rules.vue into new generic rules component
   • Reference in project and group settings and disable security, vulnerability and license checks on the group settings version (use a prop)
5. Update tests