mirror of
https://github.com/elastic/kibana.git
synced 2025-04-24 09:48:58 -04:00
[ML] Propagate execution context (#131374)
* report execution context for routes * report execution context for routes * useExecutionContext for embeddable swim lane * useExecutionContext for embeddable anomaly charts * fix activeRoute * refactor
This commit is contained in:
parent
43c4134e8d
commit
d145b9ddd7
5 changed files with 85 additions and 2 deletions
|
@ -4,6 +4,7 @@
|
|||
* 2.0; you may not use this file except in compliance with the Elastic License
|
||||
* 2.0.
|
||||
*/
|
||||
|
||||
import React, { FC } from 'react';
|
||||
import { TrackApplicationView } from '@kbn/usage-collection-plugin/public';
|
||||
|
||||
|
|
|
@ -8,11 +8,21 @@
|
|||
import { useLocation, useRouteMatch } from 'react-router-dom';
|
||||
import { keyBy } from 'lodash';
|
||||
import { useMemo } from 'react';
|
||||
import { useExecutionContext } from '@kbn/kibana-react-plugin/public';
|
||||
import { useMlKibana } from '../contexts/kibana';
|
||||
import type { MlRoute } from './router';
|
||||
|
||||
/**
|
||||
* Provides an active route of the ML app.
|
||||
* @param routesList
|
||||
*/
|
||||
export const useActiveRoute = (routesList: MlRoute[]): MlRoute => {
|
||||
const { pathname } = useLocation();
|
||||
|
||||
const {
|
||||
services: { executionContext },
|
||||
} = useMlKibana();
|
||||
|
||||
/**
|
||||
* Temp fix for routes with params.
|
||||
*/
|
||||
|
@ -30,8 +40,14 @@ export const useActiveRoute = (routesList: MlRoute[]): MlRoute => {
|
|||
}
|
||||
// Remove trailing slash from the pathname
|
||||
const pathnameKey = pathname.replace(/\/$/, '');
|
||||
return routesMap[pathnameKey];
|
||||
return routesMap[pathnameKey] ?? routesMap['/overview'];
|
||||
}, [pathname]);
|
||||
|
||||
return activeRoute ?? routesMap['/overview'];
|
||||
useExecutionContext(executionContext, {
|
||||
name: 'Machine Learning',
|
||||
type: 'application',
|
||||
page: activeRoute?.path,
|
||||
});
|
||||
|
||||
return activeRoute;
|
||||
};
|
||||
|
|
|
@ -11,6 +11,7 @@ import { Observable } from 'rxjs';
|
|||
import { FormattedMessage } from '@kbn/i18n-react';
|
||||
import { throttle } from 'lodash';
|
||||
import { UI_SETTINGS } from '@kbn/data-plugin/common';
|
||||
import { useEmbeddableExecutionContext } from '../common/use_embeddable_execution_context';
|
||||
import { useAnomalyChartsInputResolver } from './use_anomaly_charts_input_resolver';
|
||||
import type { IAnomalyChartsEmbeddable } from './anomaly_charts_embeddable';
|
||||
import type {
|
||||
|
@ -27,6 +28,7 @@ import { ANOMALY_THRESHOLD } from '../../../common';
|
|||
import { TimeBuckets } from '../../application/util/time_buckets';
|
||||
import { EXPLORER_ENTITY_FIELD_SELECTION_TRIGGER } from '../../ui_actions/triggers';
|
||||
import { MlLocatorParams } from '../../../common/types/locator';
|
||||
import { ANOMALY_EXPLORER_CHARTS_EMBEDDABLE_TYPE } from '..';
|
||||
|
||||
const RESIZE_THROTTLE_TIME_MS = 500;
|
||||
|
||||
|
@ -55,6 +57,13 @@ export const EmbeddableAnomalyChartsContainer: FC<EmbeddableAnomalyChartsContain
|
|||
onError,
|
||||
onLoading,
|
||||
}) => {
|
||||
useEmbeddableExecutionContext<AnomalyChartsEmbeddableInput>(
|
||||
services[0].executionContext,
|
||||
embeddableInput,
|
||||
ANOMALY_EXPLORER_CHARTS_EMBEDDABLE_TYPE,
|
||||
id
|
||||
);
|
||||
|
||||
const [chartWidth, setChartWidth] = useState<number>(0);
|
||||
const [severity, setSeverity] = useState(
|
||||
optionValueToThreshold(
|
||||
|
|
|
@ -11,6 +11,7 @@ import { Observable } from 'rxjs';
|
|||
|
||||
import { CoreStart } from '@kbn/core/public';
|
||||
import { FormattedMessage } from '@kbn/i18n-react';
|
||||
import { useEmbeddableExecutionContext } from '../common/use_embeddable_execution_context';
|
||||
import { IAnomalySwimlaneEmbeddable } from './anomaly_swimlane_embeddable';
|
||||
import { useSwimlaneInputResolver } from './swimlane_input_resolver';
|
||||
import { SwimlaneType } from '../../application/explorer/explorer_constants';
|
||||
|
@ -22,6 +23,7 @@ import { AppStateSelectedCells } from '../../application/explorer/explorer_utils
|
|||
import { MlDependencies } from '../../application/app';
|
||||
import { SWIM_LANE_SELECTION_TRIGGER } from '../../ui_actions';
|
||||
import {
|
||||
ANOMALY_SWIMLANE_EMBEDDABLE_TYPE,
|
||||
AnomalySwimlaneEmbeddableInput,
|
||||
AnomalySwimlaneEmbeddableOutput,
|
||||
AnomalySwimlaneServices,
|
||||
|
@ -52,6 +54,13 @@ export const EmbeddableSwimLaneContainer: FC<ExplorerSwimlaneContainerProps> = (
|
|||
onLoading,
|
||||
onError,
|
||||
}) => {
|
||||
useEmbeddableExecutionContext<AnomalySwimlaneEmbeddableInput>(
|
||||
services[0].executionContext,
|
||||
embeddableInput,
|
||||
ANOMALY_SWIMLANE_EMBEDDABLE_TYPE,
|
||||
id
|
||||
);
|
||||
|
||||
const [chartWidth, setChartWidth] = useState<number>(0);
|
||||
|
||||
const [fromPage, setFromPage] = useState<number>(1);
|
||||
|
|
|
@ -0,0 +1,48 @@
|
|||
/*
|
||||
* 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 useObservable from 'react-use/lib/useObservable';
|
||||
import { map } from 'rxjs/operators';
|
||||
import { KibanaExecutionContext } from '@kbn/core/types';
|
||||
import { useMemo } from 'react';
|
||||
import { useExecutionContext } from '@kbn/kibana-react-plugin/public';
|
||||
import type { Observable } from 'rxjs';
|
||||
import type { EmbeddableInput } from '@kbn/embeddable-plugin/common';
|
||||
import { ExecutionContextStart } from '@kbn/core/public';
|
||||
|
||||
/**
|
||||
* Use execution context for ML embeddables.
|
||||
* @param executionContext
|
||||
* @param embeddableInput$
|
||||
* @param embeddableType
|
||||
* @param id
|
||||
*/
|
||||
export function useEmbeddableExecutionContext<T extends EmbeddableInput>(
|
||||
executionContext: ExecutionContextStart,
|
||||
embeddableInput$: Observable<T>,
|
||||
embeddableType: string,
|
||||
id: string
|
||||
) {
|
||||
const parentExecutionContext = useObservable(
|
||||
embeddableInput$.pipe(map((v) => v.executionContext))
|
||||
);
|
||||
|
||||
const embeddableExecutionContext: KibanaExecutionContext = useMemo(() => {
|
||||
const child: KibanaExecutionContext = {
|
||||
type: 'visualization',
|
||||
name: embeddableType,
|
||||
id,
|
||||
};
|
||||
|
||||
return {
|
||||
...parentExecutionContext,
|
||||
child,
|
||||
};
|
||||
}, [parentExecutionContext, id]);
|
||||
|
||||
useExecutionContext(executionContext, embeddableExecutionContext);
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue