From e6721b8307224ff1e2cdce8a0cda41a4653378af Mon Sep 17 00:00:00 2001
From: psjakubowska <psedlak-jakubowska@gitlab.com>
Date: Tue, 14 Oct 2025 13:35:41 +0200
Subject: [PATCH] Filter out group-level rules from details page

After adding group-level indicators to the branch rules list
and blocking thedetails page for them from the project Repository
settings, we also need to make sure we only display project level
rules on the details page, even when there happen to be rules on
different levels but with the same target.

Changelog: fixed
---
 .../branch_rules/components/view/index.vue    | 21 ++++++++++++-------
 .../components/view/index_spec.js             | 17 ++++++---------
 2 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/app/assets/javascripts/projects/settings/branch_rules/components/view/index.vue b/app/assets/javascripts/projects/settings/branch_rules/components/view/index.vue
index cc138ddcaf9523..c185b6edb3af3a 100644
--- a/app/assets/javascripts/projects/settings/branch_rules/components/view/index.vue
+++ b/app/assets/javascripts/projects/settings/branch_rules/components/view/index.vue
@@ -111,17 +111,22 @@ export default {
         };
       },
       update({ project: { branchRules, group } }) {
-        const branchRule = branchRules.nodes.find((rule) => rule.name === this.branch);
-        this.branchRule = branchRule;
-        this.branchProtection = branchRule?.branchProtection;
-        this.statusChecks = branchRule?.externalStatusChecks?.nodes || [];
-        this.matchingBranchesCount = branchRule?.matchingBranchesCount;
+        const projectBranchRule = branchRules.nodes.find(
+          (rule) => rule.name === this.branch && !rule.branchProtection?.isGroupLevel,
+        );
+
+        this.branchRule = projectBranchRule;
+        this.branchProtection = projectBranchRule?.branchProtection;
+        this.statusChecks = projectBranchRule?.externalStatusChecks?.nodes || [];
+        this.matchingBranchesCount = projectBranchRule?.matchingBranchesCount;
         this.groupId = getIdFromGraphQLId(group?.id) || null;
+
         if (!this.showApprovers) return;
         // The approval rules app uses a separate endpoint to fetch the list of approval rules.
         // In future, we will update the GraphQL request to include the approval rules data.
         // Issue: https://gitlab.com/gitlab-org/gitlab/-/issues/452330
-        const approvalRules = branchRule?.approvalRules?.nodes.map((rule) => rule.name) || [];
+        const approvalRules =
+          projectBranchRule?.approvalRules?.nodes.map((rule) => rule.name) || [];
         this.setRulesFilter(approvalRules);
         this.fetchRules();
       },
@@ -471,7 +476,9 @@ export default {
     </page-heading>
 
     <gl-loading-icon v-if="$apollo.loading" size="lg" />
-    <div v-else-if="!branchRule && !isPredefinedRule">{{ $options.i18n.noData }}</div>
+    <div v-else-if="!branchRule && !isPredefinedRule">
+      {{ $options.i18n.noData }}
+    </div>
     <div v-else>
       <access-levels-drawer
         :is-open="isAllowedToMergeDrawerOpen || isAllowedToPushAndMergeDrawerOpen"
diff --git a/ee/spec/frontend/projects/settings/branch_rules/components/view/index_spec.js b/ee/spec/frontend/projects/settings/branch_rules/components/view/index_spec.js
index 41582243aa6ceb..c93f31da7e194c 100644
--- a/ee/spec/frontend/projects/settings/branch_rules/components/view/index_spec.js
+++ b/ee/spec/frontend/projects/settings/branch_rules/components/view/index_spec.js
@@ -310,18 +310,13 @@ describe('View branch rules in enterprise edition', () => {
       await createComponent({ editBranchRules: true }, { showCodeOwners: true }, mockResponse);
     });
 
-    it('does not render delete rule button', () => {
+    it('filters out a group level rule from display and renders empty state', () => {
+      expect(wrapper.text()).toBe('No data to display');
       expect(findDeleteRuleButton().exists()).toBe(false);
-    });
-
-    it('passes isGroupLevel prop to protection components', () => {
-      expect(findAllowedToMerge().props('isGroupLevel')).toBe(true);
-      expect(findAllowedToPush().props('isGroupLevel')).toBe(true);
-      expect(findAllowForcePushToggle().props('isGroupLevel')).toBe(true);
-    });
-
-    it('passes isGroupLevel prop to code owners protection toggle component', () => {
-      expect(findCodeOwnersToggle().props('isGroupLevel')).toBe(true);
+      expect(findAllowedToMerge().exists()).toBe(false);
+      expect(findAllowedToPush().exists()).toBe(false);
+      expect(findAllowForcePushToggle().exists()).toBe(false);
+      expect(findCodeOwnersToggle().exists()).toBe(false);
     });
   });
 });
-- 
GitLab