From cca59baa443d160b4862d81ac2a202d9c72b2baa Mon Sep 17 00:00:00 2001 From: Quynh Nguyen <43350163+qn895@users.noreply.github.com> Date: Wed, 23 Dec 2020 16:03:04 -0600 Subject: [PATCH] [ML][7.10] Fix zoom missing in Anomaly detection URLs (#86400) --- .../ml/common/types/ml_url_generator.ts | 19 +++++++++---------- .../explorer_charts_container.js | 16 +++++++++------- .../anomaly_detection_urls_generator.ts | 5 ++++- .../ml_url_generator/ml_url_generator.test.ts | 2 +- 4 files changed, 23 insertions(+), 19 deletions(-) diff --git a/x-pack/plugins/ml/common/types/ml_url_generator.ts b/x-pack/plugins/ml/common/types/ml_url_generator.ts index 81deb11dc7671a..1277711e16b410 100644 --- a/x-pack/plugins/ml/common/types/ml_url_generator.ts +++ b/x-pack/plugins/ml/common/types/ml_url_generator.ts @@ -123,27 +123,26 @@ export interface TimeSeriesExplorerGlobalState { refreshInterval?: RefreshInterval; } -export interface TimeSeriesExplorerAppState { +export interface TimeSeriesExplorerParams { + forecastId?: string; + detectorIndex?: number; + entities?: Record; zoom?: { from?: string; to?: string; }; - mlTimeSeriesExplorer?: { - forecastId?: string; - detectorIndex?: number; - entities?: Record; - }; +} +export interface TimeSeriesExplorerAppState { + mlTimeSeriesExplorer?: TimeSeriesExplorerParams; query?: any; } export interface TimeSeriesExplorerPageState - extends Pick, + extends TimeSeriesExplorerParams, + Pick, Pick { jobIds?: JobId[]; timeRange?: TimeRange; - detectorIndex?: number; - entities?: Record; - forecastId?: string; globalState?: MlCommonGlobalState; } diff --git a/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.js b/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.js index ee9869a202f583..af00150437a623 100644 --- a/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.js +++ b/x-pack/plugins/ml/public/application/explorer/explorer_charts/explorer_charts_container.js @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { useCallback } from 'react'; +import React, { useCallback, useMemo } from 'react'; import { EuiButtonEmpty, @@ -56,10 +56,15 @@ function getChartId(series) { function ExplorerChartContainer({ series, severity, tooManyBuckets, wrapLabel, mlUrlGenerator }) { const redirectToSingleMetricViewer = useCallback(async () => { const singleMetricViewerLink = await getExploreSeriesLink(mlUrlGenerator, series); - addItemToRecentlyAccessed('timeseriesexplorer', series.jobId, singleMetricViewerLink); + // need to get the relative link for addItemToRecentlyAccessed + // whereas for user to navigate to link it needs the full path + const relativeLinkParts = singleMetricViewerLink.split('app/ml'); + if (Array.isArray(relativeLinkParts) && relativeLinkParts.length === 2) { + addItemToRecentlyAccessed('timeseriesexplorer', series.jobId, relativeLinkParts[1]); + } window.open(singleMetricViewerLink, '_blank'); - }, [mlUrlGenerator]); + }, [mlUrlGenerator, series]); const { detectorLabel, entityFields } = series; @@ -168,14 +173,12 @@ export const ExplorerChartsContainerUI = ({ }) => { const { services: { - application: { navigateToApp }, - share: { urlGenerators: { getUrlGenerator }, }, }, } = kibana; - const mlUrlGenerator = getUrlGenerator(ML_APP_URL_GENERATOR); + const mlUrlGenerator = useMemo(() => getUrlGenerator(ML_APP_URL_GENERATOR), [getUrlGenerator]); // doesn't allow a setting of `columns={1}` when chartsPerRow would be 1. // If that's the case we trick it doing that with the following settings: @@ -198,7 +201,6 @@ export const ExplorerChartsContainerUI = ({ severity={severity} tooManyBuckets={tooManyBuckets} wrapLabel={wrapLabel} - navigateToApp={navigateToApp} mlUrlGenerator={mlUrlGenerator} /> diff --git a/x-pack/plugins/ml/public/ml_url_generator/anomaly_detection_urls_generator.ts b/x-pack/plugins/ml/public/ml_url_generator/anomaly_detection_urls_generator.ts index 9a900c456d5164..cec9c8326f66fc 100644 --- a/x-pack/plugins/ml/public/ml_url_generator/anomaly_detection_urls_generator.ts +++ b/x-pack/plugins/ml/public/ml_url_generator/anomaly_detection_urls_generator.ts @@ -178,9 +178,12 @@ export function createSingleMetricViewerUrl( if (entities !== undefined) { mlTimeSeriesExplorer.entities = entities; } + if (zoom !== undefined) { + mlTimeSeriesExplorer.zoom = zoom; + } + appState.mlTimeSeriesExplorer = mlTimeSeriesExplorer; - if (zoom) appState.zoom = zoom; if (query) appState.query = { query_string: query, diff --git a/x-pack/plugins/ml/public/ml_url_generator/ml_url_generator.test.ts b/x-pack/plugins/ml/public/ml_url_generator/ml_url_generator.test.ts index 754f5bec57a07b..f148c1cbf06a7c 100644 --- a/x-pack/plugins/ml/public/ml_url_generator/ml_url_generator.test.ts +++ b/x-pack/plugins/ml/public/ml_url_generator/ml_url_generator.test.ts @@ -159,7 +159,7 @@ describe('MlUrlGenerator', () => { }, }); expect(url).toBe( - "/app/ml/timeseriesexplorer?_g=(ml:(jobIds:!(logs_categorization_1)),refreshInterval:(pause:!f,value:0),time:(from:'2020-07-12T00:39:02.912Z',mode:absolute,to:'2020-07-22T15:52:18.613Z'))&_a=(mlTimeSeriesExplorer:(detectorIndex:0,entities:(mlcategory:'2')),query:(query_string:(analyze_wildcard:!t,query:'*')),zoom:(from:'2020-07-20T23:58:29.367Z',to:'2020-07-21T11:00:13.173Z'))" + "/app/ml/timeseriesexplorer?_g=(ml:(jobIds:!(logs_categorization_1)),refreshInterval:(pause:!f,value:0),time:(from:'2020-07-12T00:39:02.912Z',mode:absolute,to:'2020-07-22T15:52:18.613Z'))&_a=(mlTimeSeriesExplorer:(detectorIndex:0,entities:(mlcategory:'2'),zoom:(from:'2020-07-20T23:58:29.367Z',to:'2020-07-21T11:00:13.173Z')),query:(query_string:(analyze_wildcard:!t,query:'*')))" ); }); });