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

Alerting: Hides threshold handle for percentual thresholds (#30431)

Browse Source
This commit is contained in:
Hugo Häggmark 2021-01-21 06:23:09 +01:00 committed by GitHub
parent e1243e07ca
commit 98406d6c42
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 80 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/app/features/alerting/AlertTabCtrl.ts
View File

@ -390,6 +390,7 @@ export class AlertTabCtrl {
case 'action': {
conditionModel.source.reducer.type = evt.action.value;
conditionModel.reducerPart = alertDef.createReducerPart(conditionModel.source.reducer);
this.evaluatorParamsChanged();
break;
}
case 'get-part-actions': {

65
public/app/features/alerting/state/ThresholdMapper.test.ts
View File

@ -1,6 +1,9 @@
import { describe, it, expect } from 'test/lib/common';
import { hiddenReducerTypes, ThresholdMapper } from './ThresholdMapper';
import alertDef from './alertDef';
import { ThresholdMapper } from './ThresholdMapper';
const visibleReducerTypes = alertDef.reducerTypes
.filter(({ value }) => hiddenReducerTypes.indexOf(value) === -1)
.map(({ value }) => value);
describe('ThresholdMapper', () => {
describe('with greater than evaluator', () => {
@ -74,4 +77,62 @@ describe('ThresholdMapper', () => {
expect(panel.thresholds[1].value).toBe(200);
});
});
visibleReducerTypes.forEach((type) => {
describe(`with {${type}} reducer`, () => {
it('visible should be true', () => {
const panel = getPanel({ reducerType: type });
const updated = ThresholdMapper.alertToGraphThresholds(panel);
expect(updated).toBe(true);
expect(panel.thresholds[0]).toEqual({
value: 100,
op: 'gt',
fill: true,
line: true,
colorMode: 'critical',
visible: true,
});
});
});
});
hiddenReducerTypes.forEach((type) => {
describe(`with {${type}} reducer`, () => {
it('visible should be false', () => {
const panel = getPanel({ reducerType: type });
const updated = ThresholdMapper.alertToGraphThresholds(panel);
expect(updated).toBe(true);
expect(panel.thresholds[0]).toEqual({
value: 100,
op: 'gt',
fill: true,
line: true,
colorMode: 'critical',
visible: false,
});
});
});
});
});
function getPanel({ reducerType }: { reducerType?: string } = {}) {
const panel: any = {
type: 'graph',
options: { alertThreshold: true },
alert: {
conditions: [
{
type: 'query',
evaluator: { type: 'gt', params: [100] },
reducer: { type: reducerType },
},
],
},
};
return panel;
}

22
public/app/features/alerting/state/ThresholdMapper.ts
View File

@ -1,5 +1,6 @@
import { PanelModel } from 'app/features/dashboard/state';
export const hiddenReducerTypes = ['percent_diff', 'percent_diff_abs'];
export class ThresholdMapper {
static alertToGraphThresholds(panel: PanelModel) {
if (!panel.alert) {
@ -14,16 +15,17 @@ export class ThresholdMapper {
const evaluator = condition.evaluator;
const thresholds: any[] = (panel.thresholds = []);
const visible = hiddenReducerTypes.indexOf(condition.reducer?.type) === -1;
switch (evaluator.type) {
case 'gt': {
const value = evaluator.params[0];
thresholds.push({ value: value, op: 'gt' });
thresholds.push({ value: value, op: 'gt', visible });
break;
}
case 'lt': {
const value = evaluator.params[0];
thresholds.push({ value: value, op: 'lt' });
thresholds.push({ value: value, op: 'lt', visible });
break;
}
case 'outside_range': {
@ -31,11 +33,11 @@ export class ThresholdMapper {
const value2 = evaluator.params[1];
if (value1 > value2) {
thresholds.push({ value: value1, op: 'gt' });
thresholds.push({ value: value2, op: 'lt' });
thresholds.push({ value: value1, op: 'gt', visible });
thresholds.push({ value: value2, op: 'lt', visible });
} else {
thresholds.push({ value: value1, op: 'lt' });
thresholds.push({ value: value2, op: 'gt' });
thresholds.push({ value: value1, op: 'lt', visible });
thresholds.push({ value: value2, op: 'gt', visible });
}
break;
@ -45,11 +47,11 @@ export class ThresholdMapper {
const value2 = evaluator.params[1];
if (value1 > value2) {
thresholds.push({ value: value1, op: 'lt' });
thresholds.push({ value: value2, op: 'gt' });
thresholds.push({ value: value1, op: 'lt', visible });
thresholds.push({ value: value2, op: 'gt', visible });
} else {
thresholds.push({ value: value1, op: 'gt' });
thresholds.push({ value: value2, op: 'lt' });
thresholds.push({ value: value1, op: 'gt', visible });
thresholds.push({ value: value2, op: 'lt', visible });
}
break;
}

4
public/app/plugins/panel/graph/threshold_manager.ts
View File

@ -87,6 +87,10 @@ export class ThresholdManager {
renderHandle(handleIndex: number, defaultHandleTopPos: number) {
const model = this.thresholds[handleIndex];
if (!model.visible) {
return;
}
const value = model.value;
let valueStr = value;
let handleTopPos = 0;