[canvas] Canvas parent API should implement HasDisableTriggers interface (#183949)

React embeddables should get `disableTriggers` state from parent API,
not serialized state.
 PR updates canvas parent API to implement HasDisableTriggers interface.

---------

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

packages/presentation/presentation_publishing/index.ts

@@ -48,7 +48,11 @@ export {
   type HasAppContext,
   type EmbeddableAppContext,
 } from './interfaces/has_app_context';
-export { apiHasDisableTriggers, type HasDisableTriggers } from './interfaces/has_disable_triggers';
+export {
+  apiHasDisableTriggers,
+  areTriggersDisabled,
+  type HasDisableTriggers,
+} from './interfaces/has_disable_triggers';
 export { hasEditCapabilities, type HasEditCapabilities } from './interfaces/has_edit_capabilities';
 export {
   apiHasExecutionContext,

packages/presentation/presentation_publishing/interfaces/has_disable_triggers.ts

@@ -6,6 +6,8 @@
  * Side Public License, v 1.
  */
 
+import { apiHasParentApi } from './has_parent_api';
+
 export interface HasDisableTriggers {
   disableTriggers: boolean;
 }
@@ -13,3 +15,14 @@ export interface HasDisableTriggers {
 export const apiHasDisableTriggers = (api: unknown | null): api is HasDisableTriggers => {
   return Boolean(api && typeof (api as HasDisableTriggers).disableTriggers === 'boolean');
 };
+
+export function areTriggersDisabled(api?: unknown) {
+  function getDisabledTriggers(thisApi?: unknown) {
+    return apiHasDisableTriggers(thisApi) ? thisApi.disableTriggers : false;
+  }
+
+  return (
+    getDisabledTriggers(api) ||
+    getDisabledTriggers(apiHasParentApi(api) ? api.parentApi : undefined)
+  );
+}

x-pack/plugins/canvas/canvas_plugin_src/renderers/embeddable/embeddable.tsx

@@ -15,8 +15,9 @@ import {
   ReactEmbeddableRenderer,
 } from '@kbn/embeddable-plugin/public';
 import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render';
-import React, { FC, useMemo } from 'react';
+import React, { FC } from 'react';
 import ReactDOM from 'react-dom';
+import { omit } from 'lodash';
 import { pluginServices } from '../../../public/services';
 import { CANVAS_EMBEDDABLE_CLASSNAME } from '../../../common/lib';
 import { RendererStrings } from '../../../i18n';
@@ -54,21 +55,18 @@ const renderReactEmbeddable = ({
   core: CoreStart;
 }) => {
   // wrap in functional component to allow usage of hooks
-  const RendererWrapper: FC<{ canvasApi: CanvasContainerApi }> = ({ canvasApi }) => {
+  const RendererWrapper: FC<{}> = () => {
     const getAppContext = useGetAppContext(core);
 
-    useMemo(() => {
-      canvasApi.getAppContext = getAppContext;
-    }, [canvasApi, getAppContext]);
-
     return (
       <ReactEmbeddableRenderer
         type={type}
         maybeId={uuid}
         getParentApi={(): CanvasContainerApi => ({
           ...container,
+          getAppContext,
           getSerializedStateForChild: () => ({
-            rawState: input,
+            rawState: omit(input, 'disableTriggers'),
           }),
         })}
         key={`${type}_${uuid}`}
@@ -91,7 +89,7 @@ const renderReactEmbeddable = ({
         className={CANVAS_EMBEDDABLE_CLASSNAME}
         style={{ width: '100%', height: '100%', cursor: 'auto' }}
       >
-        <RendererWrapper canvasApi={container} />
+        <RendererWrapper />
       </div>
     </KibanaRenderContextProvider>
   );

x-pack/plugins/canvas/public/components/hooks/use_canvas_api.tsx

@@ -48,6 +48,7 @@ export const useCanvasApi: () => CanvasContainerApi = () => {
       }) => {
         createNewEmbeddable(panelType, initialState);
       },
+      disableTriggers: true,
       /**
        * getSerializedStateForChild is left out here because we cannot access the state here. That method
        * is injected in `x-pack/plugins/canvas/canvas_plugin_src/renderers/embeddable/embeddable.tsx`

x-pack/plugins/canvas/types/embeddables.ts

@@ -8,7 +8,7 @@
 import type { TimeRange } from '@kbn/es-query';
 import { Filter } from '@kbn/es-query';
 import { EmbeddableInput as Input } from '@kbn/embeddable-plugin/common';
-import { HasAppContext, PublishesViewMode } from '@kbn/presentation-publishing';
+import { HasAppContext, HasDisableTriggers, PublishesViewMode } from '@kbn/presentation-publishing';
 import { CanAddNewPanel, HasSerializedChildState } from '@kbn/presentation-containers';
 
 export type EmbeddableInput = Input & {
@@ -19,5 +19,6 @@ export type EmbeddableInput = Input & {
 
 export type CanvasContainerApi = PublishesViewMode &
   CanAddNewPanel &
+  HasDisableTriggers &
   HasSerializedChildState &
   Partial<HasAppContext>;

x-pack/plugins/maps/public/trigger_actions/filter_by_map_extent/action.ts

@@ -6,7 +6,12 @@
  */
 
 import { i18n } from '@kbn/i18n';
-import { type EmbeddableApiContext, apiHasType, apiIsOfType } from '@kbn/presentation-publishing';
+import {
+  type EmbeddableApiContext,
+  apiHasType,
+  apiIsOfType,
+  areTriggersDisabled,
+} from '@kbn/presentation-publishing';
 import { createAction } from '@kbn/ui-actions-plugin/public';
 import { apiHasVisualizeConfig } from '@kbn/visualizations-plugin/public';
 import { type FilterByMapExtentActionApi } from './types';
@@ -53,7 +58,7 @@ export const filterByMapExtentAction = createAction<EmbeddableApiContext>({
     return 'filter';
   },
   isCompatible: async ({ embeddable }: EmbeddableApiContext) => {
-    if (!isApiCompatible(embeddable) || embeddable.disableTriggers) return false;
+    if (!isApiCompatible(embeddable) || areTriggersDisabled(embeddable)) return false;
     return (
       apiIsOfType(embeddable, MAP_SAVED_OBJECT_TYPE) ||
       (apiHasVisualizeConfig(embeddable) && isLegacyMapApi(embeddable))