[dashboards as code] drilldown schemas

examples/embeddable_examples/server/plugin.ts

@@ -39,7 +39,9 @@ export class EmbeddableExamplesPlugin implements Plugin<void, void, SetupDeps, S
       },
     });
 
-    embeddable.registerTransforms(BOOK_EMBEDDABLE_TYPE, bookTransforms);
+    embeddable.registerTransforms(BOOK_EMBEDDABLE_TYPE, {
+      getTransforms: () => bookTransforms,
+    });
 
     return {};
   }

packages/kbn-optimizer/limits.yml

@@ -30,7 +30,7 @@ pageLoadAssetSize:
   cps: 5918
   crossClusterReplication: 12662
   customIntegrations: 11715
-  dashboard: 19000
+  dashboard: 19957
   dashboardEnhanced: 12159
   dashboardMarkdown: 4994
   data: 500179
@@ -50,9 +50,9 @@ pageLoadAssetSize:
   discoverShared: 2322
   elasticAssistant: 338870
   elasticAssistantSharedState: 4881
-  embeddable: 18432
+  embeddable: 17521
   embeddableAlertsTable: 6524
-  embeddableEnhanced: 7912
+  embeddableEnhanced: 4488
   enterpriseSearch: 40244
   entityStore: 1755
   esql: 18224
@@ -83,7 +83,7 @@ pageLoadAssetSize:
   graph: 9924
   grokdebugger: 5484
   home: 13560
-  imageEmbeddable: 6000
+  imageEmbeddable: 6727
   indexLifecycleManagement: 29818
   indexManagement: 35522
   inference: 10368

src/platform/plugins/private/image_embeddable/common/constants.ts

@@ -9,3 +9,5 @@
 
 export const IMAGE_EMBEDDABLE_TYPE = 'image';
 export const ADD_IMAGE_EMBEDDABLE_ACTION_ID = 'create_image_embeddable';
+export const IMAGE_CLICK_TRIGGER = 'IMAGE_CLICK_TRIGGER';
+export const IMAGE_EMBEDDABLE_SUPPORTED_TRIGGERS = [IMAGE_CLICK_TRIGGER];

src/platform/plugins/private/image_embeddable/common/index.ts

@@ -0,0 +1,10 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the "Elastic License
+ * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side
+ * Public License v 1"; you may not use this file except in compliance with, at
+ * your election, the "Elastic License 2.0", the "GNU Affero General Public
+ * License v3.0 only", or the "Server Side Public License, v 1".
+ */
+
+export { IMAGE_CLICK_TRIGGER, IMAGE_EMBEDDABLE_SUPPORTED_TRIGGERS } from './constants';

src/platform/plugins/private/image_embeddable/common/transforms.ts

@@ -7,41 +7,22 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 import type { Reference } from '@kbn/content-management-utils';
-import type {
-  TransformEnhancementsIn,
-  TransformEnhancementsOut,
-} from '@kbn/embeddable-plugin/common';
+import type { DrilldownTransforms } from '@kbn/embeddable-plugin/common';
 import { transformTitlesOut } from '@kbn/presentation-publishing';
+import { flow } from 'lodash';
 import type { ImageEmbeddableState } from '../server';
 
-export function getTransforms(
-  transformEnhancementsIn: TransformEnhancementsIn,
-  transformEnhancementsOut: TransformEnhancementsOut
-) {
+export function getTransforms(drilldownTransforms: DrilldownTransforms) {
   return {
     transformIn: (state: ImageEmbeddableState) => {
-      const enhancementResult = state.enhancements
-        ? transformEnhancementsIn(state.enhancements)
-        : { state: undefined, references: [] };
-
-      return {
-        state: {
-          ...state,
-          ...(enhancementResult.state ? { enhancements: enhancementResult.state } : {}),
-        },
-        references: enhancementResult.references,
-      };
+      return drilldownTransforms.transformIn(state);
     },
     transformOut: (storedState: ImageEmbeddableState, references?: Reference[]) => {
-      const state = transformTitlesOut(storedState);
-      const enhancementsState = state.enhancements
-        ? transformEnhancementsOut(state.enhancements, references ?? [])
-        : undefined;
-
-      return {
-        ...state,
-        ...(enhancementsState ? { enhancements: enhancementsState } : {}),
-      };
+      const transformsFlow = flow(
+        transformTitlesOut<ImageEmbeddableState>,
+        (state: ImageEmbeddableState) => drilldownTransforms.transformOut(state, references)
+      );
+      return transformsFlow(storedState);
     },
   };
 }

src/platform/plugins/private/image_embeddable/kibana.jsonc

@@ -22,6 +22,7 @@
       "screenshotMode",
       "embeddableEnhanced"
     ],
