IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-03 12:11:09 -06:00
Code Issues Packages Projects Releases Wiki Activity

Alerting: hide private labels, collapse query json by default (#33284)

Browse Source
This commit is contained in:
Domas 2021-04-23 09:22:41 +03:00 committed by GitHub
parent 7627b55ef4
commit cf64adf156
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 24 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
public/app/features/alerting/unified/components/AlertLabels.tsx
View File

@ -11,10 +11,13 @@ interface Props {
export const AlertLabels: FC<Props> = ({ labels }) => {
const styles = useStyles(getStyles);
// transform to array of key value pairs and filter out "private" labels that start and end with double underscore
const pairs = Object.entries(labels).filter(([key]) => !(key.startsWith('__') && key.endsWith('__')));
return (
<div className={styles.wrapper}>
{Object.entries(labels).map(([k, v]) => (
<AlertLabel key={`${k}-${v}`} labelKey={k} value={v} />
{pairs.map(([key, value]) => (
<AlertLabel key={`${key}-${value}`} labelKey={key} value={value} />
))}
</div>
);

8
public/app/features/alerting/unified/components/rules/RuleDetails.tsx
View File

@ -4,7 +4,7 @@ import { useStyles } from '@grafana/ui';
import { css, cx } from '@emotion/css';
import { GrafanaTheme } from '@grafana/data';
import { isAlertingRule } from '../../utils/rules';
import { isCloudRulesSource } from '../../utils/datasource';
import { isCloudRulesSource, isGrafanaRulesSource } from '../../utils/datasource';
import { Annotation } from '../Annotation';
import { AlertLabels } from '../AlertLabels';
import { AlertInstancesTable } from './AlertInstancesTable';
@ -50,7 +50,11 @@ export const RuleDetails: FC<Props> = ({ rule, rulesSource }) => {
<AlertLabels labels={rule.labels} />
</DetailsField>
)}
<DetailsField label="Expression" className={cx({ [styles.exprRow]: !!annotations.length })} horizontal={true}>
<DetailsField
label={isGrafanaRulesSource(rulesSource) ? 'Query' : 'Expression'}
className={cx({ [styles.exprRow]: !!annotations.length })}
horizontal={true}
>
<RuleQuery rule={rule} rulesSource={rulesSource} />
</DetailsField>
{annotations.map(([key, value]) => (

15
public/app/features/alerting/unified/components/rules/RuleQuery.tsx
View File

@ -1,5 +1,6 @@
import { useTheme2 } from '@grafana/ui';
import { CombinedRule, RulesSource } from 'app/types/unified-alerting';
import React, { FC } from 'react';
import React, { FC, useState } from 'react';
import { GRAFANA_RULES_SOURCE_NAME } from '../../utils/datasource';
import { isGrafanaRulerRule } from '../../utils/rules';
import { Expression } from '../Expression';
@ -11,12 +12,22 @@ interface Props {
export const RuleQuery: FC<Props> = ({ rule, rulesSource }) => {
const { rulerRule } = rule;
const theme = useTheme2();
const [isHidden, setIsHidden] = useState(true);
if (rulesSource !== GRAFANA_RULES_SOURCE_NAME) {
return <Expression expression={rule.query} rulesSource={rulesSource} />;
}
if (rulerRule && isGrafanaRulerRule(rulerRule)) {
// @TODO: better grafana queries vizualization
// @TODO: better grafana queries vizualization read-only
if (isHidden) {
return (
<a style={{ color: theme.colors.text.link }} onClick={() => setIsHidden(false)}>
Show raw query JSON
</a>
);
}
return <pre>{JSON.stringify(rulerRule.grafana_alert.data, null, 2)}</pre>;
}
return <pre>@TODO: handle grafana prom rule case</pre>;