Add image embeddable to Canvas

Heenawter · Heenawter · commit b9c61841ae0a · 2024-04-03T16:40:47.000-06:00
diff --git a/src/plugins/image_embeddable/public/actions/create_image_action.ts b/src/plugins/image_embeddable/public/actions/create_image_action.ts
@@ -7,39 +7,28 @@
  */
 
 import { i18n } from '@kbn/i18n';
-import { PresentationContainer } from '@kbn/presentation-containers';
-import { EmbeddableApiContext } from '@kbn/presentation-publishing';
+import { apiCanAddNewPanel, EmbeddableApiContext } from '@kbn/presentation-publishing';
 import { IncompatibleActionError } from '@kbn/ui-actions-plugin/public';
 import {
   ADD_IMAGE_EMBEDDABLE_ACTION_ID,
   IMAGE_EMBEDDABLE_TYPE,
 } from '../image_embeddable/constants';
 import { uiActionsService } from '../services/kibana_services';
 
-const parentApiIsCompatible = async (
-  parentApi: unknown
-): Promise<PresentationContainer | undefined> => {
-  const { apiIsPresentationContainer } = await import('@kbn/presentation-containers');
-  // we cannot have an async type check, so return the casted parentApi rather than a boolean
-  return apiIsPresentationContainer(parentApi) ? (parentApi as PresentationContainer) : undefined;
-};
-
 export const registerCreateImageAction = () => {
   uiActionsService.registerAction<EmbeddableApiContext>({
     id: ADD_IMAGE_EMBEDDABLE_ACTION_ID,
     getIconType: () => 'image',
     isCompatible: async ({ embeddable: parentApi }) => {
-      return Boolean(await parentApiIsCompatible(parentApi));
+      return apiCanAddNewPanel(parentApi);
     },
     execute: async ({ embeddable: parentApi }) => {
-      const presentationContainerParent = await parentApiIsCompatible(parentApi);
-      if (!presentationContainerParent) throw new IncompatibleActionError();
-
+      if (!apiCanAddNewPanel(parentApi)) throw new IncompatibleActionError();
       const { openImageEditor } = await import('../components/image_editor/open_image_editor');
       try {
-        const imageConfig = await openImageEditor({ parentApi: presentationContainerParent });
+        const imageConfig = await openImageEditor({ parentApi });
 
-        presentationContainerParent.addNewPanel({
+        parentApi.addNewPanel({
           panelType: IMAGE_EMBEDDABLE_TYPE,
           initialState: { imageConfig },
         });
@@ -54,4 +43,9 @@ export const registerCreateImageAction = () => {
   });
 
   uiActionsService.attachAction('ADD_PANEL_TRIGGER', ADD_IMAGE_EMBEDDABLE_ACTION_ID);
+  if (uiActionsService.hasTrigger('ADD_CANVAS_ELEMENT_TRIGGER')) {
+    // Because Canvas is not enabled in Serverless, this trigger might not be registered - only attach
+    // the create action if the Canvas-specific trigger does indeed exist.
+    uiActionsService.attachAction('ADD_CANVAS_ELEMENT_TRIGGER', ADD_IMAGE_EMBEDDABLE_ACTION_ID);
+  }
 };
diff --git a/src/plugins/image_embeddable/public/components/image_editor/open_image_editor.tsx b/src/plugins/image_embeddable/public/components/image_editor/open_image_editor.tsx
@@ -8,7 +8,8 @@
 
 import React from 'react';
 
-import { PresentationContainer, tracksOverlays } from '@kbn/presentation-containers';
+import { CanAddNewPanel } from '@kbn/presentation-publishing';
+import { tracksOverlays } from '@kbn/presentation-containers';
 import { toMountPoint } from '@kbn/react-kibana-mount';
 import { FilesContext } from '@kbn/shared-ux-file-context';
 
@@ -22,7 +23,7 @@ export const openImageEditor = async ({
   parentApi,
   initialImageConfig,
 }: {
-  parentApi: PresentationContainer;
+  parentApi: CanAddNewPanel;
   initialImageConfig?: ImageConfig;
 }): Promise<ImageConfig> => {
   const { ImageEditorFlyout } = await import('./image_editor_flyout');
