diff --git a/public/app/features/alerting/unified/home/Insights.tsx b/public/app/features/alerting/unified/home/Insights.tsx index 33ec4e4f9b7..7bd9ab986ef 100644 --- a/public/app/features/alerting/unified/home/Insights.tsx +++ b/public/app/features/alerting/unified/home/Insights.tsx @@ -28,7 +28,7 @@ import { getMostFiredInstancesScene } from '../insights/grafana/MostFiredInstanc import { getPausedGrafanaAlertsScene } from '../insights/grafana/Paused'; import { getGrafanaRulesByEvaluationScene } from '../insights/grafana/RulesByEvaluation'; import { getGrafanaRulesByEvaluationPercentageScene } from '../insights/grafana/RulesByEvaluationPercentage'; -import { getGrafanaAlertmanagerNotificationsScene } from '../insights/grafana/alertmanager/NotificationsScene'; +import { getAlertsByStateScene as getGrafanaAlertsByStateScene } from '../insights/grafana/alertmanager/AlertsByState'; import { getGrafanaAlertmanagerSilencesScene } from '../insights/grafana/alertmanager/SilencesByStateScene'; import { getAlertsByStateScene } from '../insights/mimir/AlertsByState'; import { getInvalidConfigScene } from '../insights/mimir/InvalidConfig'; @@ -267,7 +267,8 @@ function getGrafanaAlertmanagerScenes() { children: [ new SceneFlexLayout({ children: [ - getGrafanaAlertmanagerNotificationsScene(cloudUsageDs, 'Notification delivery'), + getGrafanaAlertsByStateScene(cloudUsageDs, 'Firing alerts by state'), + // getGrafanaAlertmanagerNotificationsScene(cloudUsageDs, 'Notification delivery'), getGrafanaAlertmanagerSilencesScene(cloudUsageDs, 'Silences'), ], }), diff --git a/public/app/features/alerting/unified/insights/grafana/MostFiredRulesTable.tsx b/public/app/features/alerting/unified/insights/grafana/MostFiredRulesTable.tsx index e6ef7610373..a9ff7c76d2a 100644 --- a/public/app/features/alerting/unified/insights/grafana/MostFiredRulesTable.tsx +++ b/public/app/features/alerting/unified/insights/grafana/MostFiredRulesTable.tsx @@ -44,7 +44,7 @@ export function getMostFiredRulesScene(datasource: DataSourceRef, panelTitle: st renameByName: { group: 'Group', labels_grafana_folder: 'Folder', - 'Value #A': 'Fires this week', + 'Value #A': 'Number of fires', }, }, }, diff --git a/public/app/features/alerting/unified/insights/grafana/alertmanager/AlertsByState.tsx b/public/app/features/alerting/unified/insights/grafana/alertmanager/AlertsByState.tsx new file mode 100644 index 00000000000..7f9162fa503 --- /dev/null +++ b/public/app/features/alerting/unified/insights/grafana/alertmanager/AlertsByState.tsx @@ -0,0 +1,34 @@ +import React from 'react'; + +import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes'; +import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema'; + +import { overrideToFixedColor, PANEL_STYLES } from '../../../home/Insights'; +import { InsightsRatingModal } from '../../RatingModal'; + +export function getAlertsByStateScene(datasource: DataSourceRef, panelTitle: string) { + const query = new SceneQueryRunner({ + datasource, + queries: [ + { + refId: 'A', + expr: 'sum by (state) (grafanacloud_grafana_instance_alerting_alertmanager_alerts)', + range: true, + legendFormat: '{{state}}', + }, + ], + }); + + return new SceneFlexItem({ + ...PANEL_STYLES, + body: PanelBuilders.timeseries() + .setTitle(panelTitle) + .setDescription('A breakdown of all of your firing alert rule instances based on state') + .setData(query) + .setCustomFieldConfig('drawStyle', GraphDrawStyle.Line) + .setOption('tooltip', { mode: TooltipDisplayMode.Multi }) + .setOverrides((b) => b.matchFieldsWithName('active').overrideColor(overrideToFixedColor('active'))) + .setHeaderActions() + .build(), + }); +} diff --git a/public/app/features/alerting/unified/insights/mimir/rules/MostFiredRules.tsx b/public/app/features/alerting/unified/insights/mimir/rules/MostFiredRules.tsx index df2f00f7c38..402042c01d3 100644 --- a/public/app/features/alerting/unified/insights/mimir/rules/MostFiredRules.tsx +++ b/public/app/features/alerting/unified/insights/mimir/rules/MostFiredRules.tsx @@ -31,7 +31,7 @@ export function getMostFiredRulesScene(datasource: DataSourceRef, panelTitle: st }, indexByName: {}, renameByName: { - Value: 'Fires this week', + Value: 'Number of fires', alertname: 'Alert Rule Name', }, },