Fix context.pageName by fixing missing executionContext

packages/react/kibana_context/root/BUILD.bazel

@@ -26,6 +26,7 @@ DEPS = [
   "@npm//tslib",
   "@npm//@elastic/eui",
   "//packages/core/base/core-base-common",
+  "//packages/shared-ux/router/impl:shared-ux-router",
 ]
 
 js_library(

packages/react/kibana_context/root/root_provider.test.tsx

@@ -17,6 +17,8 @@ import { mountWithIntl } from '@kbn/test-jest-helpers';
 import type { KibanaTheme } from '@kbn/react-kibana-context-common';
 import type { AnalyticsServiceStart } from '@kbn/core-analytics-browser';
 import { analyticsServiceMock } from '@kbn/core-analytics-browser-mocks';
+import type { ExecutionContextStart } from '@kbn/core-execution-context-browser';
+import { executionContextServiceMock } from '@kbn/core-execution-context-browser-mocks';
 import { i18nServiceMock } from '@kbn/core-i18n-browser-mocks';
 import { KibanaRootContextProvider } from './root_provider';
 import { I18nStart } from '@kbn/core-i18n-browser';
@@ -25,11 +27,13 @@ describe('KibanaRootContextProvider', () => {
   let euiTheme: UseEuiTheme | undefined;
   let i18nMock: I18nStart;
   let analytics: AnalyticsServiceStart;
+  let executionContext: ExecutionContextStart;
 
   beforeEach(() => {
     euiTheme = undefined;
     analytics = analyticsServiceMock.createAnalyticsServiceStart();
     i18nMock = i18nServiceMock.createStartContract();
+    executionContext = executionContextServiceMock.createStartContract();
   });
 
   const flushPromises = async () => {
@@ -64,6 +68,7 @@ describe('KibanaRootContextProvider', () => {
       <KibanaRootContextProvider
         analytics={analytics}
         i18n={i18nMock}
+        executionContext={executionContext}
         theme={{ theme$: of(coreTheme) }}
       >
         <InnerComponent />
@@ -82,6 +87,7 @@ describe('KibanaRootContextProvider', () => {
       <KibanaRootContextProvider
         analytics={analytics}
         i18n={i18nMock}
+        executionContext={executionContext}
         theme={{ theme$: coreTheme$ }}
       >
         <InnerComponent />

packages/react/kibana_context/root/root_provider.tsx

@@ -11,6 +11,8 @@ import React, { FC, PropsWithChildren } from 'react';
 
 import type { AnalyticsServiceStart } from '@kbn/core-analytics-browser';
 import type { I18nStart } from '@kbn/core-i18n-browser';
+import type { ExecutionContextStart } from '@kbn/core-execution-context-browser';
+import { SharedUXContext } from '@kbn/shared-ux-router';
 
 // @ts-expect-error EUI exports this component internally, but Kibana isn't picking it up its types
 import { useIsNestedEuiProvider } from '@elastic/eui/lib/components/provider/nested';
@@ -25,6 +27,8 @@ export interface KibanaRootContextProviderProps extends KibanaEuiProviderProps {
   i18n: I18nStart;
   /** The `AnalyticsServiceStart` API from `CoreStart`. */
   analytics?: Pick<AnalyticsServiceStart, 'reportEvent'>;
+  /** The `ExecutionContextStart` API from `CoreStart`. */
+  executionContext?: ExecutionContextStart;
 }
 
 /**
@@ -44,20 +48,22 @@ export interface KibanaRootContextProviderProps extends KibanaEuiProviderProps {
 export const KibanaRootContextProvider: FC<PropsWithChildren<KibanaRootContextProviderProps>> = ({
   children,
   i18n,
+  executionContext,
   ...props
 }) => {
   const hasEuiProvider = useIsNestedEuiProvider();
+  const rootContextProvider = (
+    <SharedUXContext.Provider value={{ services: { executionContext } }}>
+      <i18n.Context>{children}</i18n.Context>
+    </SharedUXContext.Provider>
+  );
 
   if (hasEuiProvider) {
     emitEuiProviderWarning(
       'KibanaRootContextProvider has likely been nested in this React tree, either by direct reference or by KibanaRenderContextProvider.  The result of this nesting is a nesting of EuiProvider, which has negative effects.  Check your React tree for nested Kibana context providers.'
     );
-    return <i18n.Context>{children}</i18n.Context>;
+    return rootContextProvider;
   } else {
-    return (
-      <KibanaEuiProvider {...props}>
-        <i18n.Context>{children}</i18n.Context>
-      </KibanaEuiProvider>
-    );
+    return <KibanaEuiProvider {...props}>{rootContextProvider}</KibanaEuiProvider>;
   }
 };

packages/react/kibana_context/root/tsconfig.json

@@ -23,5 +23,8 @@
     "@kbn/core-base-common",
     "@kbn/core-analytics-browser",
     "@kbn/core-analytics-browser-mocks",
+    "@kbn/core-execution-context-browser",
+    "@kbn/core-execution-context-browser-mocks",
+    "@kbn/shared-ux-router",
   ]
 }

packages/shared-ux/router/impl/BUILD.bazel

@@ -0,0 +1,34 @@
+load("@build_bazel_rules_nodejs//:index.bzl", "js_library")
+
+SRCS = glob(
+  [
+    "**/*.ts",
+    "**/*.tsx",
+  ],
+  exclude = [
+    "**/test_helpers.ts",
+    "**/*.config.js",
+    "**/*.mock.*",
+    "**/*.test.*",
+    "**/*.stories.*",
+    "**/__snapshots__/**",
+    "**/integration_tests/**",
+    "**/mocks/**",
+    "**/scripts/**",
+    "**/storybook/**",
+    "**/test_fixtures/**",
+    "**/test_helpers/**",
+  ],
+)
+
+DEPS = [
+
+]
+
+js_library(
+  name = "shared-ux-router",
+  package_name = "@kbn/shared-ux-router",
+  srcs = ["package.json"] + SRCS,
+  deps = DEPS,
+  visibility = ["//visibility:public"],
+)

packages/shared-ux/router/impl/index.ts

@@ -10,3 +10,5 @@
 export { Route } from './route';
 export { HashRouter, BrowserRouter, MemoryRouter, Router } from './router';
 export { Routes } from './routes';
+
+export { SharedUXContext } from './services';

packages/shared-ux/router/impl/services.ts

@@ -50,7 +50,7 @@ export interface SharedUXExecutionContextSetup {
  */
 export interface SharedUXExecutionContextSetup {
   /** {@link SharedUXExecutionContextSetup} */
-  executionContext: SharedUXExecutionContextStart;
+  executionContext?: SharedUXExecutionContextStart;
 }
 
 export type KibanaServices = Partial<SharedUXExecutionContextSetup>;
@@ -63,12 +63,12 @@ const defaultContextValue = {
   services: {},
 };
 
-export const sharedUXContext =
+export const SharedUXContext =
   createContext<SharedUXRouterContextValue<KibanaServices>>(defaultContextValue);
 
 export const useKibanaSharedUX = <Extra extends object = {}>(): SharedUXRouterContextValue<
   KibanaServices & Extra
 > =>
   useContext(
-    sharedUXContext as unknown as React.Context<SharedUXRouterContextValue<KibanaServices & Extra>>
+    SharedUXContext as unknown as React.Context<SharedUXRouterContextValue<KibanaServices & Extra>>
   );

packages/shared-ux/router/impl/use_execution_context.ts

@@ -8,7 +8,7 @@
  */
 
 import useDeepCompareEffect from 'react-use/lib/useDeepCompareEffect';
-import { SharedUXExecutionContextSetup } from './services';
+import type { SharedUXExecutionContextSetup } from './services';
 import { SharedUXExecutionContext } from './types';
 
 /**

src/plugins/dashboard/public/dashboard_listing/dashboard_listing_table.tsx

@@ -30,6 +30,7 @@ export const DashboardListingTable = ({
   urlStateEnabled,
   showCreateDashboardButton = true,
 }: DashboardListingProps) => {
+  // TODO: Remove this comment after testing
   useExecutionContext(coreServices.executionContext, {
     type: 'application',
     page: 'list',

src/plugins/visualizations/public/visualize_app/components/visualize_editor.tsx

@@ -68,6 +68,7 @@ export const VisualizeEditor = ({ onAppLeave }: VisualizeAppProps) => {
   );
 
   const editorName = savedVisInstance?.vis.type.title.toLowerCase().replace(' ', '_') || '';
+  // TODO: Remove this comment after testing
   useExecutionContext(services.executionContext, {
     type: 'application',
     page: `editor${editorName ? `:${editorName}` : ''}`,

x-pack/plugins/aiops/public/hooks/use_data.ts

@@ -41,6 +41,7 @@ export const useData = (
 ) => {
   const { executionContext, uiSettings } = useAiopsAppContext();
 
+  // TODO: Remove this comment after testing
   useExecutionContext(executionContext, {
     name: AIOPS_PLUGIN_ID,
     type: 'application',

x-pack/plugins/cross_cluster_replication/public/app/index.tsx

@@ -34,6 +34,7 @@ const AppWithExecutionContext = ({
   getUrlForApp: ApplicationStart['getUrlForApp'];
   executionContext: ExecutionContextStart;
 }) => {
+  // TODO: Remove this comment after testing
   useExecutionContext(executionContext, {
     type: 'application',
     page: 'crossClusterReplication',

x-pack/plugins/data_visualizer/public/application/common/hooks/use_data.ts

@@ -49,6 +49,7 @@ export const useData = (
     },
   } = useDataVisualizerKibana();
 
+  // TODO: Remove this comment after testing
   useExecutionContext(executionContext, {
     name: 'data_visualizer',
     type: 'application',

x-pack/plugins/lens/public/app_plugin/app.tsx

@@ -165,6 +165,7 @@ export function App({
     setIndicateNoData(true);
   }, [setIndicateNoData]);
 
+  // TODO: Remove this comment after testing
   useExecutionContext(executionContext, {
     type: 'application',
     id: savedObjectId || 'new', // TODO: this doesn't consider when lens is saved by value

x-pack/plugins/ml/public/application/routing/use_active_route.tsx

@@ -98,6 +98,7 @@ export const useActiveRoute = (routesList: MlRoute[]): MlRoute => {
     [activeRoute, overlays, pathname, startServices]
   );
 
+  // TODO: Remove this comment after testing
   useExecutionContext(executionContext, {
     name: PLUGIN_ID,
     type: 'application',

x-pack/plugins/rollup/public/application.tsx

@@ -30,6 +30,7 @@ const AppWithExecutionContext = ({
   history: ManagementAppMountParams['history'];
   executionContext: ExecutionContextStart;
 }) => {
+  // TODO: Remove this comment after testing
   useExecutionContext(executionContext, {
     type: 'application',
     page: 'rollup',

x-pack/plugins/security_solution/public/common/hooks/use_update_execution_context.ts

@@ -16,6 +16,7 @@ export const useUpdateExecutionContext = () => {
   useEffect(() => {
     // setImmediate is required to ensure that EBT telemetry for the previous page is shipped before the new page is updated
     setImmediate(() => {
+      // TODO: Remove this comment after testing
       executionContext.set({ page: pathname });
     });
   }, [pathname, executionContext]);