diff --git a/.betterer.results b/.betterer.results
index 2d6643a1f2a..a8937556dd4 100644
--- a/.betterer.results
+++ b/.betterer.results
@@ -3502,11 +3502,6 @@ exports[`better eslint`] = {
[0, 0, 0, "No untranslated strings. Wrap text with ", "8"],
[0, 0, 0, "No untranslated strings. Wrap text with ", "9"]
],
- "public/app/features/expressions/components/Threshold.tsx:5381": [
- [0, 0, 0, "No untranslated strings. Wrap text with ", "0"],
- [0, 0, 0, "No untranslated strings. Wrap text with ", "1"],
- [0, 0, 0, "No untranslated strings. Wrap text with ", "2"]
- ],
"public/app/features/expressions/guards.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
diff --git a/public/app/features/alerting/unified/components/rule-editor/query-and-alert-condition/SimpleCondition.tsx b/public/app/features/alerting/unified/components/rule-editor/query-and-alert-condition/SimpleCondition.tsx
index 1e745c46da6..8d092e149f6 100644
--- a/public/app/features/alerting/unified/components/rule-editor/query-and-alert-condition/SimpleCondition.tsx
+++ b/public/app/features/alerting/unified/components/rule-editor/query-and-alert-condition/SimpleCondition.tsx
@@ -4,13 +4,15 @@ import { Dispatch, FormEvent } from 'react';
import { UnknownAction } from 'redux';
import { GrafanaTheme2, PanelData, ReducerID, SelectableValue } from '@grafana/data';
-import { ButtonSelect, InlineField, InlineFieldRow, Input, Select, Stack, Text, useStyles2 } from '@grafana/ui';
+import { InlineField, InlineFieldRow, Input, Select, Stack, Text, useStyles2 } from '@grafana/ui';
import { Trans } from 'app/core/internationalization';
import { EvalFunction } from 'app/features/alerting/state/alertDef';
+import { ThresholdSelect } from 'app/features/expressions/components/ThresholdSelect';
import { ExpressionQuery, ExpressionQueryType, reducerTypes, thresholdFunctions } from 'app/features/expressions/types';
import { getReducerType } from 'app/features/expressions/utils/expressionTypes';
import { AlertQuery } from 'app/types/unified-alerting-dto';
+import { ToLabel } from '../../../../../expressions/components/ToLabel';
import { ExpressionResult } from '../../expressions/Expression';
import { updateExpression } from './reducer';
@@ -114,12 +116,7 @@ export const SimpleConditionEditor = ({
-
+
{isRange ? (
<>
onEvaluateValueChange(event, 0)}
/>
-
- TO
-
+
({
borderBottom: `solid 1px ${theme.colors.border.weak}`,
flex: 1,
}),
- button: css({
- height: '32px',
- color: theme.colors.primary.text,
- fontSize: theme.typography.bodySmall.fontSize,
- textTransform: 'uppercase',
- display: 'flex',
- alignItems: 'center',
- borderRadius: theme.shape.radius.default,
- fontWeight: theme.typography.fontWeightBold,
- border: `1px solid ${theme.colors.border.medium}`,
- whiteSpace: 'nowrap',
- padding: `0 ${theme.spacing(1)}`,
- backgroundColor: theme.colors.background.primary,
- }),
},
});
diff --git a/public/app/features/expressions/components/Threshold.tsx b/public/app/features/expressions/components/Threshold.tsx
index 34583841a9a..720096b90bf 100644
--- a/public/app/features/expressions/components/Threshold.tsx
+++ b/public/app/features/expressions/components/Threshold.tsx
@@ -1,16 +1,18 @@
import { css } from '@emotion/css';
import { AnyAction } from '@reduxjs/toolkit';
-import { FormEvent, useEffect, useReducer } from 'react';
import * as React from 'react';
+import { FormEvent, useEffect, useReducer } from 'react';
import { GrafanaTheme2, SelectableValue } from '@grafana/data';
import { Stack } from '@grafana/experimental';
-import { ButtonSelect, InlineField, InlineFieldRow, InlineSwitch, Input, Select, useStyles2 } from '@grafana/ui';
+import { InlineField, InlineFieldRow, InlineSwitch, Input, Select, useStyles2 } from '@grafana/ui';
import { config } from 'app/core/config';
import { EvalFunction } from 'app/features/alerting/state/alertDef';
import { ClassicCondition, ExpressionQuery, thresholdFunctions } from '../types';
+import { ThresholdSelect } from './ThresholdSelect';
+import { ToLabel } from './ToLabel';
import {
isInvalid,
thresholdReducer,
@@ -91,12 +93,8 @@ export const Threshold = ({ labelWidth, onChange, refIds, query, onError, useHys
-
+
+
{isRange ? (
<>
onEvaluateValueChange(event, 0)}
defaultValue={conditionInState.evaluator.params[0]}
/>
- TO
+
- TO
+
- TO
+
({
- buttonSelectText: css({
- color: theme.colors.primary.text,
- fontSize: theme.typography.bodySmall.fontSize,
- textTransform: 'uppercase',
- padding: `0 ${theme.spacing(1)}`,
- }),
- button: css({
- height: '32px',
- color: theme.colors.primary.text,
- fontSize: theme.typography.bodySmall.fontSize,
- textTransform: 'uppercase',
- display: 'flex',
- alignItems: 'center',
- borderRadius: theme.shape.radius.default,
- fontWeight: theme.typography.fontWeightBold,
- border: `1px solid ${theme.colors.border.medium}`,
- whiteSpace: 'nowrap',
- padding: `0 ${theme.spacing(1)}`,
- backgroundColor: theme.colors.background.primary,
- }),
range: css({
width: 'min-content',
}),
diff --git a/public/app/features/expressions/components/ThresholdSelect.tsx b/public/app/features/expressions/components/ThresholdSelect.tsx
new file mode 100644
index 00000000000..cb93701d6de
--- /dev/null
+++ b/public/app/features/expressions/components/ThresholdSelect.tsx
@@ -0,0 +1,27 @@
+import { css } from '@emotion/css';
+
+import { GrafanaTheme2, SelectableValue } from '@grafana/data';
+import { ButtonSelect, useStyles2 } from '@grafana/ui';
+import { EvalFunction } from 'app/features/alerting/state/alertDef';
+
+import { thresholdFunctions } from '../types';
+
+export interface ThresholdSelectProps {
+ onChange: (value: SelectableValue) => void;
+ value: SelectableValue | undefined;
+}
+export function ThresholdSelect({ onChange, value }: ThresholdSelectProps) {
+ const styles = useStyles2(getStyles);
+ return (
+
+ );
+}
+
+const getStyles = (theme: GrafanaTheme2) => ({
+ buttonSelectText: css({
+ color: theme.colors.primary.text,
+ fontSize: theme.typography.bodySmall.fontSize,
+ textTransform: 'uppercase',
+ padding: `0 ${theme.spacing(1)}`,
+ }),
+});
diff --git a/public/app/features/expressions/components/ToLabel.tsx b/public/app/features/expressions/components/ToLabel.tsx
new file mode 100644
index 00000000000..d9586ea9f0c
--- /dev/null
+++ b/public/app/features/expressions/components/ToLabel.tsx
@@ -0,0 +1,26 @@
+import { css } from '@emotion/css';
+
+import { GrafanaTheme2 } from '@grafana/data';
+import { useStyles2 } from '@grafana/ui';
+import { Trans } from 'app/core/internationalization';
+
+export function ToLabel() {
+ const styles = useStyles2(getStyles);
+ return (
+
+ TO
+
+ );
+}
+
+const getStyles = (theme: GrafanaTheme2) => ({
+ button: css({
+ height: '32px',
+ color: theme.colors.primary.text,
+ fontSize: theme.typography.bodySmall.fontSize,
+ display: 'flex',
+ alignItems: 'center',
+ fontWeight: theme.typography.fontWeightBold,
+ padding: `0 ${theme.spacing(1)}`,
+ }),
+});
diff --git a/public/locales/en-US/grafana.json b/public/locales/en-US/grafana.json
index ac43a42d1a4..f014ea0f91b 100644
--- a/public/locales/en-US/grafana.json
+++ b/public/locales/en-US/grafana.json
@@ -163,9 +163,9 @@
"parse-mode-warning-title": "Telegram messages are limited to 4096 UTF-8 characters."
},
"used-by_one": "Used by {{ count }} notification policy",
- "used-by_other": "Used by {{ count }} notification policies",
+ "used-by_other": "Used by {{ count }} notification policy",
"used-by-rules_one": "Used by {{ count }} alert rule",
- "used-by-rules_other": "Used by {{ count }} alert rules"
+ "used-by-rules_other": "Used by {{ count }} alert rule"
},
"contactPointFilter": {
"label": "Contact point"
@@ -233,7 +233,7 @@
"inherited": "Inherited",
"mute-time": "Muted when",
"n-instances_one": "instance",
- "n-instances_other": "instances",
+ "n-instances_other": "instance",
"timingOptions": {
"groupInterval": {
"description": "How long to wait before sending a notification about new alerts that are added to a group of alerts for which an initial notification has already been sent.",
@@ -249,7 +249,7 @@
}
}
},
- "n-more-policies_one": "{{count}} additional policy",
+ "n-more-policies_one": "{{count}} additional policies",
"n-more-policies_other": "{{count}} additional policies",
"new-child": "New child policy",
"new-policy": "Add new policy",
@@ -323,15 +323,15 @@
"save-query": "Save current search"
},
"simpleCondition": {
- "alertCondition": "Alert condition",
- "ofQuery": {
- "To": "TO"
- }
+ "alertCondition": "Alert condition"
},
"templates": {
"misconfigured-badge-text": "Misconfigured",
"misconfigured-warning": "This template is misconfigured.",
"misconfigured-warning-details": "Templates must be defined in both the <1>1> and <4>4> sections of your alertmanager configuration."
+ },
+ "threshold": {
+ "to": "TO"
}
},
"annotations": {
@@ -382,15 +382,15 @@
},
"counts": {
"alertRule_one": "{{count}} alert rule",
- "alertRule_other": "{{count}} alert rules",
+ "alertRule_other": "{{count}} alert rule",
"dashboard_one": "{{count}} dashboard",
- "dashboard_other": "{{count}} dashboards",
+ "dashboard_other": "{{count}} dashboard",
"folder_one": "{{count}} folder",
- "folder_other": "{{count}} folders",
+ "folder_other": "{{count}} folder",
"libraryPanel_one": "{{count}} library panel",
- "libraryPanel_other": "{{count}} library panels",
+ "libraryPanel_other": "{{count}} library panel",
"total_one": "{{count}} item",
- "total_other": "{{count}} items"
+ "total_other": "{{count}} item"
},
"dashboards-tree": {
"collapse-folder-button": "Collapse folder {{title}}",
@@ -2445,16 +2445,16 @@
"confirm-text": "Delete",
"delete-button": "Delete",
"delete-loading": "Deleting...",
- "text_one": "This action will delete {{numberOfDashboards}} dashboard.",
+ "text_one": "This action will delete {{numberOfDashboards}} dashboards.",
"text_other": "This action will delete {{numberOfDashboards}} dashboards.",
"title": "Permanently Delete Dashboards"
},
"restore-modal": {
- "folder-picker-text_one": "Please choose a folder where your dashboard will be restored.",
+ "folder-picker-text_one": "Please choose a folder where your dashboards will be restored.",
"folder-picker-text_other": "Please choose a folder where your dashboards will be restored.",
"restore-button": "Restore",
"restore-loading": "Restoring...",
- "text_one": "This action will restore {{numberOfDashboards}} dashboard.",
+ "text_one": "This action will restore {{numberOfDashboards}} dashboards.",
"text_other": "This action will restore {{numberOfDashboards}} dashboards.",
"title": "Restore Dashboards"
}
diff --git a/public/locales/pseudo-LOCALE/grafana.json b/public/locales/pseudo-LOCALE/grafana.json
index 09d232d2435..bc936363a98 100644
--- a/public/locales/pseudo-LOCALE/grafana.json
+++ b/public/locales/pseudo-LOCALE/grafana.json
@@ -163,9 +163,9 @@
"parse-mode-warning-title": "Ŧęľęģřäm męşşäģęş äřę ľįmįŧęđ ŧő 4096 ŮŦF-8 čĥäřäčŧęřş."
},
"used-by_one": "Ůşęđ þy {{ count }} ʼnőŧįƒįčäŧįőʼn pőľįčy",
- "used-by_other": "Ůşęđ þy {{ count }} ʼnőŧįƒįčäŧįőʼn pőľįčįęş",
+ "used-by_other": "Ůşęđ þy {{ count }} ʼnőŧįƒįčäŧįőʼn pőľįčy",
"used-by-rules_one": "Ůşęđ þy {{ count }} äľęřŧ řūľę",
- "used-by-rules_other": "Ůşęđ þy {{ count }} äľęřŧ řūľęş"
+ "used-by-rules_other": "Ůşęđ þy {{ count }} äľęřŧ řūľę"
},
"contactPointFilter": {
"label": "Cőʼnŧäčŧ pőįʼnŧ"
@@ -233,7 +233,7 @@
"inherited": "Ĩʼnĥęřįŧęđ",
"mute-time": "Mūŧęđ ŵĥęʼn",
"n-instances_one": "įʼnşŧäʼnčę",
- "n-instances_other": "įʼnşŧäʼnčęş",
+ "n-instances_other": "įʼnşŧäʼnčę",
"timingOptions": {
"groupInterval": {
"description": "Ħőŵ ľőʼnģ ŧő ŵäįŧ þęƒőřę şęʼnđįʼnģ ä ʼnőŧįƒįčäŧįőʼn äþőūŧ ʼnęŵ äľęřŧş ŧĥäŧ äřę äđđęđ ŧő ä ģřőūp őƒ äľęřŧş ƒőř ŵĥįčĥ äʼn įʼnįŧįäľ ʼnőŧįƒįčäŧįőʼn ĥäş äľřęäđy þęęʼn şęʼnŧ.",
@@ -249,7 +249,7 @@
}
}
},
- "n-more-policies_one": "{{count}} äđđįŧįőʼnäľ pőľįčy",
+ "n-more-policies_one": "{{count}} äđđįŧįőʼnäľ pőľįčįęş",
"n-more-policies_other": "{{count}} äđđįŧįőʼnäľ pőľįčįęş",
"new-child": "Ńęŵ čĥįľđ pőľįčy",
"new-policy": "Åđđ ʼnęŵ pőľįčy",
@@ -323,15 +323,15 @@
"save-query": "Ŝävę čūřřęʼnŧ şęäřčĥ"
},
"simpleCondition": {
- "alertCondition": "Åľęřŧ čőʼnđįŧįőʼn",
- "ofQuery": {
- "To": "ŦØ"
- }
+ "alertCondition": "Åľęřŧ čőʼnđįŧįőʼn"
},
"templates": {
"misconfigured-badge-text": "Mįşčőʼnƒįģūřęđ",
"misconfigured-warning": "Ŧĥįş ŧęmpľäŧę įş mįşčőʼnƒįģūřęđ.",
"misconfigured-warning-details": "Ŧęmpľäŧęş mūşŧ þę đęƒįʼnęđ įʼn þőŧĥ ŧĥę <1>1> äʼnđ <4>4> şęčŧįőʼnş őƒ yőūř äľęřŧmäʼnäģęř čőʼnƒįģūřäŧįőʼn."
+ },
+ "threshold": {
+ "to": "ŦØ"
}
},
"annotations": {
@@ -382,15 +382,15 @@
},
"counts": {
"alertRule_one": "{{count}} äľęřŧ řūľę",
- "alertRule_other": "{{count}} äľęřŧ řūľęş",
+ "alertRule_other": "{{count}} äľęřŧ řūľę",
"dashboard_one": "{{count}} đäşĥþőäřđ",
- "dashboard_other": "{{count}} đäşĥþőäřđş",
+ "dashboard_other": "{{count}} đäşĥþőäřđ",
"folder_one": "{{count}} ƒőľđęř",
- "folder_other": "{{count}} ƒőľđęřş",
+ "folder_other": "{{count}} ƒőľđęř",
"libraryPanel_one": "{{count}} ľįþřäřy päʼnęľ",
- "libraryPanel_other": "{{count}} ľįþřäřy päʼnęľş",
+ "libraryPanel_other": "{{count}} ľįþřäřy päʼnęľ",
"total_one": "{{count}} įŧęm",
- "total_other": "{{count}} įŧęmş"
+ "total_other": "{{count}} įŧęm"
},
"dashboards-tree": {
"collapse-folder-button": "Cőľľäpşę ƒőľđęř {{title}}",
@@ -2445,16 +2445,16 @@
"confirm-text": "Đęľęŧę",
"delete-button": "Đęľęŧę",
"delete-loading": "Đęľęŧįʼnģ...",
- "text_one": "Ŧĥįş äčŧįőʼn ŵįľľ đęľęŧę {{numberOfDashboards}} đäşĥþőäřđ.",
+ "text_one": "Ŧĥįş äčŧįőʼn ŵįľľ đęľęŧę {{numberOfDashboards}} đäşĥþőäřđş.",
"text_other": "Ŧĥįş äčŧįőʼn ŵįľľ đęľęŧę {{numberOfDashboards}} đäşĥþőäřđş.",
"title": "Pęřmäʼnęʼnŧľy Đęľęŧę Đäşĥþőäřđş"
},
"restore-modal": {
- "folder-picker-text_one": "Pľęäşę čĥőőşę ä ƒőľđęř ŵĥęřę yőūř đäşĥþőäřđ ŵįľľ þę řęşŧőřęđ.",
+ "folder-picker-text_one": "Pľęäşę čĥőőşę ä ƒőľđęř ŵĥęřę yőūř đäşĥþőäřđş ŵįľľ þę řęşŧőřęđ.",
"folder-picker-text_other": "Pľęäşę čĥőőşę ä ƒőľđęř ŵĥęřę yőūř đäşĥþőäřđş ŵįľľ þę řęşŧőřęđ.",
"restore-button": "Ŗęşŧőřę",
"restore-loading": "Ŗęşŧőřįʼnģ...",
- "text_one": "Ŧĥįş äčŧįőʼn ŵįľľ řęşŧőřę {{numberOfDashboards}} đäşĥþőäřđ.",
+ "text_one": "Ŧĥįş äčŧįőʼn ŵįľľ řęşŧőřę {{numberOfDashboards}} đäşĥþőäřđş.",
"text_other": "Ŧĥįş äčŧįőʼn ŵįľľ řęşŧőřę {{numberOfDashboards}} đäşĥþőäřđş.",
"title": "Ŗęşŧőřę Đäşĥþőäřđş"
}