From 3c57a1880c8207cf0f55a8eb112ddbdfdcaf4762 Mon Sep 17 00:00:00 2001 From: Sonia Aguilar <33540275+soniaAguilarPeiron@users.noreply.github.com> Date: Mon, 27 Oct 2025 10:54:50 +0100 Subject: [PATCH] Alerting: Fix enrichment tab to be rendered only for grafana alerting rules (#113030) fix enrichment tab to be rendered only for grafana alerting rules --- .../rule-view-page/extensions.tsx | 41 ++++++++++++++++--- .../rule-view-page/navigation.test.ts | 13 ++++-- .../rule-view-page/navigation.ts | 4 +- 3 files changed, 48 insertions(+), 10 deletions(-) diff --git a/public/app/features/alerting/unified/enterprise-components/rule-view-page/extensions.tsx b/public/app/features/alerting/unified/enterprise-components/rule-view-page/extensions.tsx index d26e996686c..a4d5034e103 100644 --- a/public/app/features/alerting/unified/enterprise-components/rule-view-page/extensions.tsx +++ b/public/app/features/alerting/unified/enterprise-components/rule-view-page/extensions.tsx @@ -4,6 +4,9 @@ import { FeatureState, NavModelItem } from '@grafana/data'; import { t } from '@grafana/i18n'; import { FeatureBadge, useStyles2 } from '@grafana/ui'; +import { useAlertRule } from '../../components/rule-viewer/RuleContext'; +import { rulerRuleType } from '../../utils/rules'; + type SetActiveTab = (tab: string) => void; type RuleViewTabBuilderArgs = { @@ -12,15 +15,31 @@ type RuleViewTabBuilderArgs = { }; type RuleViewTabBuilder = (args: RuleViewTabBuilderArgs) => NavModelItem; +type RuleViewTabBuilderConfig = { + filterOnlyGrafanaAlertRules: boolean; + ruleViewTabBuilder: RuleViewTabBuilder; +}; -const ruleViewTabBuilders: RuleViewTabBuilder[] = []; +const ruleViewTabBuilders: RuleViewTabBuilderConfig[] = []; -export function registerRuleViewTab(builder: RuleViewTabBuilder) { - ruleViewTabBuilders.push(builder); +function registerRuleViewTab(builder: RuleViewTabBuilder) { + ruleViewTabBuilders.push({ + filterOnlyGrafanaAlertRules: true, + ruleViewTabBuilder: builder, + }); } -export function getRuleViewExtensionTabs(args: RuleViewTabBuilderArgs): NavModelItem[] { - return ruleViewTabBuilders.map((builder) => builder(args)); +export function useRuleViewExtensionTabs(args: RuleViewTabBuilderArgs): NavModelItem[] { + const { rule } = useAlertRule(); + const isGrafanaAlertRule = rulerRuleType.grafana.alertingRule(rule.rulerRule); + return ruleViewTabBuilders + .filter((config) => { + if (config.filterOnlyGrafanaAlertRules) { + return isGrafanaAlertRule; + } + return true; + }) + .map((config) => config.ruleViewTabBuilder(args)); } export function addEnrichmentSection() { @@ -40,6 +59,18 @@ export function __clearRuleViewTabsForTests() { ruleViewTabBuilders.splice(0, ruleViewTabBuilders.length); } +// ONLY FOR TESTS: non-hook version for testing +export function getRuleViewExtensionTabs(args: RuleViewTabBuilderArgs, isGrafanaAlertRule: boolean): NavModelItem[] { + return ruleViewTabBuilders + .filter((config) => { + if (config.filterOnlyGrafanaAlertRules) { + return isGrafanaAlertRule; + } + return true; + }) + .map((config) => config.ruleViewTabBuilder(args)); +} + function getStyles() { return { tabSuffix: css({ diff --git a/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.test.ts b/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.test.ts index 18599640e3d..9fdaa2a74d9 100644 --- a/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.test.ts +++ b/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.test.ts @@ -10,14 +10,14 @@ describe('rule-view-page navigation', () => { }); it('does not include Alert enrichment tab when not registered', () => { - const tabs = getRuleViewExtensionTabs({ activeTab: 'query', setActiveTab: () => {} }); + const tabs = getRuleViewExtensionTabs({ activeTab: 'query', setActiveTab: () => {} }, true); const hasEnrichment = tabs.some((t) => t.text === 'Alert enrichment'); expect(hasEnrichment).toBe(false); }); it('includes Alert enrichment tab when registered (enterprise + toggle on)', () => { addEnrichmentSection(); - const tabs = getRuleViewExtensionTabs({ activeTab: 'query', setActiveTab: () => {} }); + const tabs = getRuleViewExtensionTabs({ activeTab: 'query', setActiveTab: () => {} }, true); const enrichment = tabs.find((t) => t.text === 'Alert enrichment'); expect(enrichment).toBeTruthy(); expect(enrichment!.active).toBe(false); @@ -25,12 +25,19 @@ describe('rule-view-page navigation', () => { it('marks Alert enrichment tab active when selected', () => { addEnrichmentSection(); - const tabs = getRuleViewExtensionTabs({ activeTab: 'enrichment', setActiveTab: () => {} }); + const tabs = getRuleViewExtensionTabs({ activeTab: 'enrichment', setActiveTab: () => {} }, true); const enrichment = tabs.find((t) => t.text === 'Alert enrichment'); expect(enrichment).toBeTruthy(); expect(enrichment!.active).toBe(true); }); + it('excludes Alert enrichment tab when not a Grafana alert rule', () => { + addEnrichmentSection(); + const tabs = getRuleViewExtensionTabs({ activeTab: 'query', setActiveTab: () => {} }, false); + const enrichment = tabs.find((t) => t.text === 'Alert enrichment'); + expect(enrichment).toBeUndefined(); + }); + describe('enrichment section registration', () => { it('should register enrichment section with correct prop interface', () => { const mockEnrichmentSection = jest.fn(() => null); diff --git a/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.ts b/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.ts index 2f1f4d0d5eb..313b26da7b6 100644 --- a/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.ts +++ b/public/app/features/alerting/unified/enterprise-components/rule-view-page/navigation.ts @@ -1,7 +1,7 @@ import { NavModelItem } from '@grafana/data'; -import { getRuleViewExtensionTabs } from './extensions'; +import { useRuleViewExtensionTabs } from './extensions'; export function useRuleViewExtensionsNav(activeTab: string, setActiveTab: (tab: string) => void): NavModelItem[] { - return getRuleViewExtensionTabs({ activeTab, setActiveTab }); + return useRuleViewExtensionTabs({ activeTab, setActiveTab }); }