chore(slo): Migrate to server-route-repository

x-pack/plugins/observability_solution/slo/common/config.ts

@@ -25,5 +25,5 @@ export const config = {
     experimental: true,
   },
 };
-export type SloConfig = TypeOf<typeof configSchema>;
-export type ExperimentalFeatures = SloConfig['experimental'];
+export type SLOConfig = TypeOf<typeof configSchema>;
+export type ExperimentalFeatures = SLOConfig['experimental'];

x-pack/plugins/observability_solution/slo/kibana.jsonc

@@ -38,11 +38,11 @@
       "presentationUtil",
       "features",
       "licensing",
-      "usageCollection"
+      "usageCollection",
+      "spaces",
     ],
     "optionalPlugins": [
       "cloud",
-      "spaces",
       "serverless",
       "discover",
       "observabilityAIAssistant"

x-pack/plugins/observability_solution/slo/public/application.tsx

@@ -25,26 +25,20 @@ import { ExperimentalFeatures } from '../common/config';
 import { PluginContext } from './context/plugin_context';
 import { usePluginContext } from './hooks/use_plugin_context';
 import { getRoutes } from './routes/routes';
-import { SloPublicPluginsStart } from './types';
+import { SLORepositoryClient, SLOPublicPluginsStart } from './types';
 
-function App() {
-  const { isServerless } = usePluginContext();
-
-  const routes = getRoutes(isServerless);
-
-  return (
-    <>
-      <Routes>
-        {Object.keys(routes).map((path) => {
-          const { handler, exact } = routes[path];
-          const Wrapper = () => {
-            return handler();
-          };
-          return <Route key={path} path={path} exact={exact} component={Wrapper} />;
-        })}
-      </Routes>
-    </>
-  );
+interface Props {
+  core: CoreStart;
+  plugins: SLOPublicPluginsStart;
+  appMountParameters: AppMountParameters;
+  observabilityRuleTypeRegistry: ObservabilityRuleTypeRegistry;
+  ObservabilityPageTemplate: React.ComponentType<LazyObservabilityPageTemplateProps>;
+  usageCollection: UsageCollectionSetup;
+  isDev?: boolean;
+  kibanaVersion: string;
+  isServerless?: boolean;
+  experimentalFeatures: ExperimentalFeatures;
+  sloClient: SLORepositoryClient;
 }
 
 export const renderApp = ({
@@ -58,18 +52,8 @@ export const renderApp = ({
   isServerless,
   observabilityRuleTypeRegistry,
   experimentalFeatures,
-}: {
-  core: CoreStart;
-  plugins: SloPublicPluginsStart;
-  appMountParameters: AppMountParameters;
-  observabilityRuleTypeRegistry: ObservabilityRuleTypeRegistry;
-  ObservabilityPageTemplate: React.ComponentType<LazyObservabilityPageTemplateProps>;
-  usageCollection: UsageCollectionSetup;
-  isDev?: boolean;
-  kibanaVersion: string;
-  isServerless?: boolean;
-  experimentalFeatures: ExperimentalFeatures;
-}) => {
+  sloClient,
+}: Props) => {
   const { element, history, theme$ } = appMountParameters;
   const isDarkMode = core.theme.getTheme().darkMode;
 
@@ -128,6 +112,7 @@ export const renderApp = ({
                   ObservabilityPageTemplate,
                   observabilityRuleTypeRegistry,
                   experimentalFeatures,
+                  sloClient,
                 }}
               >
                 <Router history={history}>
@@ -160,3 +145,21 @@ export const renderApp = ({
     ReactDOM.unmountComponentAtNode(element);
   };
 };
+
+function App() {
+  const { isServerless } = usePluginContext();
+
+  const routes = getRoutes(isServerless);
+
+  return (
+    <Routes>
+      {Object.keys(routes).map((path) => {
+        const { handler, exact } = routes[path];
+        const Wrapper = () => {
+          return handler();
+        };
+        return <Route key={path} path={path} exact={exact} component={Wrapper} />;
+      })}
+    </Routes>
+  );
+}

x-pack/plugins/observability_solution/slo/public/context/plugin_context.tsx

@@ -10,6 +10,7 @@ import type { AppMountParameters } from '@kbn/core/public';
 import type { LazyObservabilityPageTemplateProps } from '@kbn/observability-shared-plugin/public';
 import type { ObservabilityRuleTypeRegistry } from '@kbn/observability-plugin/public';
 import { ExperimentalFeatures } from '../../common/config';
+import type { SLORepositoryClient } from '../types';
 
 export interface PluginContextValue {
   isDev?: boolean;
@@ -18,6 +19,7 @@ export interface PluginContextValue {
   observabilityRuleTypeRegistry: ObservabilityRuleTypeRegistry;
   ObservabilityPageTemplate: React.ComponentType<LazyObservabilityPageTemplateProps>;
   experimentalFeatures?: ExperimentalFeatures;
+  sloClient: SLORepositoryClient;
 }
 
 export const PluginContext = createContext<PluginContextValue | null>(null);

x-pack/plugins/observability_solution/slo/public/embeddable/slo/alerts/slo_alerts_embeddable_factory.tsx

@@ -5,27 +5,28 @@
  * 2.0.
  */
 
-import { i18n } from '@kbn/i18n';
-import React, { useEffect } from 'react';
-import { Router } from '@kbn/shared-ux-router';
-import { BehaviorSubject, Subject } from 'rxjs';
+import type { CoreStart } from '@kbn/core-lifecycle-browser';
 import { ReactEmbeddableFactory } from '@kbn/embeddable-plugin/public';
+import { i18n } from '@kbn/i18n';
+import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
+import { Storage } from '@kbn/kibana-utils-plugin/public';
 import {
+  FetchContext,
+  fetch$,
   initializeTitles,
   useBatchedPublishingSubjects,
-  fetch$,
-  FetchContext,
   useFetchContext,
 } from '@kbn/presentation-publishing';
-import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
+import { Router } from '@kbn/shared-ux-router';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { createBrowserHistory } from 'history';
-import { Storage } from '@kbn/kibana-utils-plugin/public';
-import type { StartServicesAccessor } from '@kbn/core-lifecycle-browser';
+import React, { useEffect } from 'react';
+import { BehaviorSubject, Subject } from 'rxjs';
+import { PluginContext } from '../../../context/plugin_context';
+import { SLOPublicPluginsStart, SLORepositoryClient } from '../../../types';
 import { SLO_ALERTS_EMBEDDABLE_ID } from './constants';
-import { SloAlertsEmbeddableState, SloAlertsApi } from './types';
-import { SloPublicPluginsStart, SloPublicStart } from '../../../types';
 import { SloAlertsWrapper } from './slo_alerts_wrapper';
+import { SloAlertsApi, SloAlertsEmbeddableState } from './types';
 const history = createBrowserHistory();
 const queryClient = new QueryClient();
 
@@ -34,10 +35,17 @@ export const getAlertsPanelTitle = () =>
     defaultMessage: 'SLO Alerts',
   });
 
-export function getAlertsEmbeddableFactory(
-  getStartServices: StartServicesAccessor<SloPublicPluginsStart, SloPublicStart>,
-  kibanaVersion: string
-) {
+export function getAlertsEmbeddableFactory({
+  coreStart,
+  pluginsStart,
+  sloClient,
+  kibanaVersion,
+}: {
+  coreStart: CoreStart;
+  pluginsStart: SLOPublicPluginsStart;
+  sloClient: SLORepositoryClient;
+  kibanaVersion: string;
+}) {
   const factory: ReactEmbeddableFactory<
     SloAlertsEmbeddableState,
     SloAlertsEmbeddableState,
@@ -48,15 +56,15 @@ export function getAlertsEmbeddableFactory(
       return state.rawState as SloAlertsEmbeddableState;
     },
     buildEmbeddable: async (state, buildApi, uuid, parentApi) => {
-      const [coreStart, pluginStart] = await getStartServices();
-      const deps = { ...coreStart, ...pluginStart };
+      const deps = { ...coreStart, ...pluginsStart };
       async function onEdit() {
         try {
           const { openSloConfiguration } = await import('./slo_alerts_open_configuration');
 
           const result = await openSloConfiguration(
             coreStart,
-            pluginStart,
+            pluginsStart,
+            sloClient,
             api.getSloAlertsConfig()
           );
           api.updateSloAlertsConfig(result);
@@ -143,18 +151,28 @@ export function getAlertsEmbeddableFactory(
                   kibanaVersion,
                 }}
               >
-                <Router history={history}>
-                  <QueryClientProvider client={queryClient}>
-                    <SloAlertsWrapper
-                      onEdit={onEdit}
-                      deps={deps}
-                      slos={slos}
-                      timeRange={fetchContext.timeRange ?? { from: 'now-15m/m', to: 'now' }}
-                      reloadSubject={reload$}
-                      showAllGroupByInstances={showAllGroupByInstances}
-                    />
-                  </QueryClientProvider>
-                </Router>
+                <PluginContext.Provider
+                  value={{
+                    observabilityRuleTypeRegistry:
+                      pluginsStart.observability.observabilityRuleTypeRegistry,
+                    ObservabilityPageTemplate:
+                      pluginsStart.observabilityShared.navigation.PageTemplate,
+                    sloClient,
+                  }}
+                >
+                  <Router history={history}>
+                    <QueryClientProvider client={queryClient}>
+                      <SloAlertsWrapper
+                        onEdit={onEdit}
+                        deps={deps}
+                        slos={slos}
+                        timeRange={fetchContext.timeRange ?? { from: 'now-15m/m', to: 'now' }}
+                        reloadSubject={reload$}
+                        showAllGroupByInstances={showAllGroupByInstances}
+                      />
+                    </QueryClientProvider>
+                  </Router>
+                </PluginContext.Provider>
               </KibanaContextProvider>
             </I18nContext>
           );

x-pack/plugins/observability_solution/slo/public/embeddable/slo/alerts/slo_alerts_open_configuration.tsx

@@ -4,17 +4,21 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-import React from 'react';
 import type { CoreStart } from '@kbn/core/public';
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { toMountPoint } from '@kbn/react-kibana-mount';
 import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
-import { SloPublicPluginsStart } from '../../..';
+import { toMountPoint } from '@kbn/react-kibana-mount';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import React from 'react';
+import { SLOPublicPluginsStart } from '../../..';
+import { PluginContext } from '../../../context/plugin_context';
+import { SLORepositoryClient } from '../../../types';
 import { SloConfiguration } from './slo_configuration';
 import type { EmbeddableSloProps } from './types';
+
 export async function openSloConfiguration(
   coreStart: CoreStart,
-  pluginStart: SloPublicPluginsStart,
+  pluginsStart: SLOPublicPluginsStart,
+  sloClient: SLORepositoryClient,
   initialState?: EmbeddableSloProps
 ): Promise<EmbeddableSloProps> {
   const { overlays } = coreStart;
@@ -26,22 +30,31 @@ export async function openSloConfiguration(
           <KibanaContextProvider
             services={{
               ...coreStart,
-              ...pluginStart,
+              ...pluginsStart,
             }}
           >
-            <QueryClientProvider client={queryClient}>
-              <SloConfiguration
-                initialInput={initialState}
-                onCreate={(update: EmbeddableSloProps) => {
-                  flyoutSession.close();
-                  resolve(update);
-                }}
-                onCancel={() => {
-                  flyoutSession.close();
-                  reject();
-                }}
-              />
-            </QueryClientProvider>
+            <PluginContext.Provider
+              value={{
+                observabilityRuleTypeRegistry:
+                  pluginsStart.observability.observabilityRuleTypeRegistry,
+                ObservabilityPageTemplate: pluginsStart.observabilityShared.navigation.PageTemplate,
+                sloClient,
+              }}
+            >
+              <QueryClientProvider client={queryClient}>
+                <SloConfiguration
+                  initialInput={initialState}
+                  onCreate={(update: EmbeddableSloProps) => {
+                    flyoutSession.close();
+                    resolve(update);
+                  }}
+                  onCancel={() => {
+                    flyoutSession.close();
+                    reject();
+                  }}
+                />
+              </QueryClientProvider>
+            </PluginContext.Provider>
           </KibanaContextProvider>,
           coreStart
         )