Add ability to fetch anomalies to timeline

elastic · Sep 27, 2020 · 9786073 · 9786073
1 parent fea0f83
commit 9786073
Show file tree

Hide file tree

Showing 8 changed files with 95 additions and 25 deletions.
diff --git a/x-pack/plugins/infra/common/http_api/infra_ml/results/common.ts b/x-pack/plugins/infra/common/http_api/infra_ml/results/common.ts
@@ -57,3 +57,11 @@ export const sortRT = rt.type({
 });
 
 export type Sort = rt.TypeOf<typeof sortRT>;
+
+export const metricRT = rt.keyof({
+  memory_usage: null,
+  network_in: null,
+  network_out: null,
+});
+
+export type Metric = rt.TypeOf<typeof metricRT>;
diff --git a/x-pack/plugins/infra/common/http_api/infra_ml/results/metrics_hosts_anomalies.ts b/x-pack/plugins/infra/common/http_api/infra_ml/results/metrics_hosts_anomalies.ts
@@ -7,7 +7,7 @@
 import * as rt from 'io-ts';
 
 import { timeRangeRT, routeTimingMetadataRT } from '../../shared';
-import { anomalyTypeRT, paginationCursorRT, sortRT, paginationRT } from './common';
+import { anomalyTypeRT, paginationCursorRT, sortRT, paginationRT, metricRT } from './common';
 
 export const INFA_ML_GET_METRICS_HOSTS_ANOMALIES_PATH =
   '/api/infra/infra_ml/results/metrics_hosts_anomalies';
@@ -55,12 +55,6 @@ export type GetMetricsHostsAnomaliesSuccessResponsePayload = rt.TypeOf<
   typeof getMetricsHostsAnomaliesSuccessReponsePayloadRT
 >;
 
