From 372530f44ae188a1042904456c3cebae9115ed2a Mon Sep 17 00:00:00 2001 From: Walter Rafelsberger Date: Tue, 12 Jul 2022 16:27:17 +0200 Subject: [PATCH 1/5] [ML] Restructure components. --- .../explain_log_rate_spikes.tsx | 131 +++--------------- .../explain_log_rate_spikes_wrapper.tsx | 104 +++++++++++++- 2 files changed, 120 insertions(+), 115 deletions(-) diff --git a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes.tsx b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes.tsx index 468d543ddeefd..2a2590de79879 100644 --- a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes.tsx +++ b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes.tsx @@ -7,18 +7,6 @@ import React, { useEffect, FC } from 'react'; -import { - EuiFlexGroup, - EuiFlexItem, - EuiHorizontalRule, - EuiPageBody, - EuiPageContentBody, - EuiPageContentHeader, - EuiPageContentHeaderSection, - EuiSpacer, - EuiTitle, -} from '@elastic/eui'; - import type { DataView } from '@kbn/data-views-plugin/public'; import { ProgressControls } from '@kbn/aiops-components'; import { useFetchStream } from '@kbn/aiops-utils'; @@ -28,11 +16,6 @@ import { useAiOpsKibana } from '../../kibana_context'; import { initialState, streamReducer } from '../../../common/api/stream_reducer'; import type { ApiExplainLogRateSpikes } from '../../../common/api'; import { SpikeAnalysisTable } from '../spike_analysis_table'; -import { FullTimeRangeSelector } from '../full_time_range_selector'; -import { DocumentCountContent } from '../document_count_content/document_count_content'; -import { DatePickerWrapper } from '../date_picker_wrapper'; -import { useData } from '../../hooks/use_data'; -import { useUrlState } from '../../hooks/url_state'; /** * ExplainLogRateSpikes props require a data view. @@ -40,32 +23,31 @@ import { useUrlState } from '../../hooks/url_state'; export interface ExplainLogRateSpikesProps { /** The data view to analyze. */ dataView: DataView; + /** Start timestamp filter */ + earliest: number; + /** End timestamp filter */ + latest: number; /** Window parameters for the analysis */ windowParameters: WindowParameters; } export const ExplainLogRateSpikes: FC = ({ dataView, + earliest, + latest, windowParameters, }) => { const { services } = useAiOpsKibana(); const basePath = services.http?.basePath.get() ?? ''; - const [globalState, setGlobalState] = useUrlState('_g'); - - const { docStats, timefilter } = useData(dataView, setGlobalState); - const { cancel, start, data, isRunning, error } = useFetchStream< ApiExplainLogRateSpikes, typeof basePath >( `${basePath}/internal/aiops/explain_log_rate_spikes`, { - // TODO Consider actual user selected time ranges. - // Since we already receive window parameters here, - // we just set a maximum time range of 1970-2038 here. - start: 0, - end: 2147483647000, + start: earliest, + end: latest, // TODO Consider an optional Kuery. kuery: '', // TODO Handle data view without time fields. @@ -76,100 +58,23 @@ export const ExplainLogRateSpikes: FC = ({ { reducer: streamReducer, initialState } ); - useEffect(() => { - if (globalState?.time !== undefined) { - timefilter.setTime({ - from: globalState.time.from, - to: globalState.time.to, - }); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [JSON.stringify(globalState?.time), timefilter]); - - useEffect(() => { - if (globalState?.refreshInterval !== undefined) { - timefilter.setRefreshInterval(globalState.refreshInterval); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [JSON.stringify(globalState?.refreshInterval), timefilter]); - useEffect(() => { start(); // eslint-disable-next-line react-hooks/exhaustive-deps }, []); - if (!dataView || !timefilter) return null; - return ( <> - - - - - -
- -

{dataView.title}

- -
- - - - {dataView.timeFieldName !== undefined && ( - - - - )} - - - - - - - - - - - - {docStats?.totalCount !== undefined && ( - - - - )} - - - - {data?.changePoints ? ( - - - - ) : null} - - - + + {data?.changePoints ? ( + + ) : null} ); }; diff --git a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx index 1b72aac836c18..54492f41a4aee 100644 --- a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx +++ b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx @@ -5,11 +5,24 @@ * 2.0. */ -import React, { FC, useCallback } from 'react'; +import React, { FC, useCallback, useEffect } from 'react'; import { parse, stringify } from 'query-string'; import { isEqual } from 'lodash'; import { encode } from 'rison-node'; import { useHistory, useLocation } from 'react-router-dom'; + +import { + EuiFlexGroup, + EuiFlexItem, + EuiHorizontalRule, + EuiPageBody, + EuiPageContentBody, + EuiPageContentHeader, + EuiPageContentHeaderSection, + EuiSpacer, + EuiTitle, +} from '@elastic/eui'; + import { Accessor, Dictionary, @@ -19,10 +32,47 @@ import { getNestedProperty, SetUrlState, } from '../../hooks/url_state'; +import { useData } from '../../hooks/use_data'; +import { useUrlState } from '../../hooks/url_state'; + +import { FullTimeRangeSelector } from '../full_time_range_selector'; +import { DocumentCountContent } from '../document_count_content/document_count_content'; +import { DatePickerWrapper } from '../date_picker_wrapper'; import { ExplainLogRateSpikes, ExplainLogRateSpikesProps } from './explain_log_rate_spikes'; export const ExplainLogRateSpikesWrapper: FC = (props) => { + const { dataView } = props; + + const [globalState, setGlobalState] = useUrlState('_g'); + + const { docStats, timefilter } = useData(dataView, setGlobalState); + + const activeBounds = timefilter.getActiveBounds(); + let earliest: number | undefined; + let latest: number | undefined; + if (activeBounds !== undefined) { + earliest = activeBounds.min?.valueOf(); + latest = activeBounds.max?.valueOf(); + } + + useEffect(() => { + if (globalState?.time !== undefined) { + timefilter.setTime({ + from: globalState.time.from, + to: globalState.time.to, + }); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [JSON.stringify(globalState?.time), timefilter]); + + useEffect(() => { + if (globalState?.refreshInterval !== undefined) { + timefilter.setRefreshInterval(globalState.refreshInterval); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [JSON.stringify(globalState?.refreshInterval), timefilter]); + const history = useHistory(); const { search: urlSearchString } = useLocation(); @@ -88,9 +138,59 @@ export const ExplainLogRateSpikesWrapper: FC = (props [history, urlSearchString] ); + if (!dataView || !timefilter) return null; + return ( - {' '} + + + + + +
+ +

{dataView.title}

+ +
+ + + + {dataView.timeFieldName !== undefined && ( + + + + )} + + + + + + + + + + + {docStats?.totalCount !== undefined && ( + + )} + {earliest !== undefined && latest !== undefined && ( + + )} + + ); }; From 5fb3c6751690db94141c3579f3f6aba61ba21937 Mon Sep 17 00:00:00 2001 From: Walter Rafelsberger Date: Wed, 13 Jul 2022 09:54:42 +0200 Subject: [PATCH 2/5] [ML] Adds DualBrush. --- .../document_count_chart.tsx | 169 +++++++++++++----- .../document_count_content.tsx | 22 ++- 2 files changed, 142 insertions(+), 49 deletions(-) diff --git a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx index f58730544896b..28a28f4d0b3c8 100644 --- a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx +++ b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx @@ -5,8 +5,9 @@ * 2.0. */ -import React, { FC, useCallback, useMemo } from 'react'; -import { i18n } from '@kbn/i18n'; +import React, { FC, useCallback, useEffect, useMemo, useState } from 'react'; +import moment from 'moment'; + import { Axis, BarSeries, @@ -19,9 +20,14 @@ import { XYChartElementEvent, XYBrushEvent, } from '@elastic/charts'; -import moment from 'moment'; + +import { i18n } from '@kbn/i18n'; import { IUiSettingsClient } from '@kbn/core/public'; +import { DualBrush, DualBrushAnnotation } from '@kbn/aiops-components'; +import { getWindowParameters } from '@kbn/aiops-utils'; +import type { WindowParameters } from '@kbn/aiops-utils'; import { MULTILAYER_TIME_AXIS_STYLE } from '@kbn/charts-plugin/common'; + import { useAiOpsKibana } from '../../../kibana_context'; export interface DocumentCountChartPoint { @@ -29,16 +35,22 @@ export interface DocumentCountChartPoint { value: number; } -interface Props { +interface DocumentCountChartProps { + brushSelectionUpdateHandler: (d: WindowParameters) => void; width?: number; chartPoints: DocumentCountChartPoint[]; timeRangeEarliest: number; timeRangeLatest: number; - interval?: number; + interval: number; } const SPEC_ID = 'document_count'; +enum VIEW_MODE { + ZOOM = 'zoom', + BRUSH = 'brush', +} + function getTimezone(uiSettings: IUiSettingsClient) { if (uiSettings.isDefault('dateFormat:tz')) { const detectedTimezone = moment.tz.guess(); @@ -49,7 +61,8 @@ function getTimezone(uiSettings: IUiSettingsClient) { } } -export const DocumentCountChart: FC = ({ +export const DocumentCountChart: FC = ({ + brushSelectionUpdateHandler, width, chartPoints, timeRangeEarliest, @@ -70,6 +83,8 @@ export const DocumentCountChart: FC = ({ defaultMessage: 'document count', }); + const viewMode = VIEW_MODE.BRUSH; + const xDomain = { min: timeRangeEarliest, max: timeRangeLatest, @@ -117,46 +132,116 @@ export const DocumentCountChart: FC = ({ from: startRange, to: startRange + interval, }; - timefilterUpdateHandler(range); + + if (viewMode === VIEW_MODE.ZOOM) { + timefilterUpdateHandler(range); + } else { + if ( + typeof startRange === 'number' && + originalWindowParameters === undefined && + windowParameters === undefined && + adjustedChartPoints !== undefined + ) { + const wp = getWindowParameters(startRange, xDomain.min, xDomain.max + interval); + setOriginalWindowParameters(wp); + setWindowParameters(wp); + brushSelectionUpdateHandler(wp); + } + } }; const timeZone = getTimezone(uiSettings); + const [originalWindowParameters, setOriginalWindowParameters] = useState< + WindowParameters | undefined + >(); + const [windowParameters, setWindowParameters] = useState(); + + function onWindowParametersChange(wp: WindowParameters) { + setWindowParameters(wp); + brushSelectionUpdateHandler(wp); + } + + const [mlBrushWidth, setMlBrushWidth] = useState(); + const [mlBrushMarginLeft, setMlBrushMarginLeft] = useState(); + + useEffect(() => { + if (viewMode !== VIEW_MODE.BRUSH) { + setOriginalWindowParameters(undefined); + setWindowParameters(undefined); + } + }, [viewMode]); + + const isBrushVisible = + originalWindowParameters && mlBrushMarginLeft && mlBrushWidth && mlBrushWidth > 0; + return ( -
- - - xAxisFormatter.convert(value)} - timeAxisLayerCount={useLegacyTimeAxis ? 0 : 2} - style={useLegacyTimeAxis ? {} : MULTILAYER_TIME_AXIS_STYLE} - /> - - - -
+ <> + {isBrushVisible && ( +
+ +
+ )} +
+ + { + setMlBrushMarginLeft(projection.left); + setMlBrushWidth(projection.width); + }} + theme={chartTheme} + baseTheme={chartBaseTheme} + /> + xAxisFormatter.convert(value)} + timeAxisLayerCount={useLegacyTimeAxis ? 0 : 2} + style={useLegacyTimeAxis ? {} : MULTILAYER_TIME_AXIS_STYLE} + /> + + + {windowParameters && ( + <> + + + + )} + +
+ ); }; diff --git a/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx b/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx index db55d6bd718ec..cf15b9f7919d7 100644 --- a/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx +++ b/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx @@ -4,7 +4,10 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ -import React, { FC } from 'react'; +import React, { useState, FC } from 'react'; + +import { WindowParameters } from '@kbn/aiops-utils'; + import { DocumentCountChart, DocumentCountChartPoint } from '../document_count_chart'; import { TotalCountHeader } from '../total_count_header'; import { DocumentCountStats } from '../../../get_document_stats'; @@ -15,6 +18,8 @@ export interface Props { } export const DocumentCountContent: FC = ({ documentCountStats, totalCount }) => { + const [spikeSelection, setSpikeSelection] = useState(); + if (documentCountStats === undefined) { return totalCount !== undefined ? : null; } @@ -32,12 +37,15 @@ export const DocumentCountContent: FC = ({ documentCountStats, totalCount return ( <> - + {documentCountStats.interval !== undefined && ( + + )} ); }; From db7eb81a9aac514a0c409dbce83cef465eeadc97 Mon Sep 17 00:00:00 2001 From: Walter Rafelsberger Date: Wed, 13 Jul 2022 10:27:12 +0200 Subject: [PATCH 3/5] [Ml] Apply DualBrush selection to analysis. --- .../document_count_chart.tsx | 10 +++-- .../document_count_content.tsx | 15 ++++--- .../explain_log_rate_spikes.tsx | 2 +- .../explain_log_rate_spikes_wrapper.tsx | 27 +++++++++---- .../explain_log_rate_spikes/index.ts | 2 +- .../spike_analysis_table.tsx | 1 + .../aiops/public/shared_lazy_components.tsx | 8 ++-- .../aiops/explain_log_rate_spikes.tsx | 40 +------------------ 8 files changed, 45 insertions(+), 60 deletions(-) diff --git a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx index 28a28f4d0b3c8..76bc6b92dfd5b 100644 --- a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx +++ b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx @@ -142,7 +142,11 @@ export const DocumentCountChart: FC = ({ windowParameters === undefined && adjustedChartPoints !== undefined ) { - const wp = getWindowParameters(startRange, xDomain.min, xDomain.max + interval); + const wp = getWindowParameters( + startRange + interval / 2, + xDomain.min, + xDomain.max + interval + ); setOriginalWindowParameters(wp); setWindowParameters(wp); brushSelectionUpdateHandler(wp); @@ -231,12 +235,12 @@ export const DocumentCountChart: FC = ({ )} diff --git a/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx b/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx index cf15b9f7919d7..0843d1d5f2736 100644 --- a/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx +++ b/x-pack/plugins/aiops/public/components/document_count_content/document_count_content/document_count_content.tsx @@ -4,7 +4,7 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ -import React, { useState, FC } from 'react'; +import React, { FC } from 'react'; import { WindowParameters } from '@kbn/aiops-utils'; @@ -12,14 +12,17 @@ import { DocumentCountChart, DocumentCountChartPoint } from '../document_count_c import { TotalCountHeader } from '../total_count_header'; import { DocumentCountStats } from '../../../get_document_stats'; -export interface Props { +export interface DocumentCountContentProps { + brushSelectionUpdateHandler: (d: WindowParameters) => void; documentCountStats?: DocumentCountStats; totalCount: number; } -export const DocumentCountContent: FC = ({ documentCountStats, totalCount }) => { - const [spikeSelection, setSpikeSelection] = useState(); - +export const DocumentCountContent: FC = ({ + brushSelectionUpdateHandler, + documentCountStats, + totalCount, +}) => { if (documentCountStats === undefined) { return totalCount !== undefined ? : null; } @@ -39,7 +42,7 @@ export const DocumentCountContent: FC = ({ documentCountStats, totalCount {documentCountStats.interval !== undefined && ( = (props) => { - const { dataView } = props; +export interface ExplainLogRateSpikesWrapperProps { + /** The data view to analyze. */ + dataView: DataView; +} +export const ExplainLogRateSpikesWrapper: FC = ({ dataView }) => { const [globalState, setGlobalState] = useUrlState('_g'); const { docStats, timefilter } = useData(dataView, setGlobalState); + const [windowParameters, setWindowParameters] = useState(); const activeBounds = timefilter.getActiveBounds(); let earliest: number | undefined; @@ -177,17 +184,23 @@ export const ExplainLogRateSpikesWrapper: FC = (props - {docStats?.totalCount !== undefined && ( )} - {earliest !== undefined && latest !== undefined && ( - + + {earliest !== undefined && latest !== undefined && windowParameters !== undefined && ( + )} diff --git a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/index.ts b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/index.ts index 4666380c7bd61..4c344313209e4 100644 --- a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/index.ts +++ b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/index.ts @@ -5,7 +5,7 @@ * 2.0. */ -export type { ExplainLogRateSpikesProps } from './explain_log_rate_spikes'; +export type { ExplainLogRateSpikesWrapperProps } from './explain_log_rate_spikes_wrapper'; import { ExplainLogRateSpikesWrapper } from './explain_log_rate_spikes_wrapper'; // required for dynamic import using React.lazy() diff --git a/x-pack/plugins/aiops/public/components/spike_analysis_table/spike_analysis_table.tsx b/x-pack/plugins/aiops/public/components/spike_analysis_table/spike_analysis_table.tsx index 3910bd8cc5a02..9e125f4d47305 100644 --- a/x-pack/plugins/aiops/public/components/spike_analysis_table/spike_analysis_table.tsx +++ b/x-pack/plugins/aiops/public/components/spike_analysis_table/spike_analysis_table.tsx @@ -117,6 +117,7 @@ export const SpikeAnalysisTable: FC = ({ changePointData, error, loading return ( import('./components/explain_log_rate_spikes') @@ -22,10 +22,10 @@ const LazyWrapper: FC = ({ children }) => ( ); /** - * Lazy-wrapped ExplainLogRateSpikes React component - * @param {ExplainLogRateSpikesProps} props - properties specifying the data on which to run the analysis. + * Lazy-wrapped ExplainLogRateSpikesWrapper React component + * @param {ExplainLogRateSpikesWrapperProps} props - properties specifying the data on which to run the analysis. */ -export const ExplainLogRateSpikes: FC = (props) => ( +export const ExplainLogRateSpikes: FC = (props) => ( diff --git a/x-pack/plugins/ml/public/application/aiops/explain_log_rate_spikes.tsx b/x-pack/plugins/ml/public/application/aiops/explain_log_rate_spikes.tsx index 43bc5e77dbb82..cb6e7061fa319 100644 --- a/x-pack/plugins/ml/public/application/aiops/explain_log_rate_spikes.tsx +++ b/x-pack/plugins/ml/public/application/aiops/explain_log_rate_spikes.tsx @@ -5,18 +5,14 @@ * 2.0. */ -import React, { useEffect, useState, FC } from 'react'; +import React, { FC } from 'react'; import { FormattedMessage } from '@kbn/i18n-react'; import { ExplainLogRateSpikes } from '@kbn/aiops-plugin/public'; -import { getWindowParameters } from '@kbn/aiops-utils'; -import type { WindowParameters } from '@kbn/aiops-utils'; -import { KBN_FIELD_TYPES } from '@kbn/data-plugin/public'; import { useMlContext } from '../contexts/ml'; import { useMlKibana } from '../contexts/kibana'; import { HelpMenu } from '../components/help_menu'; -import { ml } from '../services/ml_api_service'; import { MlPageHeader } from '../components/page_header'; @@ -28,36 +24,6 @@ export const ExplainLogRateSpikesPage: FC = () => { const context = useMlContext(); const dataView = context.currentDataView; - const [windowParameters, setWindowParameters] = useState(); - - useEffect(() => { - async function fetchWindowParameters() { - if (dataView.timeFieldName) { - const stats: Array<{ - data: Array<{ doc_count: number; key: number }>; - stats: [number, number]; - }> = await ml.getVisualizerFieldHistograms({ - indexPattern: dataView.title, - fields: [{ fieldName: dataView.timeFieldName, type: KBN_FIELD_TYPES.DATE }], - query: { match_all: {} }, - samplerShardSize: -1, - }); - - const peak = stats[0].data.reduce((p, c) => (c.doc_count >= p.doc_count ? c : p), { - doc_count: 0, - key: 0, - }); - const peakTimestamp = Math.round(peak.key); - - setWindowParameters( - getWindowParameters(peakTimestamp, stats[0].stats[0], stats[0].stats[1]) - ); - } - } - - fetchWindowParameters(); - }, []); - return ( <> @@ -66,9 +32,7 @@ export const ExplainLogRateSpikesPage: FC = () => { defaultMessage="Explain log rate spikes" /> - {dataView.timeFieldName && windowParameters && ( - - )} + {dataView.timeFieldName && } ); From a46193b6082cbc8b898423ede66419d4f564b5e9 Mon Sep 17 00:00:00 2001 From: Walter Rafelsberger Date: Wed, 13 Jul 2022 11:47:19 +0200 Subject: [PATCH 4/5] [ML] Fix types. --- .../document_count_chart/document_count_chart.tsx | 3 ++- x-pack/plugins/aiops/public/index.ts | 1 - 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx index 76bc6b92dfd5b..d5eef7e24376e 100644 --- a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx +++ b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx @@ -83,7 +83,8 @@ export const DocumentCountChart: FC = ({ defaultMessage: 'document count', }); - const viewMode = VIEW_MODE.BRUSH; + // TODO Let user choose between ZOOM and BRUSH mode. + const [viewMode] = useState(VIEW_MODE.BRUSH); const xDomain = { min: timeRangeEarliest, diff --git a/x-pack/plugins/aiops/public/index.ts b/x-pack/plugins/aiops/public/index.ts index 26166e7ca104d..5810d38d57308 100755 --- a/x-pack/plugins/aiops/public/index.ts +++ b/x-pack/plugins/aiops/public/index.ts @@ -13,6 +13,5 @@ export function plugin() { return new AiopsPlugin(); } -export type { ExplainLogRateSpikesProps } from './components/explain_log_rate_spikes'; export { ExplainLogRateSpikes } from './shared_lazy_components'; export type { AiopsPluginSetup, AiopsPluginStart } from './types'; From ea0477668e4d99f8b8fa2ef7ba3ffe4a14bfec6e Mon Sep 17 00:00:00 2001 From: Walter Rafelsberger Date: Wed, 13 Jul 2022 14:19:11 +0200 Subject: [PATCH 5/5] [ML] Makes aiops prefixes all lowercase. --- .../application/services/timefilter_refresh_service.ts | 2 +- .../date_picker_wrapper/date_picker_wrapper.tsx | 4 ++-- .../document_count_chart/document_count_chart.tsx | 4 ++-- .../explain_log_rate_spikes_wrapper.tsx | 8 ++++---- x-pack/plugins/aiops/public/hooks/url_state.ts | 6 +++--- x-pack/plugins/aiops/public/hooks/use_data.ts | 4 ++-- x-pack/plugins/aiops/public/hooks/use_storage.ts | 2 +- 7 files changed, 15 insertions(+), 15 deletions(-) diff --git a/x-pack/plugins/aiops/public/application/services/timefilter_refresh_service.ts b/x-pack/plugins/aiops/public/application/services/timefilter_refresh_service.ts index 20eab7968fefc..05edd75d599bf 100644 --- a/x-pack/plugins/aiops/public/application/services/timefilter_refresh_service.ts +++ b/x-pack/plugins/aiops/public/application/services/timefilter_refresh_service.ts @@ -12,4 +12,4 @@ export interface Refresh { timeRange?: { start: string; end: string }; } -export const aiOpsRefresh$ = new Subject(); +export const aiopsRefresh$ = new Subject(); diff --git a/x-pack/plugins/aiops/public/components/date_picker_wrapper/date_picker_wrapper.tsx b/x-pack/plugins/aiops/public/components/date_picker_wrapper/date_picker_wrapper.tsx index 00e74bc7db618..931993a354d6c 100644 --- a/x-pack/plugins/aiops/public/components/date_picker_wrapper/date_picker_wrapper.tsx +++ b/x-pack/plugins/aiops/public/components/date_picker_wrapper/date_picker_wrapper.tsx @@ -15,7 +15,7 @@ import { TimeHistoryContract, UI_SETTINGS } from '@kbn/data-plugin/public'; import { useUrlState } from '../../hooks/url_state'; import { useAiOpsKibana } from '../../kibana_context'; -import { aiOpsRefresh$ } from '../../application/services/timefilter_refresh_service'; +import { aiopsRefresh$ } from '../../application/services/timefilter_refresh_service'; interface TimePickerQuickRange { from: string; @@ -47,7 +47,7 @@ function getRecentlyUsedRangesFactory(timeHistory: TimeHistoryContract) { } function updateLastRefresh(timeRange: OnRefreshProps) { - aiOpsRefresh$.next({ lastRefresh: Date.now(), timeRange }); + aiopsRefresh$.next({ lastRefresh: Date.now(), timeRange }); } export const DatePickerWrapper: FC = () => { diff --git a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx index d5eef7e24376e..308e91f47506a 100644 --- a/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx +++ b/x-pack/plugins/aiops/public/components/document_count_content/document_count_chart/document_count_chart.tsx @@ -234,12 +234,12 @@ export const DocumentCountChart: FC = ({ {windowParameters && ( <> diff --git a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx index 704c4c6377c13..8c254be451515 100644 --- a/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx +++ b/x-pack/plugins/aiops/public/components/explain_log_rate_spikes/explain_log_rate_spikes_wrapper.tsx @@ -149,12 +149,12 @@ export const ExplainLogRateSpikesWrapper: FC = return ( - + - + -
+

{dataView.title}

 @@ -165,7 +165,7 @@ export const ExplainLogRateSpikesWrapper: FC = alignItems="center" justifyContent="flexEnd" gutterSize="s" - data-test-subj="aiOpsTimeRangeSelectorSection" + data-test-subj="aiopsTimeRangeSelectorSection" > {dataView.timeFieldName !== undefined && ( diff --git a/x-pack/plugins/aiops/public/hooks/url_state.ts b/x-pack/plugins/aiops/public/hooks/url_state.ts index 2afb37d5f6791..97699f3a8f2eb 100644 --- a/x-pack/plugins/aiops/public/hooks/url_state.ts +++ b/x-pack/plugins/aiops/public/hooks/url_state.ts @@ -80,15 +80,15 @@ export function parseUrlState(search: string): Dictionary { // This uses a context to be able to maintain only one instance // of the url state. It gets passed down with `UrlStateProvider` // and can be used via `useUrlState`. -export const aiOpsUrlStateStore = createContext({ +export const aiopsUrlStateStore = createContext({ searchString: '', setUrlState: () => {}, }); -export const { Provider } = aiOpsUrlStateStore; +export const { Provider } = aiopsUrlStateStore; export const useUrlState = (accessor: Accessor) => { - const { searchString, setUrlState: setUrlStateContext } = useContext(aiOpsUrlStateStore); + const { searchString, setUrlState: setUrlStateContext } = useContext(aiopsUrlStateStore); const urlState = useMemo(() => { const fullUrlState = parseUrlState(searchString); diff --git a/x-pack/plugins/aiops/public/hooks/use_data.ts b/x-pack/plugins/aiops/public/hooks/use_data.ts index b3cadd2d44f79..85be019d14e50 100644 --- a/x-pack/plugins/aiops/public/hooks/use_data.ts +++ b/x-pack/plugins/aiops/public/hooks/use_data.ts @@ -11,7 +11,7 @@ import { merge } from 'rxjs'; import { UI_SETTINGS } from '@kbn/data-plugin/common'; import { useAiOpsKibana } from '../kibana_context'; import { useTimefilter } from './use_time_filter'; -import { aiOpsRefresh$ } from '../application/services/timefilter_refresh_service'; +import { aiopsRefresh$ } from '../application/services/timefilter_refresh_service'; import { TimeBuckets } from '../../common/time_buckets'; import { useDocumentCountStats } from './use_document_count_stats'; import { Dictionary } from './url_state'; @@ -80,7 +80,7 @@ export const useData = ( const timeUpdateSubscription = merge( timefilter.getTimeUpdate$(), timefilter.getAutoRefreshFetch$(), - aiOpsRefresh$ + aiopsRefresh$ ).subscribe(() => { if (onUpdate) { onUpdate({ diff --git a/x-pack/plugins/aiops/public/hooks/use_storage.ts b/x-pack/plugins/aiops/public/hooks/use_storage.ts index 7459560d127bf..ef8bf85f2507d 100644 --- a/x-pack/plugins/aiops/public/hooks/use_storage.ts +++ b/x-pack/plugins/aiops/public/hooks/use_storage.ts @@ -8,7 +8,7 @@ import { useCallback, useState } from 'react'; import { useAiOpsKibana } from '../kibana_context'; -export const AIOPS_FROZEN_TIER_PREFERENCE = 'aiOps.frozenDataTierPreference'; +export const AIOPS_FROZEN_TIER_PREFERENCE = 'aiop.frozenDataTierPreference'; export type AiOps = Partial<{ [AIOPS_FROZEN_TIER_PREFERENCE]: 'exclude_frozen' | 'include_frozen';