diff --git a/x-pack/plugins/observability/public/components/app/section/ux/index.tsx b/x-pack/plugins/observability/public/components/app/section/ux/index.tsx index f42db26b1e7d0..bcec087b52ab8 100644 --- a/x-pack/plugins/observability/public/components/app/section/ux/index.tsx +++ b/x-pack/plugins/observability/public/components/app/section/ux/index.tsx @@ -7,13 +7,13 @@ import { i18n } from '@kbn/i18n'; import React from 'react'; +import { useKibana } from '@kbn/kibana-react-plugin/public'; import type { AppDataType } from '../../../shared/exploratory_view/types'; import { SectionContainer } from '..'; import { getDataHandler } from '../../../../data_handler'; import { FETCH_STATUS, useFetcher } from '../../../../hooks/use_fetcher'; import { useHasData } from '../../../../hooks/use_has_data'; import { useDatePickerContext } from '../../../../hooks/use_date_picker_context'; -import { usePluginContext } from '../../../../hooks/use_plugin_context'; import CoreVitals from '../../../shared/core_web_vitals'; import { BucketSize } from '../../../../pages/overview'; import { getExploratoryViewEmbeddable } from '../../../shared/exploratory_view/embeddable'; @@ -22,6 +22,7 @@ import { SERVICE_NAME, TRANSACTION_DURATION, } from '../../../shared/exploratory_view/configurations/constants/elasticsearch_fieldnames'; +import { ObservabilityAppServices } from '../../../../application/types'; interface Props { bucketSize: BucketSize; @@ -29,13 +30,17 @@ interface Props { export function UXSection({ bucketSize }: Props) { const { forceUpdate, hasDataMap } = useHasData(); - const { core, plugins } = usePluginContext(); + const { services } = useKibana(); const { relativeStart, relativeEnd, absoluteStart, absoluteEnd, lastUpdated } = useDatePickerContext(); const uxHasDataResponse = hasDataMap.ux; const serviceName = uxHasDataResponse?.serviceName as string; - const ExploratoryViewEmbeddable = getExploratoryViewEmbeddable(core, plugins); + const ExploratoryViewEmbeddable = getExploratoryViewEmbeddable( + services.uiSettings, + services.dataViews, + services.lens + ); const seriesList: AllSeries = [ { diff --git a/x-pack/plugins/observability/public/components/shared/exploratory_view/embeddable/index.tsx b/x-pack/plugins/observability/public/components/shared/exploratory_view/embeddable/index.tsx index 449dc297bcf6b..f95c30ba26880 100644 --- a/x-pack/plugins/observability/public/components/shared/exploratory_view/embeddable/index.tsx +++ b/x-pack/plugins/observability/public/components/shared/exploratory_view/embeddable/index.tsx @@ -7,11 +7,12 @@ import React, { useCallback, useEffect, useState } from 'react'; import { EuiLoadingSpinner } from '@elastic/eui'; -import { CoreStart } from '@kbn/core/public'; import { EuiThemeProvider } from '@kbn/kibana-react-plugin/common'; +import type { IUiSettingsClient } from '@kbn/core/public'; +import { DataViewsPublicPluginStart } from '@kbn/data-views-plugin/public'; +import { LensPublicStart } from '@kbn/lens-plugin/public'; import type { ExploratoryEmbeddableProps, ExploratoryEmbeddableComponentProps } from './embeddable'; import { ObservabilityDataViews } from '../../../../utils/observability_data_views'; -import { ObservabilityPublicPluginsStart } from '../../../../plugin'; import type { DataViewState } from '../hooks/use_app_data_view'; import type { AppDataType } from '../types'; @@ -26,16 +27,21 @@ function ExploratoryViewEmbeddable(props: ExploratoryEmbeddableComponentProps) { } export function getExploratoryViewEmbeddable( - core: CoreStart, - plugins: ObservabilityPublicPluginsStart + uiSettings?: IUiSettingsClient, + dataViews?: DataViewsPublicPluginStart, + lens?: LensPublicStart ) { return (props: ExploratoryEmbeddableProps) => { + if (!dataViews || !lens) { + return null; + } + const [indexPatterns, setIndexPatterns] = useState({} as DataViewState); const [loading, setLoading] = useState(false); const series = props.attributes && props.attributes[0]; - const isDarkMode = core.uiSettings.get('theme:darkMode'); + const isDarkMode = uiSettings?.get('theme:darkMode'); const loadIndexPattern = useCallback( async ({ dataType }: { dataType: AppDataType }) => { @@ -43,7 +49,7 @@ export function getExploratoryViewEmbeddable( setLoading(true); try { - const obsvIndexP = new ObservabilityDataViews(plugins.dataViews); + const obsvIndexP = new ObservabilityDataViews(dataViews); const indPattern = await obsvIndexP.getDataView( dataType, dataTypesIndexPatterns?.[dataType] @@ -70,7 +76,7 @@ export function getExploratoryViewEmbeddable( return ( - + ); }; diff --git a/x-pack/plugins/observability/public/context/plugin_context.tsx b/x-pack/plugins/observability/public/context/plugin_context.tsx index d77edb7d9de73..37dffe4daa178 100644 --- a/x-pack/plugins/observability/public/context/plugin_context.tsx +++ b/x-pack/plugins/observability/public/context/plugin_context.tsx @@ -5,10 +5,9 @@ * 2.0. */ -import { AppMountParameters, CoreStart } from '@kbn/core/public'; +import { AppMountParameters } from '@kbn/core/public'; import { createContext } from 'react'; import { KibanaFeature } from '@kbn/features-plugin/common'; -import { ObservabilityPublicPluginsStart } from '../plugin'; import { ConfigSchema } from '..'; import { ObservabilityRuleTypeRegistry } from '../rules/create_observability_rule_type_registry'; import type { LazyObservabilityPageTemplateProps } from '../components/shared/page_template/lazy_page_template'; @@ -16,8 +15,6 @@ import type { LazyObservabilityPageTemplateProps } from '../components/shared/pa export interface PluginContextValue { appMountParameters: AppMountParameters; config: ConfigSchema; - core: CoreStart; - plugins: ObservabilityPublicPluginsStart; observabilityRuleTypeRegistry: ObservabilityRuleTypeRegistry; ObservabilityPageTemplate: React.ComponentType; kibanaFeatures: KibanaFeature[]; diff --git a/x-pack/plugins/observability/public/plugin.ts b/x-pack/plugins/observability/public/plugin.ts index a71fb939c0570..18fc71df2f414 100644 --- a/x-pack/plugins/observability/public/plugin.ts +++ b/x-pack/plugins/observability/public/plugin.ts @@ -301,7 +301,11 @@ export class Plugin }, createExploratoryViewUrl, getAppDataView: getAppDataView(pluginsStart.dataViews), - ExploratoryViewEmbeddable: getExploratoryViewEmbeddable(coreStart, pluginsStart), + ExploratoryViewEmbeddable: getExploratoryViewEmbeddable( + coreStart.uiSettings, + pluginsStart.dataViews, + pluginsStart.lens + ), useRulesLink: createUseRulesLink(config.unsafe.rules.enabled), }; }