[UX] Use components from Exploratory View app in UX (#154051)

x-pack/plugins/exploratory_view/kibana.jsonc

@@ -17,22 +17,14 @@
       "files",
       "guidedOnboarding",
       "inspector",
-      "inspector",
+      "lens",
       "observability",
       "security",
       "share",
       "triggersActionsUi",
       "unifiedSearch"
     ],
-    "optionalPlugins": [
-      "discover",
-      "embeddable",
-      "home",
-      "lens",
-      "licensing",
-      "spaces",
-      "usageCollection"
-    ],
+    "optionalPlugins": ["discover", "embeddable", "home", "licensing", "spaces", "usageCollection"],
     "requiredBundles": [
       "data",
       "dataViews",

x-pack/plugins/exploratory_view/public/index.ts

@@ -39,7 +39,14 @@ export { APP_ROUTE as EXPLORATORY_VIEW_APP_URL } from './constants';
 
 export type { UXMetrics } from './components/shared/core_web_vitals';
 
-export { ExploratoryView } from './components/shared';
+export {
+  getCoreVitalsComponent,
+  ExploratoryView,
+  FieldValueSuggestions,
+  FieldValueSelection,
+  FilterValueLabel,
+  SelectableUrlList,
+} from './components/shared';
 
 export * from './typings';
 

x-pack/plugins/observability/scripts/e2e.js

@@ -6,9 +6,4 @@
  */
 
 /* eslint-disable no-console */
-const { executeSyntheticsRunner } = require('@kbn/synthetics-plugin/scripts/base_e2e');
-const path = require('path');
-
-const e2eDir = path.join(__dirname, '../e2e');
-
-executeSyntheticsRunner(e2eDir);
+console.log('Disabled.');

x-pack/plugins/ux/kibana.jsonc

@@ -6,10 +6,7 @@
     "id": "ux",
     "server": false,
     "browser": true,
-    "configPath": [
-      "xpack",
-      "ux"
-    ],
+    "configPath": ["xpack", "ux"],
     "requiredPlugins": [
       "features",
       "data",
@@ -35,6 +32,7 @@
     ],
     "requiredBundles": [
       "kibanaReact",
+      "exploratoryView",
       "observability",
       "maps"
     ]

x-pack/plugins/ux/public/application/ux_app.tsx

@@ -44,6 +44,7 @@ import { UrlParamsProvider } from '../context/url_params_context/url_params_cont
 import { createStaticDataView } from '../services/rest/data_view';
 import { createCallApmApi } from '../services/rest/create_call_apm_api';
 import { useKibanaServices } from '../hooks/use_kibana_services';
+import { PluginContext } from '../context/plugin_context';
 
 export type BreadcrumbTitle<T = {}> =
   | string
@@ -109,6 +110,7 @@ export function UXAppRoot({
     inspector,
     maps,
     observability,
+    exploratoryView,
     data,
     dataViews,
     lens,
@@ -137,6 +139,7 @@ export function UXAppRoot({
           inspector,
           observability,
           embeddable,
+          exploratoryView,
           data,
           dataViews,
           lens,
@@ -151,22 +154,29 @@ export function UXAppRoot({
             },
           }}
         >
-          <i18nCore.Context>
-            <RouterProvider history={history} router={uxRouter}>
-              <DatePickerContextProvider>
-                <InspectorContextProvider>
-                  <UrlParamsProvider>
-                    <EuiErrorBoundary>
-                      <CsmSharedContextProvider>
-                        <UxApp />
-                      </CsmSharedContextProvider>
-                    </EuiErrorBoundary>
-                    <UXActionMenu appMountParameters={appMountParameters} />
-                  </UrlParamsProvider>
-                </InspectorContextProvider>
-              </DatePickerContextProvider>
-            </RouterProvider>
-          </i18nCore.Context>
+          <PluginContext.Provider
+            value={{
+              appMountParameters,
+              exploratoryView,
+            }}
+          >
+            <i18nCore.Context>
+              <RouterProvider history={history} router={uxRouter}>
+                <DatePickerContextProvider>
+                  <InspectorContextProvider>
+                    <UrlParamsProvider>
+                      <EuiErrorBoundary>
+                        <CsmSharedContextProvider>
+                          <UxApp />
+                        </CsmSharedContextProvider>
+                      </EuiErrorBoundary>
+                      <UXActionMenu appMountParameters={appMountParameters} />
+                    </UrlParamsProvider>
+                  </InspectorContextProvider>
+                </DatePickerContextProvider>
+              </RouterProvider>
+            </i18nCore.Context>
+          </PluginContext.Provider>
         </KibanaThemeProvider>
       </KibanaContextProvider>
     </RedirectAppLinks>

x-pack/plugins/ux/public/components/app/rum_dashboard/charts/page_load_dist_chart.tsx

@@ -6,7 +6,7 @@
  */
 
 import React, { useCallback } from 'react';
-import { AllSeries } from '@kbn/observability-plugin/public';
+import { AllSeries } from '@kbn/exploratory-view-plugin/public';
 import { getExploratoryViewFilter } from '../../../../services/data/get_exp_view_filter';
 import { useExpViewAttributes } from './use_exp_view_attrs';
 import { BreakdownItem } from '../../../../../typings/ui_filters';
@@ -26,7 +26,7 @@ export function PageLoadDistChart({ onPercentileChange, breakdown }: Props) {
   const { uxUiFilters, urlParams } = useLegacyUrlParams();
 
   const kibana = useKibanaServices();
-  const { ExploratoryViewEmbeddable } = kibana.observability!;
+  const { ExploratoryViewEmbeddable } = kibana.exploratoryView!;
 
   const onBrushEnd = useCallback(
     ({ range }: { range: number[] }) => {

x-pack/plugins/ux/public/components/app/rum_dashboard/charts/page_views_chart.tsx

@@ -7,13 +7,8 @@
 
 import moment from 'moment';
 import React, { useCallback } from 'react';
-import {
-  AllSeries,
-  fromQuery,
-  RECORDS_FIELD,
-  toQuery,
-  useTheme,
-} from '@kbn/observability-plugin/public';
+import { fromQuery, toQuery, useTheme } from '@kbn/observability-plugin/public';
+import { AllSeries, RECORDS_FIELD } from '@kbn/exploratory-view-plugin/public';
 import { useHistory } from 'react-router-dom';
 
 import { getExploratoryViewFilter } from '../../../../services/data/get_exp_view_filter';
@@ -31,7 +26,7 @@ export function PageViewsChart({ breakdown }: Props) {
   const { dataViewTitle } = useDataView();
   const history = useHistory();
   const kibana = useKibanaServices();
-  const { ExploratoryViewEmbeddable } = kibana.observability;
+  const { ExploratoryViewEmbeddable } = kibana.exploratoryView!;
 
   const { uxUiFilters, urlParams } = useLegacyUrlParams();
 

x-pack/plugins/ux/public/components/app/rum_dashboard/charts/use_exp_view_attrs.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { ALL_VALUES_SELECTED } from '@kbn/observability-plugin/public';
+import { ALL_VALUES_SELECTED } from '@kbn/exploratory-view-plugin/public';
 import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
 import {
   SERVICE_ENVIRONMENT,

x-pack/plugins/ux/public/components/app/rum_dashboard/local_uifilters/index.tsx

@@ -16,7 +16,7 @@ import {
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import type { ESFilter } from '@kbn/es-types';
-import { FieldValueSuggestions } from '@kbn/observability-plugin/public';
+import { FieldValueSuggestions } from '@kbn/exploratory-view-plugin/public';
 import { useLocalUIFilters } from '../hooks/use_local_uifilters';
 
 import { useBreakpoints } from '../../../../hooks/use_breakpoints';

x-pack/plugins/ux/public/components/app/rum_dashboard/local_uifilters/selected_filters.tsx

@@ -9,7 +9,7 @@ import React, { Fragment } from 'react';
 import { EuiButtonEmpty, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import styled from 'styled-components';
-import { FilterValueLabel } from '@kbn/observability-plugin/public';
+import { FilterValueLabel } from '@kbn/exploratory-view-plugin/public';
 import type { DataView } from '@kbn/data-views-plugin/public';
 import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params';
 import { FiltersUIHook } from '../hooks/use_local_uifilters';

x-pack/plugins/ux/public/components/app/rum_dashboard/url_filter/url_search/index.tsx

@@ -8,7 +8,7 @@
 import React, { useEffect, useState } from 'react';
 import { isEqual, map } from 'lodash';
 import { i18n } from '@kbn/i18n';
-import { SelectableUrlList } from '@kbn/observability-plugin/public';
+import { SelectableUrlList } from '@kbn/exploratory-view-plugin/public';
 import { useLegacyUrlParams } from '../../../../../context/url_params_context/use_url_params';
 import { I18LABELS } from '../../translations';
 import { formatToSec } from '../../ux_metrics/key_ux_metrics';

x-pack/plugins/ux/public/components/app/rum_dashboard/ux_metrics/index.tsx

@@ -14,7 +14,7 @@ import {
   EuiSpacer,
   EuiTitle,
 } from '@elastic/eui';
-import { getCoreVitalsComponent } from '@kbn/observability-plugin/public';
+import { getCoreVitalsComponent } from '@kbn/exploratory-view-plugin/public';
 import { I18LABELS } from '../translations';
 import { KeyUXMetrics } from './key_ux_metrics';
 import { useUxQuery } from '../hooks/use_ux_query';

x-pack/plugins/ux/public/context/plugin_context.ts

@@ -0,0 +1,17 @@
+/*
+ * 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 { AppMountParameters } from '@kbn/core/public';
+import type { ExploratoryViewPublicStart } from '@kbn/exploratory-view-plugin/public';
+import { createContext } from 'react';
+
+export interface PluginContextValue {
+  appMountParameters: AppMountParameters;
+  exploratoryView: ExploratoryViewPublicStart;
+}
+
+export const PluginContext = createContext({} as PluginContextValue);

x-pack/plugins/ux/public/hooks/use_static_data_view.ts

@@ -9,9 +9,9 @@ import { useFetcher } from '@kbn/observability-plugin/public';
 import { useKibanaServices } from './use_kibana_services';
 
 export function useStaticDataView() {
-  const { observability } = useKibanaServices();
+  const { exploratoryView } = useKibanaServices();
   const { data, loading } = useFetcher(async () => {
-    return observability.getAppDataView('ux');
+    return exploratoryView.getAppDataView('ux');
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 

x-pack/plugins/ux/public/plugin.ts

@@ -30,7 +30,10 @@ import { HomePublicPluginSetup } from '@kbn/home-plugin/public';
 import { FeaturesPluginSetup } from '@kbn/features-plugin/public';
 import { LicensingPluginSetup } from '@kbn/licensing-plugin/public';
 import { EmbeddableStart } from '@kbn/embeddable-plugin/public';
-import { ExploratoryViewPublicSetup } from '@kbn/exploratory-view-plugin/public';
+import {
+  ExploratoryViewPublicSetup,
+  ExploratoryViewPublicStart,
+} from '@kbn/exploratory-view-plugin/public';
 import { MapsStartApi } from '@kbn/maps-plugin/public';
 import { Start as InspectorPluginStart } from '@kbn/inspector-plugin/public';
 import { DataViewsPublicPluginStart } from '@kbn/data-views-plugin/public';
@@ -56,6 +59,7 @@ export interface ApmPluginStartDeps {
   maps?: MapsStartApi;
   inspector: InspectorPluginStart;
   observability: ObservabilityPublicStart;
+  exploratoryView: ExploratoryViewPublicStart;
   dataViews: DataViewsPublicPluginStart;
   lens: LensPublicStart;
 }

x-pack/plugins/ux/public/services/data/get_exp_view_filter.ts

@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { UrlFilter } from '@kbn/observability-plugin/public';
+import { UrlFilter } from '@kbn/exploratory-view-plugin/public';
 import { TRANSACTION_URL } from '../../../common/elasticsearch_fieldnames';
 import { UrlParams } from '../../context/url_params_context/types';
 import {