mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Alerting: add help texts to insights (#76366)
* Change texts and add spacing between sections * Minor text changes * Display timeseries with 0 values if result is empty
This commit is contained in:
parent
f6649d7a97
commit
ea50695cfe
@ -17,6 +17,7 @@ import {
|
|||||||
VariableValueSelectors,
|
VariableValueSelectors,
|
||||||
} from '@grafana/scenes';
|
} from '@grafana/scenes';
|
||||||
|
|
||||||
|
import { SectionFooter } from '../insights/SectionFooter';
|
||||||
import { SectionSubheader } from '../insights/SectionSubheader';
|
import { SectionSubheader } from '../insights/SectionSubheader';
|
||||||
import { getGrafanaInstancesByStateScene } from '../insights/grafana/AlertsByStateScene';
|
import { getGrafanaInstancesByStateScene } from '../insights/grafana/AlertsByStateScene';
|
||||||
import { getGrafanaEvalSuccessVsFailuresScene } from '../insights/grafana/EvalSuccessVsFailuresScene';
|
import { getGrafanaEvalSuccessVsFailuresScene } from '../insights/grafana/EvalSuccessVsFailuresScene';
|
||||||
@ -127,15 +128,6 @@ export function getInsightsScenes() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (showMimirAlertmanager) {
|
|
||||||
categories.push(
|
|
||||||
new SceneFlexItem({
|
|
||||||
ySizing: 'content',
|
|
||||||
body: getCloudScenes(),
|
|
||||||
})
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (showMimirManaged) {
|
if (showMimirManaged) {
|
||||||
categories.push(
|
categories.push(
|
||||||
new SceneFlexItem({
|
new SceneFlexItem({
|
||||||
@ -154,12 +146,21 @@ export function getInsightsScenes() {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (showMimirAlertmanager) {
|
||||||
|
categories.push(
|
||||||
|
new SceneFlexItem({
|
||||||
|
ySizing: 'content',
|
||||||
|
body: getCloudScenes(),
|
||||||
|
})
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
return new EmbeddedScene({
|
return new EmbeddedScene({
|
||||||
$timeRange: THIS_WEEK_TIME_RANGE,
|
$timeRange: THIS_WEEK_TIME_RANGE,
|
||||||
controls: [
|
controls: [
|
||||||
new SceneReactObject({
|
new SceneReactObject({
|
||||||
component: SectionSubheader,
|
component: SectionSubheader,
|
||||||
props: { children: <div>Monitor the status of your system.</div>, datasources: [] },
|
props: { children: <div>Monitor the status of your system.</div> },
|
||||||
}),
|
}),
|
||||||
new SceneControlsSpacer(),
|
new SceneControlsSpacer(),
|
||||||
new SceneTimePicker({}),
|
new SceneTimePicker({}),
|
||||||
@ -180,18 +181,12 @@ function getGrafanaManagedScenes() {
|
|||||||
body: new SceneFlexLayout({
|
body: new SceneFlexLayout({
|
||||||
direction: 'column',
|
direction: 'column',
|
||||||
children: [
|
children: [
|
||||||
new SceneFlexItem({
|
|
||||||
body: new SceneReactObject({
|
|
||||||
component: SectionSubheader,
|
|
||||||
props: { children: <div>Grafana-managed rules</div>, datasources: [] },
|
|
||||||
}),
|
|
||||||
}),
|
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
direction: 'column',
|
direction: 'column',
|
||||||
children: [
|
children: [
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
children: [
|
children: [
|
||||||
getMostFiredInstancesScene(ashDs, 'Top 10 firing instances this week'),
|
getMostFiredInstancesScene(ashDs, 'Top 10 firing instances'),
|
||||||
getFiringGrafanaAlertsScene(cloudUsageDs, 'Firing rules'),
|
getFiringGrafanaAlertsScene(cloudUsageDs, 'Firing rules'),
|
||||||
getPausedGrafanaAlertsScene(cloudUsageDs, 'Paused rules'),
|
getPausedGrafanaAlertsScene(cloudUsageDs, 'Paused rules'),
|
||||||
],
|
],
|
||||||
@ -206,14 +201,34 @@ function getGrafanaManagedScenes() {
|
|||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
height: '400px',
|
height: '400px',
|
||||||
children: [
|
children: [
|
||||||
getInstanceStatByStatusScene(cloudUsageDs, 'Alerting instances', 'alerting'),
|
getInstanceStatByStatusScene(
|
||||||
getInstanceStatByStatusScene(cloudUsageDs, 'Pending instances', 'pending'),
|
cloudUsageDs,
|
||||||
|
'Firing instances',
|
||||||
|
'The number of currently firing alert rule instances',
|
||||||
|
'alerting'
|
||||||
|
),
|
||||||
|
getInstanceStatByStatusScene(
|
||||||
|
cloudUsageDs,
|
||||||
|
'Pending instances',
|
||||||
|
'The number of currently pending alert rule instances',
|
||||||
|
'pending'
|
||||||
|
),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
children: [
|
children: [
|
||||||
getInstanceStatByStatusScene(cloudUsageDs, 'No data instances', 'nodata'),
|
getInstanceStatByStatusScene(
|
||||||
getInstanceStatByStatusScene(cloudUsageDs, 'Error instances', 'error'),
|
cloudUsageDs,
|
||||||
|
'No data instances',
|
||||||
|
'The current number of alert rule instances in No data state',
|
||||||
|
'nodata'
|
||||||
|
),
|
||||||
|
getInstanceStatByStatusScene(
|
||||||
|
cloudUsageDs,
|
||||||
|
'Error instances',
|
||||||
|
'The current number of alert rule instances in Error state',
|
||||||
|
'error'
|
||||||
|
),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
],
|
],
|
||||||
@ -234,6 +249,9 @@ function getGrafanaManagedScenes() {
|
|||||||
}),
|
}),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
|
new SceneReactObject({
|
||||||
|
component: SectionFooter,
|
||||||
|
}),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
@ -247,18 +265,15 @@ function getGrafanaAlertmanagerScenes() {
|
|||||||
body: new SceneFlexLayout({
|
body: new SceneFlexLayout({
|
||||||
direction: 'column',
|
direction: 'column',
|
||||||
children: [
|
children: [
|
||||||
new SceneFlexItem({
|
|
||||||
body: new SceneReactObject({
|
|
||||||
component: SectionSubheader,
|
|
||||||
props: { children: <div>Grafana Alertmanager</div>, datasources: [] },
|
|
||||||
}),
|
|
||||||
}),
|
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
children: [
|
children: [
|
||||||
getGrafanaAlertmanagerNotificationsScene(cloudUsageDs, 'Notifications'),
|
getGrafanaAlertmanagerNotificationsScene(cloudUsageDs, 'Notification delivery'),
|
||||||
getGrafanaAlertmanagerSilencesScene(cloudUsageDs, 'Silences'),
|
getGrafanaAlertmanagerSilencesScene(cloudUsageDs, 'Silences'),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
|
new SceneReactObject({
|
||||||
|
component: SectionFooter,
|
||||||
|
}),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
@ -275,13 +290,13 @@ function getCloudScenes() {
|
|||||||
new SceneFlexItem({
|
new SceneFlexItem({
|
||||||
body: new SceneReactObject({
|
body: new SceneReactObject({
|
||||||
component: SectionSubheader,
|
component: SectionSubheader,
|
||||||
props: { children: <div>Mimir Alertmanager</div>, datasources: [cloudUsageDs] },
|
props: { datasources: [cloudUsageDs] },
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
children: [
|
children: [
|
||||||
getAlertsByStateScene(cloudUsageDs, 'Alerts by state'),
|
getAlertsByStateScene(cloudUsageDs, 'Firing alerts by state'),
|
||||||
getNotificationsScene(cloudUsageDs, 'Notifications'),
|
getNotificationsScene(cloudUsageDs, 'Notification delivery'),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
@ -290,6 +305,9 @@ function getCloudScenes() {
|
|||||||
getInvalidConfigScene(cloudUsageDs, 'Invalid configuration'),
|
getInvalidConfigScene(cloudUsageDs, 'Invalid configuration'),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
|
new SceneReactObject({
|
||||||
|
component: SectionFooter,
|
||||||
|
}),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
@ -306,28 +324,31 @@ function getMimirManagedRulesScenes() {
|
|||||||
new SceneFlexItem({
|
new SceneFlexItem({
|
||||||
body: new SceneReactObject({
|
body: new SceneReactObject({
|
||||||
component: SectionSubheader,
|
component: SectionSubheader,
|
||||||
props: { children: <div>Mimir-managed rules</div>, datasources: [grafanaCloudPromDs, cloudUsageDs] },
|
props: { datasources: [grafanaCloudPromDs, cloudUsageDs] },
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
children: [
|
children: [
|
||||||
getMostFiredRulesScene(grafanaCloudPromDs, 'Top 10 firing rules this week'),
|
getMostFiredRulesScene(grafanaCloudPromDs, 'Top 10 firing rules'),
|
||||||
getFiringCloudAlertsScene(grafanaCloudPromDs, 'Firing instances'),
|
getFiringCloudAlertsScene(grafanaCloudPromDs, 'Firing instances'),
|
||||||
getPendingCloudAlertsScene(grafanaCloudPromDs, 'Pending instances'),
|
getPendingCloudAlertsScene(grafanaCloudPromDs, 'Pending instances'),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
children: [
|
children: [
|
||||||
getInstancesByStateScene(grafanaCloudPromDs, 'Count of alert instances by state'),
|
getInstancesByStateScene(grafanaCloudPromDs, 'Firing and pending alert instances'),
|
||||||
getInstancesPercentageByStateScene(grafanaCloudPromDs, '% of alert instances by State'),
|
getInstancesPercentageByStateScene(grafanaCloudPromDs, '% of alert instances by state'),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
children: [
|
children: [
|
||||||
getEvalSuccessVsFailuresScene(cloudUsageDs, 'Evaluation success vs failures'),
|
getEvalSuccessVsFailuresScene(cloudUsageDs, 'Evaluation success vs failures'),
|
||||||
getMissedIterationsScene(cloudUsageDs, 'Iterations missed'),
|
getMissedIterationsScene(cloudUsageDs, 'Missed evaluations'),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
|
new SceneReactObject({
|
||||||
|
component: SectionFooter,
|
||||||
|
}),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
@ -351,7 +372,7 @@ function getMimirManagedRulesPerGroupScenes() {
|
|||||||
new SceneFlexItem({
|
new SceneFlexItem({
|
||||||
body: new SceneReactObject({
|
body: new SceneReactObject({
|
||||||
component: SectionSubheader,
|
component: SectionSubheader,
|
||||||
props: { children: <div>Mimir-managed Rules - Per Rule Group</div>, datasources: [cloudUsageDs] },
|
props: { datasources: [cloudUsageDs] },
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
new SceneFlexLayout({
|
new SceneFlexLayout({
|
||||||
@ -367,6 +388,9 @@ function getMimirManagedRulesPerGroupScenes() {
|
|||||||
getRuleGroupEvaluationDurationIntervalRatioScene(cloudUsageDs, 'Evaluation duration / interval ratio'),
|
getRuleGroupEvaluationDurationIntervalRatioScene(cloudUsageDs, 'Evaluation duration / interval ratio'),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
|
new SceneReactObject({
|
||||||
|
component: SectionFooter,
|
||||||
|
}),
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
$variables: new SceneVariableSet({
|
$variables: new SceneVariableSet({
|
||||||
|
@ -0,0 +1,17 @@
|
|||||||
|
import { css } from '@emotion/css';
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
import { GrafanaTheme2 } from '@grafana/data/src/themes';
|
||||||
|
import { useStyles2 } from '@grafana/ui';
|
||||||
|
|
||||||
|
export function SectionFooter({ children }: React.PropsWithChildren<{}>) {
|
||||||
|
const styles = useStyles2(getStyles);
|
||||||
|
|
||||||
|
return <div className={styles.sectionFooter}>{children && <div>{children}</div>}</div>;
|
||||||
|
}
|
||||||
|
|
||||||
|
const getStyles = (theme: GrafanaTheme2) => ({
|
||||||
|
sectionFooter: css({
|
||||||
|
marginBottom: theme.spacing(2),
|
||||||
|
}),
|
||||||
|
});
|
@ -11,13 +11,13 @@ import { DataSourcesInfo } from './DataSourcesInfo';
|
|||||||
export function SectionSubheader({
|
export function SectionSubheader({
|
||||||
children,
|
children,
|
||||||
datasources,
|
datasources,
|
||||||
}: React.PropsWithChildren<{ datasources: DataSourceInformation[] }>) {
|
}: React.PropsWithChildren<{ datasources?: DataSourceInformation[] }>) {
|
||||||
const styles = useStyles2(getStyles);
|
const styles = useStyles2(getStyles);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.container}>
|
<div className={styles.container}>
|
||||||
<div>{children}</div>
|
{children}
|
||||||
<DataSourcesInfo datasources={datasources} />
|
{datasources && <DataSourcesInfo datasources={datasources} />}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import { PanelBuilders, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
|
import { PanelBuilders, SceneDataTransformer, SceneFlexItem, SceneQueryRunner } from '@grafana/scenes';
|
||||||
import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';
|
import { DataSourceRef, GraphDrawStyle, TooltipDisplayMode } from '@grafana/schema';
|
||||||
|
|
||||||
import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
|
import { overrideToFixedColor, PANEL_STYLES } from '../../home/Insights';
|
||||||
@ -19,19 +19,32 @@ export function getGrafanaInstancesByStateScene(datasource: DataSourceRef, panel
|
|||||||
],
|
],
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const transformation = new SceneDataTransformer({
|
||||||
|
$data: query,
|
||||||
|
transformations: [
|
||||||
|
{
|
||||||
|
id: 'renameByRegex',
|
||||||
|
options: {
|
||||||
|
regex: 'alerting',
|
||||||
|
renamePattern: 'firing',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
|
||||||
return new SceneFlexItem({
|
return new SceneFlexItem({
|
||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
height: '400px',
|
height: '400px',
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('A breakdown of all of your alert rule instances based on state')
|
||||||
.setData(query)
|
.setData(transformation)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
.setOverrides((b) =>
|
.setOverrides((b) =>
|
||||||
b
|
b
|
||||||
.matchFieldsWithName('alerting')
|
.matchFieldsWithName('firing')
|
||||||
.overrideColor(overrideToFixedColor('alerting'))
|
.overrideColor(overrideToFixedColor('firing'))
|
||||||
.matchFieldsWithName('normal')
|
.matchFieldsWithName('normal')
|
||||||
.overrideColor(overrideToFixedColor('normal'))
|
.overrideColor(overrideToFixedColor('normal'))
|
||||||
.matchFieldsWithName('pending')
|
.matchFieldsWithName('pending')
|
||||||
|
@ -29,7 +29,7 @@ export function getGrafanaEvalSuccessVsFailuresScene(datasource: DataSourceRef,
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of successful and failed alert rule evaluations')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
|
@ -23,7 +23,7 @@ export function getFiringGrafanaAlertsScene(datasource: DataSourceRef, panelTitl
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of currently firing alert rules')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setThresholds({
|
.setThresholds({
|
||||||
mode: ThresholdsMode.Absolute,
|
mode: ThresholdsMode.Absolute,
|
||||||
|
@ -8,6 +8,7 @@ import { InsightsRatingModal } from '../RatingModal';
|
|||||||
export function getInstanceStatByStatusScene(
|
export function getInstanceStatByStatusScene(
|
||||||
datasource: DataSourceRef,
|
datasource: DataSourceRef,
|
||||||
panelTitle: string,
|
panelTitle: string,
|
||||||
|
panelDescription: string,
|
||||||
status: 'alerting' | 'pending' | 'nodata' | 'normal' | 'error'
|
status: 'alerting' | 'pending' | 'nodata' | 'normal' | 'error'
|
||||||
) {
|
) {
|
||||||
const query = new SceneQueryRunner({
|
const query = new SceneQueryRunner({
|
||||||
@ -26,7 +27,7 @@ export function getInstanceStatByStatusScene(
|
|||||||
height: '100%',
|
height: '100%',
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription(panelDescription)
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setOverrides((b) => b.matchFieldsWithName(status).overrideColor(overrideToFixedColor(status)))
|
.setOverrides((b) => b.matchFieldsWithName(status).overrideColor(overrideToFixedColor(status)))
|
||||||
.setNoValue('0')
|
.setNoValue('0')
|
||||||
|
@ -58,7 +58,7 @@ export function getGrafanaMissedIterationsScene(datasource: DataSourceRef, panel
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of missed iterations per evaluation group')
|
||||||
.setData(transformation)
|
.setData(transformation)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
|
@ -88,7 +88,7 @@ export function getMostFiredInstancesScene(datasource: DataSourceRef, panelTitle
|
|||||||
},
|
},
|
||||||
renameByName: {
|
renameByName: {
|
||||||
labels_alertname: 'Alert rule name',
|
labels_alertname: 'Alert rule name',
|
||||||
'Value #A': 'Fires this week',
|
'Value #A': 'Number of fires',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@ -99,7 +99,7 @@ export function getMostFiredInstancesScene(datasource: DataSourceRef, panelTitle
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.table()
|
body: PanelBuilders.table()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The alert rule instances that have fired the most')
|
||||||
.setData(transformation)
|
.setData(transformation)
|
||||||
.setNoValue('No new alerts fired last week')
|
.setNoValue('No new alerts fired last week')
|
||||||
.setHeaderActions(<InsightsRatingModal panel={panelTitle} />)
|
.setHeaderActions(<InsightsRatingModal panel={panelTitle} />)
|
||||||
|
@ -23,7 +23,7 @@ export function getPausedGrafanaAlertsScene(datasource: DataSourceRef, panelTitl
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of current paused alert rules')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setThresholds({
|
.setThresholds({
|
||||||
mode: ThresholdsMode.Absolute,
|
mode: ThresholdsMode.Absolute,
|
||||||
|
@ -23,7 +23,7 @@ export function getGrafanaRulesByEvaluationScene(datasource: DataSourceRef, pane
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('See how many of your alert rules are paused or active')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getGrafanaRulesByEvaluationPercentageScene(datasource: DataSourc
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('See what percentage of your alert rules are paused or active')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setCustomFieldConfig('fillOpacity', 45)
|
.setCustomFieldConfig('fillOpacity', 45)
|
||||||
|
@ -12,7 +12,7 @@ export function getGrafanaAlertmanagerNotificationsScene(datasource: DataSourceR
|
|||||||
queries: [
|
queries: [
|
||||||
{
|
{
|
||||||
refId: 'A',
|
refId: 'A',
|
||||||
expr: 'grafanacloud_grafana_instance_alerting_notifications_total:rate5m - grafanacloud_grafana_instance_alerting_notifications_failed_total:rate5m',
|
expr: '(grafanacloud_grafana_instance_alerting_notifications_total:rate5m - grafanacloud_grafana_instance_alerting_notifications_failed_total:rate5m) or vector(0)',
|
||||||
range: true,
|
range: true,
|
||||||
legendFormat: 'success',
|
legendFormat: 'success',
|
||||||
},
|
},
|
||||||
@ -29,7 +29,7 @@ export function getGrafanaAlertmanagerNotificationsScene(datasource: DataSourceR
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of successful and failed notifications')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getGrafanaAlertmanagerSilencesScene(datasource: DataSourceRef, p
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of silences by state')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getAlertsByStateScene(datasource: DataSourceRef, panelTitle: str
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('A breakdown of all of your firing alert rule instances based on state')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getInvalidConfigScene(datasource: DataSourceRef, panelTitle: str
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The current state of your alertmanager configuration')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setUnit('bool_yes_no')
|
.setUnit('bool_yes_no')
|
||||||
.setOption('graphMode', BigValueGraphMode.None)
|
.setOption('graphMode', BigValueGraphMode.None)
|
||||||
|
@ -29,7 +29,7 @@ export function getNotificationsScene(datasource: DataSourceRef, panelTitle: str
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of successful and failed notifications')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getSilencesScene(datasource: DataSourceRef, panelTitle: string)
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of silences by state')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getRuleGroupEvaluationDurationIntervalRatioScene(datasource: Dat
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The percentage of interval time spent evaluating')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getRuleGroupEvaluationDurationScene(datasource: DataSourceRef, p
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('How long it took to evaluate the rule group')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setUnit('s')
|
.setUnit('s')
|
||||||
|
@ -29,7 +29,7 @@ export function getRuleGroupEvaluationsScene(datasource: DataSourceRef, panelTit
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of successful and failed evaluations for the rule group')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getRuleGroupIntervalScene(datasource: DataSourceRef, panelTitle:
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The current and historical rule group evaluation interval')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setUnit('s')
|
.setUnit('s')
|
||||||
.setOption('graphMode', BigValueGraphMode.Area)
|
.setOption('graphMode', BigValueGraphMode.Area)
|
||||||
|
@ -23,7 +23,7 @@ export function getRulesPerGroupScene(datasource: DataSourceRef, panelTitle: str
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The current and historical number of alert rules in the rule group')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setUnit('none')
|
.setUnit('none')
|
||||||
.setOption('graphMode', BigValueGraphMode.Area)
|
.setOption('graphMode', BigValueGraphMode.Area)
|
||||||
|
@ -29,7 +29,7 @@ export function getEvalSuccessVsFailuresScene(datasource: DataSourceRef, panelTi
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of successful and failed alert rule evaluations')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getFiringCloudAlertsScene(datasource: DataSourceRef, panelTitle:
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of currently firing alert rule instances')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setThresholds({
|
.setThresholds({
|
||||||
mode: ThresholdsMode.Absolute,
|
mode: ThresholdsMode.Absolute,
|
||||||
|
@ -23,7 +23,7 @@ export function getInstancesByStateScene(datasource: DataSourceRef, panelTitle:
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of firing and pending alert rule instances')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -23,7 +23,7 @@ export function getInstancesPercentageByStateScene(datasource: DataSourceRef, pa
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('See what percentage of your alert rules are firing versus pending')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setCustomFieldConfig('fillOpacity', 45)
|
.setCustomFieldConfig('fillOpacity', 45)
|
||||||
|
@ -23,7 +23,7 @@ export function getMissedIterationsScene(datasource: DataSourceRef, panelTitle:
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.timeseries()
|
body: PanelBuilders.timeseries()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of evaluations missed')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
.setCustomFieldConfig('drawStyle', GraphDrawStyle.Line)
|
||||||
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
.setOption('tooltip', { mode: TooltipDisplayMode.Multi })
|
||||||
|
@ -43,7 +43,7 @@ export function getMostFiredRulesScene(datasource: DataSourceRef, panelTitle: st
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.table()
|
body: PanelBuilders.table()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The alert rules that have fired the most')
|
||||||
.setData(transformation)
|
.setData(transformation)
|
||||||
.setHeaderActions(<InsightsRatingModal panel={panelTitle} />)
|
.setHeaderActions(<InsightsRatingModal panel={panelTitle} />)
|
||||||
.build(),
|
.build(),
|
||||||
|
@ -23,7 +23,7 @@ export function getPendingCloudAlertsScene(datasource: DataSourceRef, panelTitle
|
|||||||
...PANEL_STYLES,
|
...PANEL_STYLES,
|
||||||
body: PanelBuilders.stat()
|
body: PanelBuilders.stat()
|
||||||
.setTitle(panelTitle)
|
.setTitle(panelTitle)
|
||||||
.setDescription(panelTitle)
|
.setDescription('The number of currently pending alert rule instances')
|
||||||
.setData(query)
|
.setData(query)
|
||||||
.setThresholds({
|
.setThresholds({
|
||||||
mode: ThresholdsMode.Absolute,
|
mode: ThresholdsMode.Absolute,
|
||||||
|
Loading…
Reference in New Issue
Block a user