[Alerting] replace index threshold graph usage of watcher APIs with n…

…ew API (#59385) (#59557)

Changes the alerting UI to use the new time series query HTTP endpoint provided by the builtin index threshold alertType; previously it used a watcher HTTP endpoint.

This is part of the ongoing index threshold work tracked in #53041

x-pack/plugins/alerting/server/lib/parse_duration.ts → x-pack/plugins/alerting/common/parse_duration.ts

@@ -8,6 +8,7 @@ const MINUTES_REGEX = /^[1-9][0-9]*m$/;
 const HOURS_REGEX = /^[1-9][0-9]*h$/;
 const DAYS_REGEX = /^[1-9][0-9]*d$/;
 
+// parse an interval string '{digit*}{s|m|h|d}' into milliseconds
 export function parseDuration(duration: string): number {
   const parsed = parseInt(duration, 10);
   if (isSeconds(duration)) {

x-pack/plugins/alerting/server/lib/index.ts

@@ -4,6 +4,6 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { parseDuration, validateDurationSchema } from './parse_duration';
+export { parseDuration, validateDurationSchema } from '../../common/parse_duration';
 export { LicenseState } from './license_state';
 export { validateAlertTypeParams } from './validate_alert_type_params';

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_alert_types/threshold/lib/time_buckets/index.js → x-pack/plugins/alerting_builtins/common/alert_types/index_threshold/index.ts

@@ -4,4 +4,13 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { TimeBuckets } from './time_buckets';
+export interface TimeSeriesResult {
+  results: TimeSeriesResultRow[];
+}
+
+export interface TimeSeriesResultRow {
+  group: string;
+  metrics: MetricResult[];
+}
+
+export type MetricResult = [string, number]; // [iso date, value]

x-pack/plugins/alerting_builtins/server/alert_types/index_threshold/lib/time_series_types.ts

@@ -18,19 +18,11 @@ import {
   getDateStartAfterDateEndErrorMessage,
 } from './date_range_info';
 
-// The result is an object with a key for every field value aggregated
-// via the `aggField` property.  If `aggField` is not specified, the
-// object will have a single key of `all documents`.  The value associated
-// with each key is an array of 2-tuples of `[ ISO-date, calculated-value ]`
-
-export interface TimeSeriesResult {
-  results: TimeSeriesResultRow[];
-}
-export interface TimeSeriesResultRow {
-  group: string;
-  metrics: MetricResult[];
-}
-export type MetricResult = [string, number]; // [iso date, value]
+export {
+  TimeSeriesResult,
+  TimeSeriesResultRow,
+  MetricResult,
+} from '../../../../common/alert_types/index_threshold';
 
 // The parameters here are very similar to the alert parameters.
 // Missing are `comparator` and `threshold`, which aren't needed to generate

x-pack/plugins/triggers_actions_ui/kibana.json

@@ -3,5 +3,6 @@
     "version": "kibana",
     "server": false,
     "ui": true,
+    "optionalPlugins": ["alerting", "alertingBuiltins"],
     "requiredPlugins": ["management", "charts", "data"]
   }

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_alert_types/threshold/expression.tsx

@@ -62,6 +62,7 @@ const expressionFieldsWithValidation = [
 
 interface IndexThresholdProps {
   alertParams: IndexThresholdAlertParams;
+  alertInterval: string;
   setAlertParams: (property: string, value: any) => void;
   setAlertProperty: (key: string, value: any) => void;
   errors: { [key: string]: string[] };
@@ -70,6 +71,7 @@ interface IndexThresholdProps {
 
 export const IndexThresholdAlertTypeExpression: React.FunctionComponent<IndexThresholdProps> = ({
   alertParams,
+  alertInterval,
   setAlertParams,
   setAlertProperty,
   errors,
@@ -454,6 +456,7 @@ export const IndexThresholdAlertTypeExpression: React.FunctionComponent<IndexThr
         <Fragment>
           <ThresholdVisualization
             alertParams={alertParams}
+            alertInterval={alertInterval}
             aggregationTypes={builtInAggregationTypes}
             comparators={builtInComparators}
             alertsContext={alertsContext}

x-pack/plugins/triggers_actions_ui/public/application/components/builtin_alert_types/threshold/lib/api.ts

@@ -4,6 +4,8 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 import { HttpSetup } from 'kibana/public';
+import { TimeSeriesResult } from '../types';
+export { TimeSeriesResult } from '../types';
 
 const WATCHER_API_ROOT = '/api/watcher';
 
@@ -60,20 +62,35 @@ export const loadIndexPatterns = async () => {
   return savedObjects;
 };
 
+const TimeSeriesQueryRoute = '/api/alerting_builtins/index_threshold/_time_series_query';
+
+interface GetThresholdAlertVisualizationDataParams {
+  model: any;
+  visualizeOptions: any;
+  http: HttpSetup;
+}
+
 export async function getThresholdAlertVisualizationData({
   model,
   visualizeOptions,
   http,
-}: {
-  model: any;
-  visualizeOptions: any;
-  http: HttpSetup;
-}): Promise<Record<string, any>> {
-  const { visualizeData } = await http.post(`${WATCHER_API_ROOT}/watch/visualize`, {
-    body: JSON.stringify({
-      watch: model,
-      options: visualizeOptions,
-    }),
+}: GetThresholdAlertVisualizationDataParams): Promise<TimeSeriesResult> {
+  const timeSeriesQueryParams = {
+    index: model.index,
+    timeField: model.timeField,
+    aggType: model.aggType,
+    aggField: model.aggField,
+    groupBy: model.groupBy,
+    termField: model.termField,
+    termSize: model.termSize,
+    timeWindowSize: model.timeWindowSize,
+    timeWindowUnit: model.timeWindowUnit,
+    dateStart: new Date(visualizeOptions.rangeFrom).toISOString(),
+    dateEnd: new Date(visualizeOptions.rangeTo).toISOString(),
+    interval: visualizeOptions.interval,
+  };
+
+  return await http.post<TimeSeriesResult>(TimeSeriesQueryRoute, {
+    body: JSON.stringify(timeSeriesQueryParams),
   });
-  return visualizeData;
 }