-const metricRT = rt.keyof({
-  memory_usage: null,
-  network_in: null,
-  network_out: null,
-});
-
 export const getMetricsHostsAnomaliesRequestPayloadRT = rt.type({
   data: rt.intersection([
     rt.type({

diff --git a/x-pack/plugins/infra/common/http_api/infra_ml/results/metrics_k8s_anomalies.ts b/x-pack/plugins/infra/common/http_api/infra_ml/results/metrics_k8s_anomalies.ts
@@ -7,7 +7,7 @@
 import * as rt from 'io-ts';
 
 import { timeRangeRT, routeTimingMetadataRT } from '../../shared';
-import { paginationCursorRT, anomalyTypeRT, sortRT, paginationRT } from './common';
+import { paginationCursorRT, anomalyTypeRT, sortRT, paginationRT, metricRT } from './common';
 
 export const INFA_ML_GET_METRICS_K8S_ANOMALIES_PATH =
   '/api/infra/infra_ml/results/metrics_k8s_anomalies';
@@ -55,12 +55,6 @@ export type GetMetricsK8sAnomaliesSuccessResponsePayload = rt.TypeOf<
   typeof getMetricsK8sAnomaliesSuccessReponsePayloadRT
 >;
 
-const metricRT = rt.keyof({
-  memory_usage: null,
-  network_in: null,
-  network_out: null,
-});
-
 export const getMetricsK8sAnomaliesRequestPayloadRT = rt.type({
   data: rt.intersection([
     rt.type({

diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/timeline/timeline.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/timeline/timeline.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { useMemo, useCallback } from 'react';
+import React, { useMemo, useCallback, useState, useEffect } from 'react';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 import moment from 'moment';
@@ -35,6 +35,8 @@ import { calculateDomain } from '../../../metrics_explorer/components/helpers/ca
 
 import { euiStyled } from '../../../../../../../observability/public';
 import { InfraFormatter } from '../../../../../lib/lib';
+import { useMetricsHostsAnomaliesResults } from '../../hooks/use_metrics_hosts_anomalies';
+import { useMetricsK8sAnomaliesResults } from '../../hooks/use_metrics_k8s_anomalies';
 
 interface Props {
   interval: string;
@@ -47,6 +49,17 @@ export const Timeline: React.FC<Props> = ({ interval, yAxisFormatter, isVisible
   const { metric, nodeType, accountId, region } = useWaffleOptionsContext();
   const { currentTime, jumpToTime, stopAutoReload } = useWaffleTimeContext();
   const { filterQueryAsJson } = useWaffleFiltersContext();
+  const [start] = useState(moment().toDate().getTime());
+
+  const SORT_DEFAULTS = {
+    direction: 'desc' as const,
+    field: 'anomalyScore' as const,
+  };
+
+  const PAGINATION_DEFAULTS = {
+    pageSize: 100,
+  };
+
   const { loading, error, timeseries, reload } = useTimeline(
     filterQueryAsJson,
     [metric],
@@ -59,6 +72,38 @@ export const Timeline: React.FC<Props> = ({ interval, yAxisFormatter, isVisible
     isVisible
   );
 
+  const { metricsHostsAnomalies, getMetricsHostsAnomalies } = useMetricsHostsAnomaliesResults({
+    sourceId: 'default',
+    startTime: moment(new Date(start)).subtract(10, 'd').toDate().getTime(),
+    endTime: start,
+    defaultSortOptions: SORT_DEFAULTS,
+    defaultPaginationOptions: PAGINATION_DEFAULTS,
+  });
+
+  const { metricsK8sAnomalies, getMetricsK8sAnomalies } = useMetricsK8sAnomaliesResults({
+    sourceId: 'default',
+    startTime: moment(new Date(start)).subtract(10, 'd').toDate().getTime(),
+    endTime: start,
+    defaultSortOptions: SORT_DEFAULTS,
+    defaultPaginationOptions: PAGINATION_DEFAULTS,
+  });
+
+  const getAnomalies = useMemo(() => {
+    if (nodeType === 'host') {
+      return getMetricsHostsAnomalies;
+    } else if (nodeType === 'pod') {
+      return getMetricsK8sAnomalies;
+    }
+  }, [nodeType, getMetricsK8sAnomalies, getMetricsHostsAnomalies]);
+
+  // const anomalies = useMemo(() => {
+  //   if (nodeType === 'host') {
+  //     return metricsHostsAnomalies;
+  //   } else if (nodeType === 'pod') {
+  //     return metricsK8sAnomalies;
+  //   }
+  // }, [nodeType, metricsHostsAnomalies, metricsK8sAnomalies]);
+
   const metricLabel = toMetricOpt(metric.type)?.textLC;
 
   const chartMetric = {
@@ -104,6 +149,25 @@ export const Timeline: React.FC<Props> = ({ interval, yAxisFormatter, isVisible
     [jumpToTime, stopAutoReload]
   );
 
+  const anomalyMetricName = useMemo(() => {
+    const metricType = metric.type;
+    if (metricType === 'memory') {
+      return 'memory_usage';
+    }
+    if (metricType === 'rx') {
+      return 'network_in';
+    }
+    if (metricType === 'tx') {
+      return 'network_out';
+    }
+  }, [metric]);
+
+  useEffect(() => {
+    if (getAnomalies && anomalyMetricName) {
+      getAnomalies(anomalyMetricName);
+    }
+  }, [getAnomalies, anomalyMetricName]);
+
   if (loading) {
     return (
       <TimelineContainer>
@@ -196,7 +260,7 @@ const TimelineHeader = euiStyled.div`
 `;
 
 const TimelineChartContainer = euiStyled.div`
-  padding-left: ${(props) => props.theme.eui.paddingSizes.xs}; 
+  padding-left: ${(props) => props.theme.eui.paddingSizes.xs};
   width: 100%;
   height: 100%;
 `;

diff --git a/...ck/plugins/infra/public/pages/metrics/inventory_view/hooks/use_metrics_hosts_anomalies.ts b/...ck/plugins/infra/public/pages/metrics/inventory_view/hooks/use_metrics_hosts_anomalies.ts
@@ -7,6 +7,7 @@
 import { useMemo, useState, useCallback, useEffect, useReducer } from 'react';
 import {
   INFA_ML_GET_METRICS_HOSTS_ANOMALIES_PATH,
+  Metric,
   Sort,
   Pagination,
   PaginationCursor,
@@ -168,7 +169,7 @@ export const useMetricsHostsAnomaliesResults = ({
   const [getMetricsHostsAnomaliesRequest, getMetricsHostsAnomalies] = useTrackedPromise(
     {
       cancelPreviousOn: 'creation',
-      createPromise: async () => {
+      createPromise: async (metric: Metric) => {
         const {
           timeRange: { start: queryStartTime, end: queryEndTime },
           sortOptions,
@@ -179,6 +180,7 @@ export const useMetricsHostsAnomaliesResults = ({
           sourceId,
           queryStartTime,
           queryEndTime,
+          metric,
           sortOptions,
           {
             ...paginationOptions,
@@ -249,9 +251,9 @@ export const useMetricsHostsAnomaliesResults = ({
     });
   }, [filteredDatasets]);
 
-  useEffect(() => {
-    getMetricsHostsAnomalies();
-  }, [getMetricsHostsAnomalies]); // TODO: FIgure out the deps here.
+  // useEffect(() => {
+  //   getMetricsHostsAnomalies();
+  // }, [getMetricsHostsAnomalies]); // TODO: FIgure out the deps here.
 
   const handleFetchNextPage = useCallback(() => {
     if (reducerState.lastReceivedCursors) {
@@ -294,6 +296,7 @@ export const callGetMetricHostsAnomaliesAPI = async (
   sourceId: string,
   startTime: number,
   endTime: number,
+  metric: Metric,
   sort: Sort,
   pagination: Pagination
 ) => {
@@ -307,6 +310,7 @@ export const callGetMetricHostsAnomaliesAPI = async (
             startTime,
             endTime,
           },
+          metric,
           sort,
           pagination,
         },

diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/hooks/use_metrics_k8s_anomalies.ts b/x-pack/plugins/infra/public/pages/metrics/inventory_view/hooks/use_metrics_k8s_anomalies.ts
@@ -13,6 +13,7 @@ import {
   getMetricsK8sAnomaliesSuccessReponsePayloadRT,
   getMetricsK8sAnomaliesRequestPayloadRT,
   MetricsK8sAnomaly,
+  Metric,
 } from '../../../../../common/http_api/infra_ml';
 import { useTrackedPromise } from '../../../../utils/use_tracked_promise';
 import { npStart } from '../../../../legacy_singletons';
@@ -168,7 +169,7 @@ export const useMetricsK8sAnomaliesResults = ({
   const [getMetricsK8sAnomaliesRequest, getMetricsK8sAnomalies] = useTrackedPromise(
     {
       cancelPreviousOn: 'creation',
-      createPromise: async () => {
+      createPromise: async (metric: Metric) => {
         const {
           timeRange: { start: queryStartTime, end: queryEndTime },
           sortOptions,
@@ -180,6 +181,7 @@ export const useMetricsK8sAnomaliesResults = ({
           sourceId,
           queryStartTime,
           queryEndTime,
+          metric,
           sortOptions,
           {
             ...paginationOptions,
@@ -251,9 +253,9 @@ export const useMetricsK8sAnomaliesResults = ({
     });
   }, [filteredDatasets]);
 
-  useEffect(() => {
-    getMetricsK8sAnomalies();
-  }, [getMetricsK8sAnomalies]);
+  // useEffect(() => {
+  //   getMetricsK8sAnomalies();
+  // }, [getMetricsK8sAnomalies]);
 
   const handleFetchNextPage = useCallback(() => {
     if (reducerState.lastReceivedCursors) {
@@ -296,6 +298,7 @@ export const callGetMetricsK8sAnomaliesAPI = async (
   sourceId: string,
   startTime: number,
   endTime: number,
+  metric: Metric,
   sort: Sort,
   pagination: Pagination,
   datasets?: string[]
@@ -310,6 +313,7 @@ export const callGetMetricsK8sAnomaliesAPI = async (
             startTime,
             endTime,
           },
+          metric,
           sort,
           pagination,
           datasets,

diff --git a/x-pack/plugins/infra/server/lib/infra_ml/metrics_hosts_anomalies.ts b/x-pack/plugins/infra/server/lib/infra_ml/metrics_hosts_anomalies.ts
@@ -39,7 +39,7 @@ async function getCompatibleAnomaliesJobIds(
   let metricsHostsJobIds = metricsHostsJobTypes;
 
   if (metric) {
-    metricsHostsJobIds = metricsHostsJobIds.filter((jt) => jt === `k8s_${metric}`);
+    metricsHostsJobIds = metricsHostsJobIds.filter((jt) => jt === `hosts_${metric}`);
   }
 
   const jobIds: string[] = [];

diff --git a/x-pack/plugins/infra/server/routes/infra_ml/results/metrics_k8s_anomalies.ts b/x-pack/plugins/infra/server/routes/infra_ml/results/metrics_k8s_anomalies.ts
@@ -35,6 +35,7 @@ export const initGetK8sAnomaliesRoute = ({ framework }: InfraBackendLibs) => {
           timeRange: { startTime, endTime },
           sort: sortParam,
           pagination: paginationParam,
+          metric,
         },
       } = request.body;
 
@@ -53,6 +54,7 @@ export const initGetK8sAnomaliesRoute = ({ framework }: InfraBackendLibs) => {
           sourceId,
           startTime,
           endTime,
+          metric,
           sort,
           pagination
         );