[Alerting] Moves the Index & Geo Threshold UIs into the Stack Alerts …

…Public Plugin (#82951) (#83316) This PR includes the following refactors: 1. Moves the Index Pattern Api from _Stack Alerts_ to the _Server_ plugin of _Trigger Actions UI_. This fixes a potential bug where a user could disable the _Stack Alerts_ plugin and inadvertently break the UI of the _ES Index _ action type. 2. Extracts the UI components for _Index Threshold_ and _Geo Threshold_ from the _Trigger Actions UI_ plugin and moves them into _Stack Alerts_. # Conflicts: # packages/kbn-optimizer/limits.yml
elastic · Nov 12, 2020 · 5f36a27 · 5f36a27
1 parent b9de2c8
commit 5f36a27
Show file tree

Hide file tree

Showing 78 changed files with 1,212 additions and 896 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1039,12 +1039,19 @@ module.exports = {
      * Alerting Services overrides
      */
     {
-      // typescript only for front and back end
+      // typescript for front and back end
       files: ['x-pack/plugins/{alerts,stack_alerts,actions,task_manager,event_log}/**/*.{ts,tsx}'],
       rules: {
         '@typescript-eslint/no-explicit-any': 'error',
       },
     },
+    {
+      // typescript only for back end
+      files: ['x-pack/plugins/triggers_actions_ui/server/**/*.ts'],
+      rules: {
+        '@typescript-eslint/no-explicit-any': 'error',
+      },
+    },
 
     /**
      * Lens overrides

diff --git a/packages/kbn-optimizer/limits.yml b/packages/kbn-optimizer/limits.yml
@@ -102,3 +102,4 @@ pageLoadAssetSize:
   visualizations: 295169
   visualize: 57433
   watcher: 43742
+  stackAlerts: 29684
diff --git a/x-pack/plugins/stack_alerts/server/config.ts → x-pack/plugins/stack_alerts/common/config.ts b/x-pack/plugins/stack_alerts/server/config.ts → x-pack/plugins/stack_alerts/common/config.ts
@@ -8,6 +8,7 @@ import { schema, TypeOf } from '@kbn/config-schema';
 
 export const configSchema = schema.object({
   enabled: schema.boolean({ defaultValue: true }),
+  enableGeoTrackingThresholdAlert: schema.boolean({ defaultValue: false }),
 });
 
 export type Config = TypeOf<typeof configSchema>;
diff --git a/x-pack/plugins/stack_alerts/common/index.ts b/x-pack/plugins/stack_alerts/common/index.ts
@@ -3,5 +3,5 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-
+export * from './config';
 export const STACK_ALERTS_FEATURE_ID = 'stackAlerts';
diff --git a/x-pack/plugins/stack_alerts/kibana.json b/x-pack/plugins/stack_alerts/kibana.json
@@ -3,7 +3,7 @@
   "server": true,
   "version": "8.0.0",
   "kibanaVersion": "kibana",
-  "requiredPlugins": ["alerts", "features"],
+  "requiredPlugins": ["alerts", "features", "triggersActionsUi", "kibanaReact"],
   "configPath": ["xpack", "stack_alerts"],
-  "ui": false
+  "ui": true
 }
diff --git a/...uiltin_alert_types/geo_threshold/index.ts → ...public/alert_types/geo_threshold/index.ts b/...uiltin_alert_types/geo_threshold/index.ts → ...public/alert_types/geo_threshold/index.ts
@@ -5,18 +5,17 @@
  */
 import { lazy } from 'react';
 import { i18n } from '@kbn/i18n';
-import { AlertTypeModel } from '../../../../types';
 import { validateExpression } from './validation';
 import { GeoThresholdAlertParams } from './types';
-import { AlertsContextValue } from '../../../context/alerts_context';
+import { AlertTypeModel, AlertsContextValue } from '../../../../triggers_actions_ui/public';
 
 export function getAlertType(): AlertTypeModel<GeoThresholdAlertParams, AlertsContextValue> {
   return {
     id: '.geo-threshold',
-    name: i18n.translate('xpack.triggersActionsUI.geoThreshold.name.trackingThreshold', {
+    name: i18n.translate('xpack.stackAlerts.geoThreshold.name.trackingThreshold', {
       defaultMessage: 'Tracking threshold',
     }),
-    description: i18n.translate('xpack.triggersActionsUI.geoThreshold.descriptionText', {
+    description: i18n.translate('xpack.stackAlerts.geoThreshold.descriptionText', {
       defaultMessage: 'Alert when an entity enters or leaves a geo boundary.',
     }),
     iconClass: 'globe',

diff --git a/...expressions/boundary_index_expression.tsx → ...expressions/boundary_index_expression.tsx b/...expressions/boundary_index_expression.tsx → ...expressions/boundary_index_expression.tsx
@@ -7,14 +7,13 @@
 import React, { Fragment, FunctionComponent, useEffect, useRef } from 'react';
 import { EuiFormRow } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { IErrorObject } from '../../../../../../types';
+import { IErrorObject, AlertsContextValue } from '../../../../../../triggers_actions_ui/public';
 import { ES_GEO_SHAPE_TYPES, GeoThresholdAlertParams } from '../../types';
-import { AlertsContextValue } from '../../../../../context/alerts_context';
 import { GeoIndexPatternSelect } from '../util_components/geo_index_pattern_select';
 import { SingleFieldSelect } from '../util_components/single_field_select';
 import { ExpressionWithPopover } from '../util_components/expression_with_popover';
-import { IFieldType } from '../../../../../../../../../../src/plugins/data/common/index_patterns/fields';
-import { IIndexPattern } from '../../../../../../../../../../src/plugins/data/common/index_patterns';
+import { IFieldType } from '../../../../../../../../src/plugins/data/common/index_patterns/fields';
+import { IIndexPattern } from '../../../../../../../../src/plugins/data/common/index_patterns';
 
 interface Props {
   alertParams: GeoThresholdAlertParams;
@@ -117,12 +116,12 @@ export const BoundaryIndexExpression: FunctionComponent<Props> = ({
       <EuiFormRow
         id="geoField"
         fullWidth
-        label={i18n.translate('xpack.triggersActionsUI.geoThreshold.geofieldLabel', {
+        label={i18n.translate('xpack.stackAlerts.geoThreshold.geofieldLabel', {
           defaultMessage: 'Geospatial field',
         })}
       >
         <SingleFieldSelect
-          placeholder={i18n.translate('xpack.triggersActionsUI.geoThreshold.selectLabel', {
+          placeholder={i18n.translate('xpack.stackAlerts.geoThreshold.selectLabel', {
             defaultMessage: 'Select geo field',
           })}
           value={boundaryGeoField}
@@ -133,12 +132,12 @@ export const BoundaryIndexExpression: FunctionComponent<Props> = ({
       <EuiFormRow
         id="boundaryNameFieldSelect"
         fullWidth
-        label={i18n.translate('xpack.triggersActionsUI.geoThreshold.boundaryNameSelectLabel', {
+        label={i18n.translate('xpack.stackAlerts.geoThreshold.boundaryNameSelectLabel', {
           defaultMessage: 'Human-readable boundary name (optional)',
         })}
       >
         <SingleFieldSelect
-          placeholder={i18n.translate('xpack.triggersActionsUI.geoThreshold.boundaryNameSelect', {
+          placeholder={i18n.translate('xpack.stackAlerts.geoThreshold.boundaryNameSelect', {
             defaultMessage: 'Select boundary name',
           })}
           value={boundaryNameField || null}
@@ -156,7 +155,7 @@ export const BoundaryIndexExpression: FunctionComponent<Props> = ({
       defaultValue={'Select an index pattern and geo shape field'}
       value={boundaryIndexPattern.title}
       popoverContent={indexPopover}
-      expressionDescription={i18n.translate('xpack.triggersActionsUI.geoThreshold.indexLabel', {
+      expressionDescription={i18n.translate('xpack.stackAlerts.geoThreshold.indexLabel', {
         defaultMessage: 'index',
       })}
     />

diff --git a/...lder/expressions/entity_by_expression.tsx → ...lder/expressions/entity_by_expression.tsx b/...lder/expressions/entity_by_expression.tsx → ...lder/expressions/entity_by_expression.tsx
@@ -8,10 +8,10 @@ import React, { FunctionComponent, useEffect, useRef } from 'react';
 import { EuiFormRow } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import _ from 'lodash';
-import { IErrorObject } from '../../../../../../types';
+import { IErrorObject } from '../../../../../../triggers_actions_ui/public';
 import { SingleFieldSelect } from '../util_components/single_field_select';
 import { ExpressionWithPopover } from '../util_components/expression_with_popover';
-import { IFieldType } from '../../../../../../../../../../src/plugins/data/common/index_patterns/fields';
+import { IFieldType } from '../../../../../../../../src/plugins/data/common/index_patterns/fields';
 
 interface Props {
   errors: IErrorObject;
@@ -59,7 +59,7 @@ export const EntityByExpression: FunctionComponent<Props> = ({
     <EuiFormRow id="entitySelect" fullWidth error={errors.index}>
       <SingleFieldSelect
         placeholder={i18n.translate(
-          'xpack.triggersActionsUI.geoThreshold.topHitsSplitFieldSelectPlaceholder',
+          'xpack.stackAlerts.geoThreshold.topHitsSplitFieldSelectPlaceholder',
           {
             defaultMessage: 'Select entity field',
           }
@@ -77,7 +77,7 @@ export const EntityByExpression: FunctionComponent<Props> = ({
       value={entity}
       defaultValue={'Select entity field'}
       popoverContent={indexPopover}
-      expressionDescription={i18n.translate('xpack.triggersActionsUI.geoThreshold.entityByLabel', {
+      expressionDescription={i18n.translate('xpack.stackAlerts.geoThreshold.entityByLabel', {
         defaultMessage: 'by',
       })}
     />

diff --git a/...r/expressions/entity_index_expression.tsx → ...r/expressions/entity_index_expression.tsx b/...r/expressions/entity_index_expression.tsx → ...r/expressions/entity_index_expression.tsx
@@ -8,14 +8,13 @@ import React, { Fragment, FunctionComponent, useEffect, useRef } from 'react';
 import { EuiFormRow } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
-import { IErrorObject } from '../../../../../../types';
+import { IErrorObject, AlertsContextValue } from '../../../../../../triggers_actions_ui/public';
 import { ES_GEO_FIELD_TYPES } from '../../types';
-import { AlertsContextValue } from '../../../../../context/alerts_context';
 import { GeoIndexPatternSelect } from '../util_components/geo_index_pattern_select';
 import { SingleFieldSelect } from '../util_components/single_field_select';
 import { ExpressionWithPopover } from '../util_components/expression_with_popover';
-import { IFieldType } from '../../../../../../../../../../src/plugins/data/common/index_patterns/fields';
-import { IIndexPattern } from '../../../../../../../../../../src/plugins/data/common/index_patterns';
+import { IFieldType } from '../../../../../../../../src/plugins/data/common/index_patterns/fields';
+import { IIndexPattern } from '../../../../../../../../src/plugins/data/common/index_patterns';
 
 interface Props {
   dateField: string;
@@ -105,13 +104,13 @@ export const EntityIndexExpression: FunctionComponent<Props> = ({
         fullWidth
         label={
           <FormattedMessage
-            id="xpack.triggersActionsUI.geoThreshold.timeFieldLabel"
+            id="xpack.stackAlerts.geoThreshold.timeFieldLabel"
             defaultMessage="Time field"
           />
         }
       >
         <SingleFieldSelect
-          placeholder={i18n.translate('xpack.triggersActionsUI.geoThreshold.selectTimeLabel', {
+          placeholder={i18n.translate('xpack.stackAlerts.geoThreshold.selectTimeLabel', {
             defaultMessage: 'Select time field',
           })}
           value={timeField}
@@ -124,12 +123,12 @@ export const EntityIndexExpression: FunctionComponent<Props> = ({
       <EuiFormRow
         id="geoField"
         fullWidth
-        label={i18n.translate('xpack.triggersActionsUI.geoThreshold.geofieldLabel', {
+        label={i18n.translate('xpack.stackAlerts.geoThreshold.geofieldLabel', {
           defaultMessage: 'Geospatial field',
         })}
       >
         <SingleFieldSelect
-          placeholder={i18n.translate('xpack.triggersActionsUI.geoThreshold.selectGeoLabel', {
+          placeholder={i18n.translate('xpack.stackAlerts.geoThreshold.selectGeoLabel', {
             defaultMessage: 'Select geo field',
           })}
           value={geoField}
@@ -148,12 +147,9 @@ export const EntityIndexExpression: FunctionComponent<Props> = ({
       value={indexPattern.title}
       defaultValue={'Select an index pattern and geo shape/point field'}
       popoverContent={indexPopover}
-      expressionDescription={i18n.translate(
-        'xpack.triggersActionsUI.geoThreshold.entityIndexLabel',
-        {
-          defaultMessage: 'index',
-        }
-      )}
+      expressionDescription={i18n.translate('xpack.stackAlerts.geoThreshold.entityIndexLabel', {
+        defaultMessage: 'index',
+      })}
     />
   );
 };
diff --git a/...pes/geo_threshold/query_builder/index.tsx → ...pes/geo_threshold/query_builder/index.tsx b/...pes/geo_threshold/query_builder/index.tsx → ...pes/geo_threshold/query_builder/index.tsx
@@ -19,15 +19,17 @@ import {
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
-import { AlertTypeParamsExpressionProps } from '../../../../../types';
+import {
+  AlertTypeParamsExpressionProps,
+  getTimeOptions,
+  AlertsContextValue,
+} from '../../../../../triggers_actions_ui/public';
 import { GeoThresholdAlertParams, TrackingEvent } from '../types';
-import { AlertsContextValue } from '../../../../context/alerts_context';
 import { ExpressionWithPopover } from './util_components/expression_with_popover';
 import { EntityIndexExpression } from './expressions/entity_index_expression';
 import { EntityByExpression } from './expressions/entity_by_expression';
 import { BoundaryIndexExpression } from './expressions/boundary_index_expression';
-import { IIndexPattern } from '../../../../../../../../../src/plugins/data/common/index_patterns';
-import { getTimeOptions } from '../../../../../common/lib/get_time_options';
+import { IIndexPattern } from '../../../../../../../src/plugins/data/common/index_patterns';
 
 const DEFAULT_VALUES = {
   TRACKING_EVENT: '',
@@ -45,20 +47,20 @@ const DEFAULT_VALUES = {
 };
 
 const conditionOptions = Object.keys(TrackingEvent).map((key) => ({
-  text: (TrackingEvent as any)[key],
-  value: (TrackingEvent as any)[key],
+  text: TrackingEvent[key as TrackingEvent],
+  value: TrackingEvent[key as TrackingEvent],
 }));
 
 const labelForDelayOffset = (
   <>
     <FormattedMessage
-      id="xpack.triggersActionsUI.geoThreshold.delayOffset"
+      id="xpack.stackAlerts.geoThreshold.delayOffset"
       defaultMessage="Delayed evaluation offset"
     />{' '}
     <EuiIconTip
       position="right"
       type="questionInCircle"
-      content={i18n.translate('xpack.triggersActionsUI.geoThreshold.delayOffsetTooltip', {
+      content={i18n.translate('xpack.stackAlerts.geoThreshold.delayOffsetTooltip', {
         defaultMessage: 'Evaluate alerts on a delayed cycle to adjust for data latency',
       })}
     />
@@ -125,7 +127,7 @@ export const GeoThresholdAlertTypeExpression: React.FunctionComponent<AlertTypeP
 
   const hasExpressionErrors = false;
   const expressionErrorMessage = i18n.translate(
-    'xpack.triggersActionsUI.geoThreshold.fixErrorInExpressionBelowValidationMessage',
+    'xpack.stackAlerts.geoThreshold.fixErrorInExpressionBelowValidationMessage',
     {
       defaultMessage: 'Expression contains errors.',
     }
@@ -180,7 +182,7 @@ export const GeoThresholdAlertTypeExpression: React.FunctionComponent<AlertTypeP
       <EuiTitle size="xs">
         <h5>
           <FormattedMessage
-            id="xpack.triggersActionsUI.geoThreshold.selectOffset"
+            id="xpack.stackAlerts.geoThreshold.selectOffset"
             defaultMessage="Select offset (optional)"
           />
         </h5>
@@ -221,7 +223,7 @@ export const GeoThresholdAlertTypeExpression: React.FunctionComponent<AlertTypeP
       <EuiTitle size="xs">
         <h5>
           <FormattedMessage
-            id="xpack.triggersActionsUI.geoThreshold.selectEntity"
+            id="xpack.stackAlerts.geoThreshold.selectEntity"
             defaultMessage="Select entity"
           />
         </h5>
@@ -251,7 +253,7 @@ export const GeoThresholdAlertTypeExpression: React.FunctionComponent<AlertTypeP
       <EuiTitle size="xs">
         <h5>
           <FormattedMessage
-            id="xpack.triggersActionsUI.geoThreshold.selectIndex"
+            id="xpack.stackAlerts.geoThreshold.selectIndex"
             defaultMessage="Define the condition"
           />
         </h5>
@@ -280,19 +282,16 @@ export const GeoThresholdAlertTypeExpression: React.FunctionComponent<AlertTypeP
             </div>
           </EuiFormRow>
         }
-        expressionDescription={i18n.translate(
-          'xpack.triggersActionsUI.geoThreshold.whenEntityLabel',
-          {
-            defaultMessage: 'when entity',
-          }
-        )}
+        expressionDescription={i18n.translate('xpack.stackAlerts.geoThreshold.whenEntityLabel', {
+          defaultMessage: 'when entity',
+        })}
       />
 
       <EuiSpacer size="l" />
       <EuiTitle size="xs">
         <h5>
           <FormattedMessage
-            id="xpack.triggersActionsUI.geoThreshold.selectBoundaryIndex"
+            id="xpack.stackAlerts.geoThreshold.selectBoundaryIndex"
             defaultMessage="Select boundary:"
           />
         </h5>

diff --git a/...il_components/expression_with_popover.tsx → ...il_components/expression_with_popover.tsx b/...il_components/expression_with_popover.tsx → ...il_components/expression_with_popover.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { useState } from 'react';
+import React, { ReactNode, useState } from 'react';
 import {
   EuiButtonIcon,
   EuiExpression,
@@ -22,10 +22,10 @@ export const ExpressionWithPopover: ({
   value,
   isInvalid,
 }: {
-  popoverContent: any;
-  expressionDescription: any;
-  defaultValue?: any;
-  value?: any;
+  popoverContent: ReactNode;
+  expressionDescription: ReactNode;
+  defaultValue?: ReactNode;
+  value?: ReactNode;
   isInvalid?: boolean;
 }) => JSX.Element = ({ popoverContent, expressionDescription, defaultValue, value, isInvalid }) => {
   const [popoverOpen, setPopoverOpen] = useState(false);
@@ -61,7 +61,7 @@ export const ExpressionWithPopover: ({
                 iconType="cross"
                 color="danger"
                 aria-label={i18n.translate(
-                  'xpack.triggersActionsUI.sections.alertAdd.geoThreshold.closePopoverLabel',
+                  'xpack.stackAlerts.geoThreshold.ui.expressionPopover.closePopoverLabel',
                   {
                     defaultMessage: 'Close',
                   }