[Synthetics][Ux][Uptime] Use Observability Page Template from Observability Shared (#154774)

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Shahzad <shahzad31comp@gmail.com>

x-pack/plugins/ux/kibana.jsonc

@@ -14,6 +14,7 @@
       "exploratoryView",
       "licensing",
       "triggersActionsUi",
+      "observabilityShared",
       "embeddable",
       "infra",
       "inspector",

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

@@ -110,6 +110,7 @@ export function UXAppRoot({
     inspector,
     maps,
     observability,
+    observabilityShared,
     exploratoryView,
     data,
     dataViews,
@@ -138,6 +139,7 @@ export function UXAppRoot({
           ...plugins,
           inspector,
           observability,
+          observabilityShared,
           embeddable,
           exploratoryView,
           data,

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

@@ -25,9 +25,9 @@ export const DASHBOARD_LABEL = i18n.translate('xpack.ux.title', {
 });
 
 export function RumHome() {
-  const { docLinks, http, observability } = useKibanaServices();
+  const { docLinks, http, observabilityShared } = useKibanaServices();
 
-  const PageTemplateComponent = observability.navigation.PageTemplate;
+  const PageTemplateComponent = observabilityShared.navigation.PageTemplate;
 
   const { hasData, loading: isLoading } = useHasRumData();
 

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

@@ -38,6 +38,10 @@ import { MapsStartApi } from '@kbn/maps-plugin/public';
 import { Start as InspectorPluginStart } from '@kbn/inspector-plugin/public';
 import { DataViewsPublicPluginStart } from '@kbn/data-views-plugin/public';
 import { LensPublicStart } from '@kbn/lens-plugin/public';
+import {
+  ObservabilitySharedPluginSetup,
+  ObservabilitySharedPluginStart,
+} from '@kbn/observability-shared-plugin/public';
 
 export type UxPluginSetup = void;
 export type UxPluginStart = void;
@@ -49,6 +53,7 @@ export interface ApmPluginSetupDeps {
   home?: HomePublicPluginSetup;
   licensing: LicensingPluginSetup;
   observability: ObservabilityPublicSetup;
+  observabilityShared: ObservabilitySharedPluginSetup;
 }
 
 export interface ApmPluginStartDeps {
@@ -59,6 +64,7 @@ export interface ApmPluginStartDeps {
   maps?: MapsStartApi;
   inspector: InspectorPluginStart;
   observability: ObservabilityPublicStart;
+  observabilityShared: ObservabilitySharedPluginStart;
   exploratoryView: ExploratoryViewPublicStart;
   dataViews: DataViewsPublicPluginStart;
   lens: LensPublicStart;
@@ -126,7 +132,7 @@ export class UxPlugin implements Plugin<UxPluginSetup, UxPluginStart> {
     }
 
     // register observability nav if user has access to plugin
-    plugins.observability.navigation.registerSections(
+    plugins.observabilityShared.navigation.registerSections(
       from(core.getStartServices()).pipe(
         map(([coreStart]) => {
           // checking apm capability, since ux for now doesn't have it's

x-pack/plugins/ux/tsconfig.json

@@ -37,6 +37,7 @@
     "@kbn/i18n-react",
     "@kbn/es-query",
     "@kbn/exploratory-view-plugin",
+    "@kbn/observability-shared-plugin",
   ],
   "exclude": [
     "target/**/*",