[Metrics UI] Fixes for editing alerts in alert management

elastic · Apr 27, 2020 · c3e2765 · c3e2765
1 parent 54dc148
commit c3e2765
Showing 1 changed file with 52 additions and 42 deletions.
diff --git a/x-pack/plugins/infra/public/components/alerting/metrics/expression.tsx b/x-pack/plugins/infra/public/components/alerting/metrics/expression.tsx
@@ -13,6 +13,7 @@ import {
   EuiText,
   EuiFormRow,
   EuiButtonEmpty,
+  EuiFieldSearch,
 } from '@elastic/eui';
 import { IFieldType } from 'src/plugins/data/public';
 import { FormattedMessage } from '@kbn/i18n/react';
@@ -215,7 +216,12 @@ export const Expressions: React.FC<Props> = props => {
       }
       setAlertParams('sourceId', source?.id);
     } else {
-      setAlertParams('criteria', [defaultExpression]);
+      if (!alertParams.criteria) {
+        setAlertParams('criteria', [defaultExpression]);
+      }
+      if (!alertParams.sourceId) {
+        setAlertParams('sourceId', source?.id || 'default');
+      }
     }
   }, [alertsContext.metadata, defaultExpression, source]); // eslint-disable-line react-hooks/exhaustive-deps
 
@@ -273,48 +279,52 @@ export const Expressions: React.FC<Props> = props => {
 
       <EuiSpacer size={'m'} />
 
-      {alertsContext.metadata && (
-        <>
-          <EuiFormRow
-            label={i18n.translate('xpack.infra.metrics.alertFlyout.filterLabel', {
-              defaultMessage: 'Filter (optional)',
-            })}
-            helpText={i18n.translate('xpack.infra.metrics.alertFlyout.filterHelpText', {
-              defaultMessage: 'Use a KQL expression to limit the scope of your alert trigger.',
-            })}
-            fullWidth
-            compressed
-          >
-            <MetricsExplorerKueryBar
-              derivedIndexPattern={derivedIndexPattern}
-              onSubmit={onFilterQuerySubmit}
-              value={alertParams.filterQuery}
-            />
-          </EuiFormRow>
-
-          <EuiSpacer size={'m'} />
-          <EuiFormRow
-            label={i18n.translate('xpack.infra.metrics.alertFlyout.createAlertPerText', {
-              defaultMessage: 'Create alert per (optional)',
-            })}
-            helpText={i18n.translate('xpack.infra.metrics.alertFlyout.createAlertPerHelpText', {
-              defaultMessage:
-                'Create an alert for every unique value. For example: "host.id" or "cloud.region".',
-            })}
+      <EuiFormRow
+        label={i18n.translate('xpack.infra.metrics.alertFlyout.filterLabel', {
+          defaultMessage: 'Filter (optional)',
+        })}
+        helpText={i18n.translate('xpack.infra.metrics.alertFlyout.filterHelpText', {
+          defaultMessage: 'Use a KQL expression to limit the scope of your alert trigger.',
+        })}
+        fullWidth
+        compressed
+      >
+        {(alertsContext.metadata && (
+          <MetricsExplorerKueryBar
+            derivedIndexPattern={derivedIndexPattern}
+            onSubmit={onFilterQuerySubmit}
+            value={alertParams.filterQuery}
+          />
+        )) || (
+          <EuiFieldSearch
+            onSearch={onFilterQuerySubmit}
+            value={alertParams.filterQuery}
             fullWidth
-            compressed
-          >
-            <MetricsExplorerGroupBy
-              onChange={onGroupByChange}
-              fields={derivedIndexPattern.fields}
-              options={{
-                ...options,
-                groupBy: alertParams.groupBy || undefined,
-              }}
-            />
-          </EuiFormRow>
-        </>
-      )}
+          />
+        )}
+      </EuiFormRow>
+
+      <EuiSpacer size={'m'} />
+      <EuiFormRow
+        label={i18n.translate('xpack.infra.metrics.alertFlyout.createAlertPerText', {
+          defaultMessage: 'Create alert per (optional)',
+        })}
+        helpText={i18n.translate('xpack.infra.metrics.alertFlyout.createAlertPerHelpText', {
+          defaultMessage:
+            'Create an alert for every unique value. For example: "host.id" or "cloud.region".',
+        })}
+        fullWidth
+        compressed
+      >
+        <MetricsExplorerGroupBy
+          onChange={onGroupByChange}
+          fields={derivedIndexPattern.fields}
+          options={{
+            ...options,
+            groupBy: alertParams.groupBy || undefined,
+          }}
+        />
+      </EuiFormRow>
     </>
   );
 };