-    "requiredBundles": []
+    "requiredBundles": [],
+    "extraPublicDirs": ["common"]
   }
 }

src/platform/plugins/private/image_embeddable/moon.yml

@@ -48,8 +48,8 @@ tags:
   - jest-unit-tests
 fileGroups:
   src:
-    - public/**/*
     - common/**/*
+    - public/**/*
     - server/**/*
     - '!target/**/*'
 tasks:

src/platform/plugins/private/image_embeddable/public/actions/image_click_trigger.ts

@@ -9,8 +9,7 @@
 
 import { i18n } from '@kbn/i18n';
 import type { Trigger } from '@kbn/ui-actions-plugin/public';
-
-export const IMAGE_CLICK_TRIGGER = 'IMAGE_CLICK_TRIGGER';
+import { IMAGE_CLICK_TRIGGER } from '../../common';
 
 export const imageClickTrigger: Trigger = {
   id: IMAGE_CLICK_TRIGGER,

src/platform/plugins/private/image_embeddable/public/actions/index.ts

@@ -7,4 +7,4 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-export * from './image_click_trigger';
+export { imageClickTrigger } from './image_click_trigger';

src/platform/plugins/private/image_embeddable/public/image_embeddable/get_image_embeddable_factory.tsx

@@ -18,11 +18,10 @@ import { openLazyFlyout } from '@kbn/presentation-util';
 import { initializeTitleManager, titleComparators } from '@kbn/presentation-publishing';
 
 import type { ImageEmbeddableState } from '../../server';
-import { IMAGE_CLICK_TRIGGER } from '../actions';
 import { ImageEmbeddable as ImageEmbeddableComponent } from '../components/image_embeddable';
 import type { FileImageMetadata } from '../imports';
 import { coreServices, filesService } from '../services/kibana_services';
-import { IMAGE_EMBEDDABLE_TYPE } from '../../common/constants';
+import { IMAGE_EMBEDDABLE_SUPPORTED_TRIGGERS, IMAGE_EMBEDDABLE_TYPE } from '../../common/constants';
 import type { ImageConfig, ImageEmbeddableApi } from '../types';
 
 export const getImageEmbeddableFactory = ({
@@ -35,7 +34,7 @@ export const getImageEmbeddableFactory = ({
     buildEmbeddable: async ({ initialState, finalizeApi, uuid, parentApi }) => {
       const titleManager = initializeTitleManager(initialState);
 
-      const dynamicActionsManager = embeddableEnhanced?.initializeEmbeddableDynamicActions(
+      const dynamicActionsManager = await embeddableEnhanced?.initializeEmbeddableDynamicActions(
         uuid,
         () => titleManager.api.title$.getValue(),
         initialState
@@ -66,7 +65,7 @@ export const getImageEmbeddableFactory = ({
         ),
         getComparators: () => {
           return {
-            ...(dynamicActionsManager?.comparators ?? { enhancements: 'skip' }),
+            ...(dynamicActionsManager?.comparators ?? { enhancements: 'skip', drilldowns: 'skip' }),
             ...titleComparators,
             imageConfig: 'deepEquality',
           };
@@ -83,7 +82,7 @@ export const getImageEmbeddableFactory = ({
         ...(dynamicActionsManager?.api ?? {}),
         ...unsavedChangesApi,
         dataLoading$,
-        supportedTriggers: () => [IMAGE_CLICK_TRIGGER],
+        supportedTriggers: () => IMAGE_EMBEDDABLE_SUPPORTED_TRIGGERS,
 
         onEdit: async () => {
           openLazyFlyout({

src/platform/plugins/private/image_embeddable/public/index.ts

@@ -9,7 +9,7 @@
 
 import { ImageEmbeddablePlugin } from './plugin';
 
-export { IMAGE_CLICK_TRIGGER } from './actions';
+export { IMAGE_CLICK_TRIGGER } from '../common';
 
 export function plugin() {
   return new ImageEmbeddablePlugin();

src/platform/plugins/private/image_embeddable/server/plugin.ts

@@ -15,10 +15,7 @@ import type { SetupDeps, StartDeps } from './types';
 export class ImageEmbeddablePlugin implements Plugin<void, void, SetupDeps, StartDeps> {
   setup(core: CoreSetup<StartDeps>, plugins: SetupDeps) {
     plugins.embeddable.registerTransforms(IMAGE_EMBEDDABLE_TYPE, {
-      ...getTransforms(
-        plugins.embeddable.transformEnhancementsIn,
-        plugins.embeddable.transformEnhancementsOut
-      ),
+      getTransforms,
       // TODO register schema when its ready to be public
     });
   }

src/platform/plugins/private/image_embeddable/server/schemas.ts

@@ -9,7 +9,9 @@
 
 import type { TypeOf } from '@kbn/config-schema';
 import { schema } from '@kbn/config-schema';
+import type { GetDrilldownsSchemaFnType } from '@kbn/embeddable-plugin/server';
 import { serializedTitlesSchema } from '@kbn/presentation-publishing-schemas';
+import { IMAGE_EMBEDDABLE_SUPPORTED_TRIGGERS } from '../common';
 
 const imageFileSrcSchema = schema.object({
   type: schema.literal('file'),
@@ -55,23 +57,25 @@ const imageConfigSchema = schema.object({
   backgroundColor: schema.maybe(schema.string()),
 });
 
-export const imageEmbeddableSchema = schema.allOf(
-  [
-    schema.object({
-      imageConfig: imageConfigSchema,
-      enhancements: schema.maybe(schema.any()),
-    }),
-    serializedTitlesSchema,
-  ],
-  {
-    meta: {
-      description: 'Image embeddable schema',
-    },
-  }
-);
+export function getImageEmbeddableSchema(getDrilldownsSchemas: GetDrilldownsSchemaFnType) {
+  return schema.allOf(
+    [
+      getDrilldownsSchemas(IMAGE_EMBEDDABLE_SUPPORTED_TRIGGERS),
+      schema.object({
+        imageConfig: imageConfigSchema,
+      }),
+      serializedTitlesSchema,
+    ],
+    {
+      meta: {
+        description: 'Image embeddable schema',
+      },
+    }
+  );
+}
 
 // TODO - snake_caseify all of these schemas
 
 export type ImageConfig = TypeOf<typeof imageConfigSchema>;
 export type ImageConfigState = TypeOf<typeof imageConfigSchema>;
-export type ImageEmbeddableState = TypeOf<typeof imageEmbeddableSchema>;
+export type ImageEmbeddableState = TypeOf<ReturnType<typeof getImageEmbeddableSchema>>;

src/platform/plugins/private/image_embeddable/tsconfig.json

@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "target/types"
   },
-  "include": ["public/**/*", "common/**/*", "server/**/*"],
+  "include": ["common/**/*", "public/**/*", "server/**/*"],
   "kbn_references": [
     "@kbn/core",
     "@kbn/embeddable-plugin",

src/platform/plugins/private/links/common/embeddable/transforms/get_options.ts

@@ -40,7 +40,7 @@ export function getOptions(type: LinkType, options: LinkOptions) {
         'boolean' && {
         use_time_range: (dashboardOptions as { useCurrentDateRange?: boolean }).useCurrentDateRange,
       }),
-    };
+    } as DashboardLink['options'];
   }
 
   const urlOptions = options as Required<ExternalLink>['options'];

src/platform/plugins/private/links/server/plugin.ts

@@ -50,7 +50,7 @@ export class LinksServerPlugin implements Plugin<object, object> {
     core.savedObjects.registerType<LinksState>(linksSavedObjectType);
 
     plugins.embeddable.registerTransforms(LINKS_EMBEDDABLE_TYPE, {
-      ...transforms,
+      getTransforms: () => transforms,
       // TODO register schema when its ready to be public
     });
 

src/platform/plugins/shared/controls/common/transforms/data_controls/register_data_control_transforms.ts

@@ -17,8 +17,10 @@ export const registerDataControlTransforms = (
   legacyRefNames: string[]
 ) => {
   embeddable.registerTransforms(type, {
-    transformIn: (state) => extractReferences(state, refName),
-    transformOut: (state, panelReferences, containerReferences, id) =>
-      injectReferences(id, state, legacyRefNames, panelReferences, containerReferences),
+    getTransforms: () => ({
+      transformIn: (state) => extractReferences(state, refName),
+      transformOut: (state, panelReferences, containerReferences, id) =>
+        injectReferences(id, state, legacyRefNames, panelReferences, containerReferences),
+    }),
   });
 };

src/platform/plugins/shared/dashboard/common/page_bundle_constants.ts

@@ -19,3 +19,6 @@ export const DEFAULT_DASHBOARD_NAVIGATION_OPTIONS = {
   use_time_range: true,
   use_filters: true,
 };
+
+// Do not change constant value - part of dashboard REST API
+export const DASHBOARD_DRILLDOWN_TYPE = 'dashboard_drilldown';

src/platform/plugins/shared/dashboard/moon.yml

@@ -113,6 +113,7 @@ dependsOn:
   - '@kbn/core-chrome-app-menu-components'
   - '@kbn/core-chrome-app-menu'
   - '@kbn/test-jest-helpers'
+  - '@kbn/image-embeddable-plugin'
 tags:
   - plugin
   - prod

src/platform/plugins/shared/dashboard/server/api/dashboard_state_schemas.ts

@@ -52,7 +52,9 @@ export const panelGridSchema = schema.object({
 export function getPanelSchema() {
   return schema.object({
     config: schema.oneOf([
-      ...((embeddableService ? embeddableService.getEmbeddableSchemas() : []) as [ObjectType<{}>]),
+      ...((embeddableService ? embeddableService.getAllEmbeddableSchemas() : []) as [
+        ObjectType<{}>
+      ]),
       schema.object(
         {},
         {

src/platform/plugins/shared/dashboard/server/api/scope_tooling.test.ts

@@ -28,10 +28,9 @@ describe('stripUnmappedKeys', () => {
   it('should not drop mapped panel types', () => {
     mockGetTransforms.mockImplementation(() => {
       return {
-        getSchema: () =>
-          schema.object({
-            foo: schema.string(),
-          }),
+        schema: schema.object({
+          foo: schema.string(),
+        }),
       };
     });
     const dashboardState = {
@@ -110,7 +109,7 @@ describe('stripUnmappedKeys', () => {
   it('should drop unmapped panel types when throwOnUnmappedPanel throws', () => {
     mockGetTransforms.mockImplementation(() => {
       return {
-        getSchema: () => schema.any(),
+        schema: schema.any(),
         throwOnUnmappedPanel: () => {
           throw new Error('Unmapped panel type');
         },
@@ -150,10 +149,9 @@ describe('stripUnmappedKeys', () => {
   it('should drop panel enhancements', () => {
     mockGetTransforms.mockImplementation(() => {
       return {
-        getSchema: () =>
-          schema.object({
-            foo: schema.string(),
-          }),
+        schema: schema.object({
+          foo: schema.string(),
+        }),
       };
     });
     const dashboardState = {
@@ -274,10 +272,9 @@ describe('throwOnUnmappedKeys', () => {
   it('should not throw when there are no unmapped keys', () => {
     mockGetTransforms.mockImplementation(() => {
       return {
-        getSchema: () =>
-          schema.object({
-            foo: schema.string(),
-          }),
+        schema: schema.object({
+          foo: schema.string(),
+        }),
       };
     });
     const dashboardState = {
@@ -324,7 +321,7 @@ describe('throwOnUnmappedKeys', () => {
   it('should throw when dashboard contains a panel with enhancements', () => {
     mockGetTransforms.mockImplementation(() => {
       return {
-        getSchema: () => schema.object({}),
+        schema: schema.object({}),
       };
     });
     const dashboardState = {