use generic edit actions in the alerts embeddable

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

@@ -21,8 +21,10 @@ import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
 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 { SLO_ALERTS_EMBEDDABLE_ID } from './constants';
-import { SloEmbeddableDeps, SloAlertsEmbeddableState, SloAlertsApi } from './types';
+import { SloAlertsEmbeddableState, SloAlertsApi } from './types';
+import { SloPublicPluginsStart, SloPublicStart } from '../../../types';
 import { SloAlertsWrapper } from './slo_alerts_wrapper';
 const history = createBrowserHistory();
 const queryClient = new QueryClient();
@@ -32,13 +34,33 @@ export const getAlertsPanelTitle = () =>
     defaultMessage: 'SLO Alerts',
   });
 
-export function getAlertsEmbeddableFactory(deps: SloEmbeddableDeps, kibanaVersion: string) {
+export function getAlertsEmbeddableFactory(
+  getStartServices: StartServicesAccessor<SloPublicPluginsStart, SloPublicStart>,
+  kibanaVersion: string
+) {
   const factory: ReactEmbeddableFactory<SloAlertsEmbeddableState, SloAlertsApi> = {
     type: SLO_ALERTS_EMBEDDABLE_ID,
     deserializeState: (state) => {
       return state.rawState as SloAlertsEmbeddableState;
     },
     buildEmbeddable: async (state, buildApi, uuid, parentApi) => {
+      const [coreStart, pluginStart] = await getStartServices();
+      const deps = { ...coreStart, ...pluginStart };
+      async function onEdit() {
+        try {
+          const { openSloConfiguration } = await import('./slo_alerts_open_configuration');
+
+          const result = await openSloConfiguration(
+            coreStart,
+            pluginStart,
+            api.getSloAlertsConfig()
+          );
+          api.updateSloAlertsConfig(result);
+        } catch (e) {
+          return Promise.reject();
+        }
+      }
+
       const { titlesApi, titleComparators, serializeTitles } = initializeTitles(state);
       const defaultTitle$ = new BehaviorSubject<string | undefined>(getAlertsPanelTitle());
       const slos$ = new BehaviorSubject(state.slos);
@@ -48,6 +70,14 @@ export function getAlertsEmbeddableFactory(deps: SloEmbeddableDeps, kibanaVersio
         {
           ...titlesApi,
           defaultPanelTitle: defaultTitle$,
+          getTypeDisplayName: () =>
+            i18n.translate('xpack.slo.editSloAlertswEmbeddable.typeDisplayName', {
+              defaultMessage: 'configuration',
+            }),
+          isEditingEnabled: () => true,
+          onEdit: async () => {
+            onEdit();
+          },
           serializeState: () => {
             return {
               rawState: {
@@ -112,6 +142,7 @@ export function getAlertsEmbeddableFactory(deps: SloEmbeddableDeps, kibanaVersio
                 <Router history={history}>
                   <QueryClientProvider client={queryClient}>
                     <SloAlertsWrapper
+                      onEdit={onEdit}
                       embeddable={api}
                       deps={deps}
                       slos={slos}

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

@@ -9,8 +9,6 @@ import { FormattedMessage } from '@kbn/i18n-react';
 import { i18n } from '@kbn/i18n';
 import { EuiFlexGroup, EuiFlexItem, EuiLink } from '@elastic/eui';
 import type { TimeRange } from '@kbn/es-query';
-import { CONTEXT_MENU_TRIGGER } from '@kbn/embeddable-plugin/public';
-import { ActionExecutionContext } from '@kbn/ui-actions-plugin/public';
 import { Subject } from 'rxjs';
 import styled from 'styled-components';
 import { observabilityPaths } from '@kbn/observability-plugin/common';
@@ -19,16 +17,15 @@ import { SloIncludedCount } from './components/slo_included_count';
 import { SloAlertsSummary } from './components/slo_alerts_summary';
 import { SloAlertsTable } from './components/slo_alerts_table';
 import type { SloItem, SloEmbeddableDeps } from './types';
-import { EDIT_SLO_ALERTS_ACTION } from '../../../ui_actions/edit_slo_alerts_panel';
 
 interface Props {
   deps: SloEmbeddableDeps;
   slos: SloItem[];
   timeRange: TimeRange;
-  embeddable: any;
   onRenderComplete?: () => void;
   reloadSubject: Subject<FetchContext>;
   showAllGroupByInstances?: boolean;
+  onEdit: () => void;
 }
 
 export function SloAlertsWrapper({
@@ -39,6 +36,7 @@ export function SloAlertsWrapper({
   onRenderComplete,
   reloadSubject,
   showAllGroupByInstances,
+  onEdit,
 }: Props) {
   const {
     application: { navigateToUrl },
@@ -102,11 +100,7 @@ export function SloAlertsWrapper({
         <EuiFlexItem grow={false}>
           <EuiLink
             onClick={() => {
-              const trigger = deps.uiActions.getTrigger(CONTEXT_MENU_TRIGGER);
-              deps.uiActions.getAction(EDIT_SLO_ALERTS_ACTION).execute({
-                trigger,
-                embeddable,
-              } as ActionExecutionContext);
+              onEdit();
             }}
             data-test-subj="o11ySloAlertsWrapperSlOsIncludedLink"
           >

x-pack/plugins/observability_solution/slo/public/embeddable/slo/alerts/types.ts

@@ -24,6 +24,7 @@ import {
   PublishesWritablePanelTitle,
   PublishesPanelTitle,
   EmbeddableApiContext,
+  HasEditCapabilities,
 } from '@kbn/presentation-publishing';
 
 export interface SloItem {
@@ -45,7 +46,8 @@ export type SloAlertsEmbeddableState = SerializedTitles & EmbeddableSloProps;
 export type SloAlertsApi = DefaultEmbeddableApi<SloAlertsEmbeddableState> &
   PublishesWritablePanelTitle &
   PublishesPanelTitle &
-  HasSloAlertsConfig;
+  HasSloAlertsConfig &
+  HasEditCapabilities;
 
 export interface HasSloAlertsConfig {
   getSloAlertsConfig: () => EmbeddableSloProps;

x-pack/plugins/observability_solution/slo/public/plugin.ts

@@ -125,7 +125,7 @@ export class SloPlugin
               './embeddable/slo/alerts/slo_alerts_embeddable_factory'
             );
 
-            return getAlertsEmbeddableFactory(deps, kibanaVersion);
+            return getAlertsEmbeddableFactory(coreSetup.getStartServices, kibanaVersion);
           }
         );
 

x-pack/plugins/observability_solution/slo/public/ui_actions/index.ts

@@ -6,9 +6,7 @@
  */
 
 import type { UiActionsSetup } from '@kbn/ui-actions-plugin/public';
-import { CONTEXT_MENU_TRIGGER } from '@kbn/embeddable-plugin/public';
 import type { CoreSetup } from '@kbn/core/public';
-import { createEditSloAlertsPanelAction } from './edit_slo_alerts_panel';
 import { createOverviewPanelAction } from './create_overview_panel_action';
 import { createAddErrorBudgetPanelAction } from './create_error_budget_action';
 import { createAddAlertsPanelAction } from './create_alerts_panel_action';
@@ -19,13 +17,11 @@ export function registerSloUiActions(
   core: CoreSetup<SloPublicPluginsStart, SloPublicStart>
 ) {
   // Initialize actions
-  const editSloAlertsPanelAction = createEditSloAlertsPanelAction(core.getStartServices);
   const addOverviewPanelAction = createOverviewPanelAction(core.getStartServices);
   const addErrorBudgetPanelAction = createAddErrorBudgetPanelAction(core.getStartServices);
   const addAlertsPanelAction = createAddAlertsPanelAction(core.getStartServices);
 
   // Assign triggers
-  uiActions.addTriggerAction(CONTEXT_MENU_TRIGGER, editSloAlertsPanelAction);
   uiActions.addTriggerAction('ADD_PANEL_TRIGGER', addOverviewPanelAction);
   uiActions.addTriggerAction('ADD_PANEL_TRIGGER', addErrorBudgetPanelAction);
   uiActions.addTriggerAction('ADD_PANEL_TRIGGER', addAlertsPanelAction);