Merge remote-tracking branch 'origin/master' into create-engine-view

Author: byronhulcher

docs/user/alerting/alert-types.asciidoc

@@ -130,12 +130,13 @@ image::images/alert-types-es-query-select.png[Choosing an ES query alert type]
 [float]
 ==== Defining the conditions
 
-The ES query alert has 4 clauses that define the condition to detect.
+The ES query alert has 5 clauses that define the condition to detect.
 
 [role="screenshot"]
 image::images/alert-types-es-query-conditions.png[Four clauses define the condition to detect]
 
 Index:: This clause requires an *index or index pattern* and a *time field* that will be used for the *time window*.
+Size:: This clause specifies the number of documents to pass to the configured actions when the the threshold condition is met.
 ES query:: This clause specifies the ES DSL query to execute. The number of documents that match this query will be evaulated against the threshold
 condition. Aggregations are not supported at this time. 
 Threshold:: This clause defines a threshold value and a comparison operator  (`is above`, `is above or equals`, `is below`, `is below or equals`, or `is between`). The number of documents that match the specified query is compared to this threshold.

docs/user/alerting/images/alert-types-es-query-conditions.png

@@ -62,6 +62,7 @@ export const getMetricsHostsAnomaliesRequestPayloadRT = rt.type({
     rt.type({
       // the ID of the source configuration
       sourceId: rt.string,
+      anomalyThreshold: rt.number,
       // the time range to fetch the log entry anomalies from
       timeRange: timeRangeRT,
     }),

x-pack/plugins/infra/common/http_api/infra_ml/results/metrics_hosts_anomalies.ts

@@ -62,6 +62,7 @@ export const getMetricsK8sAnomaliesRequestPayloadRT = rt.type({
     rt.type({
       // the ID of the source configuration
       sourceId: rt.string,
+      anomalyThreshold: rt.number,
       // the time range to fetch the log entry anomalies from
       timeRange: timeRangeRT,
     }),

x-pack/plugins/infra/common/http_api/infra_ml/results/metrics_k8s_anomalies.ts

@@ -90,6 +90,7 @@ export const SavedSourceConfigurationRuntimeType = rt.partial({
   metricsExplorerDefaultView: rt.string,
   fields: SavedSourceConfigurationFieldsRuntimeType,
   logColumns: rt.array(SavedSourceConfigurationColumnRuntimeType),
+  anomalyThreshold: rt.number,
 });
 
 export interface InfraSavedSourceConfiguration
@@ -107,6 +108,7 @@ export const pickSavedSourceConfiguration = (
     inventoryDefaultView,
     metricsExplorerDefaultView,
     logColumns,
+    anomalyThreshold,
   } = value;
   const { container, host, pod, tiebreaker, timestamp } = fields;
 
@@ -119,6 +121,7 @@ export const pickSavedSourceConfiguration = (
     metricsExplorerDefaultView,
     fields: { container, host, pod, tiebreaker, timestamp },
     logColumns,
+    anomalyThreshold,
   };
 };
 
@@ -140,6 +143,7 @@ export const StaticSourceConfigurationRuntimeType = rt.partial({
   metricsExplorerDefaultView: rt.string,
   fields: StaticSourceConfigurationFieldsRuntimeType,
   logColumns: rt.array(SavedSourceConfigurationColumnRuntimeType),
+  anomalyThreshold: rt.number,
 });
 
 export interface InfraStaticSourceConfiguration

x-pack/plugins/infra/common/http_api/source_api.ts

@@ -64,6 +64,7 @@ describe('ExpressionChart', () => {
           pod: 'kubernetes.pod.uid',
           tiebreaker: '_doc',
         },
+        anomalyThreshold: 20,
       },
     };
 

x-pack/plugins/infra/public/alerting/metric_threshold/components/expression_chart.test.tsx

@@ -7,7 +7,11 @@
 
 import { ReactNode, useCallback, useMemo, useState } from 'react';
 
-import { createInputFieldProps, validateInputFieldNotEmpty } from './input_fields';
+import {
+  createInputFieldProps,
+  createInputRangeFieldProps,
+  validateInputFieldNotEmpty,
+} from './input_fields';
 
 interface FormState {
   name: string;
@@ -20,6 +24,7 @@ interface FormState {
   podField: string;
   tiebreakerField: string;
   timestampField: string;
+  anomalyThreshold: number;
 }
 
 type FormStateChanges = Partial<FormState>;
@@ -124,6 +129,17 @@ export const useIndicesConfigurationFormState = ({
       }),
     [formState.timestampField]
   );
+  const anomalyThresholdFieldProps = useMemo(
+    () =>
+      createInputRangeFieldProps({
+        errors: validateInputFieldNotEmpty(formState.anomalyThreshold),
+        name: 'anomalyThreshold',
+        onChange: (anomalyThreshold) =>
+          setFormStateChanges((changes) => ({ ...changes, anomalyThreshold })),
+        value: formState.anomalyThreshold,
+      }),
+    [formState.anomalyThreshold]
+  );
 
   const fieldProps = useMemo(
     () => ({
@@ -135,6 +151,7 @@ export const useIndicesConfigurationFormState = ({
       podField: podFieldFieldProps,
       tiebreakerField: tiebreakerFieldFieldProps,
       timestampField: timestampFieldFieldProps,
+      anomalyThreshold: anomalyThresholdFieldProps,
     }),
     [
       nameFieldProps,
@@ -145,6 +162,7 @@ export const useIndicesConfigurationFormState = ({
       podFieldFieldProps,
       tiebreakerFieldFieldProps,
       timestampFieldFieldProps,
+      anomalyThresholdFieldProps,
     ]
   );
 
@@ -183,4 +201,5 @@ const defaultFormState: FormState = {
   podField: '',
   tiebreakerField: '',
   timestampField: '',
+  anomalyThreshold: 0,
 };

x-pack/plugins/infra/public/components/source_configuration/indices_configuration_form_state.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import React from 'react';
+import React, { ReactText } from 'react';
 
 import { FormattedMessage } from '@kbn/i18n/react';
 
@@ -43,7 +43,47 @@ export const createInputFieldProps = <
   value,
 });
 
-export const validateInputFieldNotEmpty = (value: string) =>
+export interface InputRangeFieldProps<
+  Value extends ReactText = ReactText,
+  FieldElement extends HTMLInputElement = HTMLInputElement,
+  ButtonElement extends HTMLButtonElement = HTMLButtonElement
+> {
+  error: React.ReactNode[];
+  isInvalid: boolean;
+  name: string;
+  onChange?: (
+    evt: React.ChangeEvent<FieldElement> | React.MouseEvent<ButtonElement>,
+    isValid: boolean
+  ) => void;
+  value: Value;
+}
+
+export const createInputRangeFieldProps = <
+  Value extends ReactText = ReactText,
+  FieldElement extends HTMLInputElement = HTMLInputElement,
+  ButtonElement extends HTMLButtonElement = HTMLButtonElement
+>({
+  errors,
+  name,
+  onChange,
+  value,
+}: {
+  errors: FieldErrorMessage[];
+  name: string;
+  onChange: (newValue: number, isValid: boolean) => void;
+  value: Value;
+}): InputRangeFieldProps<Value, FieldElement, ButtonElement> => ({
+  error: errors,
+  isInvalid: errors.length > 0,
+  name,
+  onChange: (
+    evt: React.ChangeEvent<FieldElement> | React.MouseEvent<ButtonElement>,
+    isValid: boolean
+  ) => onChange(+evt.currentTarget.value, isValid),
+  value,
+});
+
+export const validateInputFieldNotEmpty = (value: React.ReactText) =>
   value === ''
     ? [
         <FormattedMessage

x-pack/plugins/infra/public/components/source_configuration/input_fields.tsx

@@ -0,0 +1,85 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { EuiTitle } from '@elastic/eui';
+import { EuiSpacer } from '@elastic/eui';
+import { EuiFormRow } from '@elastic/eui';
+import { EuiRange } from '@elastic/eui';
+import { EuiDescribedFormGroup } from '@elastic/eui';
+import { EuiForm } from '@elastic/eui';
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+import { InputRangeFieldProps } from './input_fields';
+
+interface MLConfigurationPanelProps {
+  isLoading: boolean;
+  readOnly: boolean;
+  anomalyThresholdFieldProps: InputRangeFieldProps;
+}
+
+export const MLConfigurationPanel = ({
+  isLoading,
+  readOnly,
+  anomalyThresholdFieldProps,
+}: MLConfigurationPanelProps) => {
+  return (
+    <EuiForm>
+      <EuiTitle size="s">
+        <h3>
+          <FormattedMessage
+            id="xpack.infra.sourceConfiguration.mlSectionTitle"
+            defaultMessage="Machine Learning"
+          />
+        </h3>
+      </EuiTitle>
+      <EuiSpacer size="m" />
+      <EuiDescribedFormGroup
+        title={
+          <h4>
+            <FormattedMessage
+              id="xpack.infra.sourceConfiguration.anomalyThresholdTitle"
+              defaultMessage="Anomaly Severity Threshold"
+            />
+          </h4>
+        }
+        description={
+          <FormattedMessage
+            id="xpack.infra.sourceConfiguration.anomalyThresholdDescription"
+            defaultMessage="Sets the minimum severity score required to show anomalies in the Metrics application."
+          />
+        }
+      >
+        <EuiFormRow
+          error={anomalyThresholdFieldProps.error}
+          fullWidth
+          isInvalid={anomalyThresholdFieldProps.isInvalid}
+          label={
+            <FormattedMessage
+              id="xpack.infra.sourceConfiguration.anomalyThresholdLabel"
+              defaultMessage="Minimum severity score"
+            />
+          }
+        >
+          <EuiRange
+            min={0}
+            max={100}
+            data-test-subj="anomalyThresholdInput"
+            showInput
+            showTicks
+            showRange
+            tickInterval={20}
+            aria-label="Minimum severity score"
+            disabled={isLoading}
+            readOnly={readOnly}
+            isLoading={isLoading}
+            {...anomalyThresholdFieldProps}
+          />
+        </EuiFormRow>
+      </EuiDescribedFormGroup>
+    </EuiForm>
+  );
+};

x-pack/plugins/infra/public/components/source_configuration/ml_configuration_panel.tsx

@@ -27,6 +27,7 @@ export const useSourceConfigurationFormState = (configuration?: InfraSourceConfi
               podField: configuration.fields.pod,
               tiebreakerField: configuration.fields.tiebreaker,
               timestampField: configuration.fields.timestamp,
+              anomalyThreshold: configuration.anomalyThreshold,
             }
           : undefined,
       [configuration]
@@ -79,6 +80,7 @@ export const useSourceConfigurationFormState = (configuration?: InfraSourceConfi
         timestamp: indicesConfigurationFormState.formState.timestampField,
       },
       logColumns: logColumnsConfigurationFormState.formState.logColumns,
+      anomalyThreshold: indicesConfigurationFormState.formState.anomalyThreshold,
     }),
     [indicesConfigurationFormState.formState, logColumnsConfigurationFormState.formState]
   );
@@ -97,6 +99,7 @@ export const useSourceConfigurationFormState = (configuration?: InfraSourceConfi
         timestamp: indicesConfigurationFormState.formStateChanges.timestampField,
       },
       logColumns: logColumnsConfigurationFormState.formStateChanges.logColumns,
+      anomalyThreshold: indicesConfigurationFormState.formStateChanges.anomalyThreshold,
     }),
     [
       indicesConfigurationFormState.formStateChanges,