Alerting: Hide GMA/DMA switch if no appropriate data sources are configured (#104038)
This commit is contained in:
+40
-20
@@ -11,9 +11,9 @@ import {
|
||||
Alert,
|
||||
Button,
|
||||
ConfirmModal,
|
||||
Divider,
|
||||
Dropdown,
|
||||
Field,
|
||||
Icon,
|
||||
Menu,
|
||||
MenuItem,
|
||||
Stack,
|
||||
@@ -160,7 +160,7 @@ export const QueryAndExpressionsStep = ({ editingExistingRule, onDataChange, mod
|
||||
}
|
||||
}, [simplifiedQueryStep, expressionQueries, isGrafanaAlertingType, setSimpleCondition]);
|
||||
|
||||
const { rulesSourcesWithRuler } = useRulesSourcesWithRuler();
|
||||
const { rulesSourcesWithRuler, isLoading: rulerSourcesIsLoading } = useRulesSourcesWithRuler();
|
||||
|
||||
const runQueriesPreview = useCallback(
|
||||
(condition?: string) => {
|
||||
@@ -474,6 +474,8 @@ export const QueryAndExpressionsStep = ({ editingExistingRule, onDataChange, mod
|
||||
}
|
||||
: undefined;
|
||||
|
||||
const hasDatasourcesForDataSourceManaged = Boolean(rulesSourcesWithRuler.length);
|
||||
|
||||
return (
|
||||
<>
|
||||
<RuleEditorSection
|
||||
@@ -513,8 +515,14 @@ export const QueryAndExpressionsStep = ({ editingExistingRule, onDataChange, mod
|
||||
</Field>
|
||||
)}
|
||||
|
||||
{rulerSourcesIsLoading && (
|
||||
<Text>
|
||||
<Trans i18nKey="alerting.query-and-expressions-step.loading-data-sources">Loading data sources...</Trans>
|
||||
</Text>
|
||||
)}
|
||||
|
||||
{/* This is the PromQL Editor for Cloud rules */}
|
||||
{isCloudAlertRuleType && dataSourceName && (
|
||||
{!rulerSourcesIsLoading && isCloudAlertRuleType && dataSourceName && (
|
||||
<Stack direction="column">
|
||||
<Field error={errors.expression?.message} invalid={!!errors.expression?.message}>
|
||||
<Controller
|
||||
@@ -536,18 +544,21 @@ export const QueryAndExpressionsStep = ({ editingExistingRule, onDataChange, mod
|
||||
/>
|
||||
</Field>
|
||||
{mode === 'edit' && (
|
||||
<SmartAlertTypeDetector
|
||||
editingExistingRule={editingExistingRule}
|
||||
queries={queries}
|
||||
rulesSourcesWithRuler={rulesSourcesWithRuler}
|
||||
onClickSwitch={onClickSwitch}
|
||||
/>
|
||||
<>
|
||||
<Divider />
|
||||
<SmartAlertTypeDetector
|
||||
editingExistingRule={editingExistingRule}
|
||||
queries={queries}
|
||||
rulesSourcesWithRuler={rulesSourcesWithRuler}
|
||||
onClickSwitch={onClickSwitch}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</Stack>
|
||||
)}
|
||||
|
||||
{/* This is the editor for Grafana managed rules and Grafana managed recording rules */}
|
||||
{isGrafanaManagedRuleByType(type) && (
|
||||
{!rulerSourcesIsLoading && isGrafanaManagedRuleByType(type) && (
|
||||
<Stack direction="column">
|
||||
{/* Data Queries */}
|
||||
<QueryEditor
|
||||
@@ -561,7 +572,13 @@ export const QueryAndExpressionsStep = ({ editingExistingRule, onDataChange, mod
|
||||
onSetCondition={handleSetCondition}
|
||||
/>
|
||||
{!simplifiedQueryStep && (
|
||||
<Tooltip content={'You appear to have no compatible data sources'} show={noCompatibleDataSources}>
|
||||
<Tooltip
|
||||
content={t(
|
||||
'alerting.query-and-expressions-step.no-compatible-sources',
|
||||
'You appear to have no compatible data sources'
|
||||
)}
|
||||
show={noCompatibleDataSources}
|
||||
>
|
||||
<Button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
@@ -577,17 +594,21 @@ export const QueryAndExpressionsStep = ({ editingExistingRule, onDataChange, mod
|
||||
</Tooltip>
|
||||
)}
|
||||
{/* We only show Switch for Grafana managed alerts */}
|
||||
{isGrafanaAlertingType && !simplifiedQueryStep && mode === 'edit' && (
|
||||
<SmartAlertTypeDetector
|
||||
editingExistingRule={editingExistingRule}
|
||||
rulesSourcesWithRuler={rulesSourcesWithRuler}
|
||||
queries={queries}
|
||||
onClickSwitch={onClickSwitch}
|
||||
/>
|
||||
{hasDatasourcesForDataSourceManaged && isGrafanaAlertingType && !simplifiedQueryStep && mode === 'edit' && (
|
||||
<>
|
||||
<Divider />
|
||||
<SmartAlertTypeDetector
|
||||
editingExistingRule={editingExistingRule}
|
||||
rulesSourcesWithRuler={rulesSourcesWithRuler}
|
||||
queries={queries}
|
||||
onClickSwitch={onClickSwitch}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
{/* Expression Queries */}
|
||||
{!simplifiedQueryStep && (
|
||||
<>
|
||||
<Divider />
|
||||
<Stack direction="column" gap={0}>
|
||||
<Text element="h5">
|
||||
<Trans i18nKey="alerting.query-and-expressions-step.expressions">Expressions</Trans>
|
||||
@@ -717,9 +738,8 @@ function TypeSelectorButton({ onClickType }: { onClickType: (type: ExpressionQue
|
||||
|
||||
return (
|
||||
<Dropdown overlay={newMenu}>
|
||||
<Button variant="secondary" data-testid={'add-expression-button'}>
|
||||
<Button variant="secondary" data-testid={'add-expression-button'} icon="angle-down">
|
||||
<Trans i18nKey="alerting.type-selector-button.add-expression">Add expression</Trans>
|
||||
<Icon name="angle-down" />
|
||||
</Button>
|
||||
</Dropdown>
|
||||
);
|
||||
|
||||
+5
-2
@@ -86,8 +86,11 @@ export function SmartAlertTypeDetector({
|
||||
const canSwitch = getCanSwitch({ queries, ruleFormType, rulesSourcesWithRuler });
|
||||
|
||||
const options = [
|
||||
{ label: 'Grafana-managed', value: RuleFormType.grafana },
|
||||
{ label: 'Data source-managed', value: RuleFormType.cloudAlerting },
|
||||
{ label: t('alerting.smart-alert-type-detector.grafana-managed', 'Grafana-managed'), value: RuleFormType.grafana },
|
||||
{
|
||||
label: t('alerting.smart-alert-type-detector.data-source-managed', 'Data source-managed'),
|
||||
value: RuleFormType.cloudAlerting,
|
||||
},
|
||||
];
|
||||
|
||||
// if we can't switch to data-source managed, disable it
|
||||
|
||||
+1
-1
@@ -179,7 +179,7 @@ describe('RuleEditor cloud: checking editable data sources', () => {
|
||||
|
||||
await ui.inputs.name.find();
|
||||
|
||||
const switchToCloudButton = screen.getByText('Data source-managed');
|
||||
const switchToCloudButton = await screen.findByText('Data source-managed');
|
||||
expect(switchToCloudButton).toBeInTheDocument();
|
||||
|
||||
await user.click(switchToCloudButton);
|
||||
|
||||
@@ -45,7 +45,7 @@ describe('RuleEditor cloud', () => {
|
||||
it('can create a new cloud alert', async () => {
|
||||
const { user } = renderRuleEditor();
|
||||
|
||||
const removeExpressionsButtons = screen.getAllByLabelText(/Remove expression/);
|
||||
const removeExpressionsButtons = await screen.findAllByLabelText(/Remove expression/);
|
||||
expect(removeExpressionsButtons).toHaveLength(2);
|
||||
|
||||
// Needs to wait for featrue discovery API call to finish - Check if ruler enabled
|
||||
|
||||
@@ -1712,7 +1712,9 @@
|
||||
"add-query": "Add query",
|
||||
"body-queries-expressions-configured": "Create at least one query or expression to be alerted on",
|
||||
"expressions": "Expressions",
|
||||
"loading-data-sources": "Loading data sources...",
|
||||
"manipulate-returned-queries-other-operations": "Manipulate data returned from queries with math and other operations.",
|
||||
"no-compatible-sources": "You appear to have no compatible data sources",
|
||||
"title-deactivate-advanced-options": "Deactivate advanced options",
|
||||
"title-queries-expressions-configured": "No queries or expressions have been configured"
|
||||
},
|
||||
@@ -2213,8 +2215,10 @@
|
||||
"alertCondition": "Alert condition"
|
||||
},
|
||||
"smart-alert-type-detector": {
|
||||
"data-source-managed": "Data source-managed",
|
||||
"data-sourcemanaged-alert-rules": "Data source-managed alert rules",
|
||||
"data-sourcemanaged-alert-rules-description": "Data source-managed alert rules can be used for Grafana Mimir or Grafana Loki data sources which have been configured to support rule creation. The use of expressions or multiple queries is not supported.",
|
||||
"grafana-managed": "Grafana-managed",
|
||||
"grafanamanaged-alert-rules": "Grafana-managed alert rules",
|
||||
"grafanamanaged-alert-rules-description": "Grafana-managed alert rules allow you to create alerts that can act on data from any of our supported data sources, including having multiple data sources in the same rule. You can also add expressions to transform your data and set alert conditions. Using images in alert notifications is also supported.",
|
||||
"rule-type": "Rule type",
|
||||
|
||||
Reference in New Issue
Block a user