[8.16] [Discover] [Embeddable] Fix Discover session embeddable drilldown (#211678)

src/plugins/discover/kibana.jsonc

@@ -42,7 +42,8 @@
       "observabilityAIAssistant",
       "aiops",
       "fieldsMetadata",
-      "logsDataAccess"
+      "logsDataAccess",
+      "embeddableEnhanced"
     ],
     "requiredBundles": ["kibanaUtils", "kibanaReact", "unifiedSearch", "savedObjects"],
     "extraPublicDirs": ["common"]

src/plugins/discover/public/build_services.ts

@@ -59,6 +59,7 @@ import type { AiopsPluginStart } from '@kbn/aiops-plugin/public';
 import type { DataVisualizerPluginStart } from '@kbn/data-visualizer-plugin/public';
 import type { FieldsMetadataPublicStart } from '@kbn/fields-metadata-plugin/public';
 import { LogsDataAccessPluginStart } from '@kbn/logs-data-access-plugin/public';
+import type { EmbeddableEnhancedPluginStart } from '@kbn/embeddable-enhanced-plugin/public';
 import type { DiscoverStartPlugins } from './types';
 import type { DiscoverContextAppLocator } from './application/context/services/locator';
 import type { DiscoverSingleDocLocator } from './application/doc/locator';
@@ -135,6 +136,7 @@ export interface DiscoverServices {
   ebtManager: DiscoverEBTManager;
   fieldsMetadata?: FieldsMetadataPublicStart;
   logsDataAccess?: LogsDataAccessPluginStart;
+  embeddableEnhanced?: EmbeddableEnhancedPluginStart;
 }
 
 export const buildServices = memoize(
@@ -226,6 +228,7 @@ export const buildServices = memoize(
       ebtManager,
       fieldsMetadata: plugins.fieldsMetadata,
       logsDataAccess: plugins.logsDataAccess,
+      embeddableEnhanced: plugins.embeddableEnhanced,
     };
   }
 );

src/plugins/discover/public/embeddable/constants.ts

@@ -7,8 +7,9 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-import { SavedSearchAttributes } from '@kbn/saved-search-plugin/common';
+import type { SavedSearchAttributes } from '@kbn/saved-search-plugin/common';
 import type { Trigger } from '@kbn/ui-actions-plugin/public';
+import type { SearchEmbeddableSerializedState } from './types';
 
 export { SEARCH_EMBEDDABLE_TYPE } from '@kbn/discover-utils';
 
@@ -37,9 +38,10 @@ export const EDITABLE_SAVED_SEARCH_KEYS: Readonly<Array<keyof SavedSearchAttribu
 ] as const;
 
 /** This constant refers to the dashboard panel specific state */
-export const EDITABLE_PANEL_KEYS = [
+export const EDITABLE_PANEL_KEYS: Readonly<Array<keyof SearchEmbeddableSerializedState>> = [
   'title', // panel title
   'description', // panel description
   'timeRange', // panel custom time range
   'hidePanelTitles', // panel hidden title
+  'enhancements', // panel enhancements (e.g. drilldowns)
 ] as const;

src/plugins/discover/public/embeddable/get_search_embeddable_factory.tsx

@@ -20,6 +20,7 @@ import { i18n } from '@kbn/i18n';
 import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
 import {
   FetchContext,
+  getUnchangingComparator,
   initializeTimeRange,
   initializeTitles,
   useBatchedPublishingSubjects,
@@ -89,6 +90,13 @@ export const getSearchEmbeddableFactory = ({
       /** Build API */
       const { titlesApi, titleComparators, serializeTitles } = initializeTitles(initialState);
       const timeRange = initializeTimeRange(initialState);
+      const dynamicActionsApi =
+        discoverServices.embeddableEnhanced?.initializeReactEmbeddableDynamicActions(
+          uuid,
+          () => titlesApi.panelTitle.getValue(),
+          initialState
+        );
+      const maybeStopDynamicActions = dynamicActionsApi?.startDynamicActions();
       const searchEmbeddable = await initializeSearchEmbeddableApi(initialState, {
         discoverServices,
       });
@@ -114,6 +122,7 @@ export const getSearchEmbeddableFactory = ({
           ...titlesApi,
           ...searchEmbeddable.api,
           ...timeRange.api,
+          ...dynamicActionsApi?.dynamicActionsApi,
           ...initializeEditApi({
             uuid,
             parentApi,
@@ -183,14 +192,23 @@ export const getSearchEmbeddableFactory = ({
               savedSearch: searchEmbeddable.api.savedSearch$.getValue(),
               serializeTitles,
               serializeTimeRange: timeRange.serialize,
+              serializeDynamicActions: dynamicActionsApi?.serializeDynamicActions,
               savedObjectId: savedObjectId$.getValue(),
               discoverServices,
             }),
           getInspectorAdapters: () => searchEmbeddable.stateManager.inspectorAdapters.getValue(),
+          supportedTriggers: () => {
+            // No triggers are supported, but this is still required to pass the drilldown
+            // compatibilty check and ensure top-level drilldowns (e.g. URL) work as expected
+            return [];
+          },
         },
         {
           ...titleComparators,
           ...timeRange.comparators,
+          ...(dynamicActionsApi?.dynamicActionsComparator ?? {
+            enhancements: getUnchangingComparator(),
+          }),
           ...searchEmbeddable.comparators,
           savedObjectId: [savedObjectId$, (value) => savedObjectId$.next(value)],
           savedObjectTitle: [defaultPanelTitle$, (value) => defaultPanelTitle$.next(value)],
@@ -213,6 +231,7 @@ export const getSearchEmbeddableFactory = ({
             return () => {
               searchEmbeddable.cleanup();
               unsubscribeFromFetch();
+              maybeStopDynamicActions?.stopDynamicActions();
             };
           }, []);
 

src/plugins/discover/public/embeddable/types.ts

@@ -7,13 +7,14 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-import { DataTableRecord } from '@kbn/discover-utils/types';
+import type { DataTableRecord } from '@kbn/discover-utils/types';
 import type { DefaultEmbeddableApi } from '@kbn/embeddable-plugin/public';
-import { HasInspectorAdapters } from '@kbn/inspector-plugin/public';
-import {
+import type { HasInspectorAdapters } from '@kbn/inspector-plugin/public';
+import type {
   EmbeddableApiContext,
   HasEditCapabilities,
   HasInPlaceLibraryTransforms,
+  HasSupportedTriggers,
   PublishesBlockingError,
   PublishesDataLoading,
   PublishesDataViews,
@@ -24,14 +25,16 @@ import {
   SerializedTimeRange,
   SerializedTitles,
 } from '@kbn/presentation-publishing';
-import {
+import type {
   SavedSearch,
   SavedSearchAttributes,
   SerializableSavedSearch,
 } from '@kbn/saved-search-plugin/common/types';
-import { DataTableColumnsMeta } from '@kbn/unified-data-table';
-import { BehaviorSubject } from 'rxjs';
-import { EDITABLE_SAVED_SEARCH_KEYS } from './constants';
+import type { DataTableColumnsMeta } from '@kbn/unified-data-table';
+import type { BehaviorSubject } from 'rxjs';
+import type { DynamicActionsSerializedState } from '@kbn/embeddable-enhanced-plugin/public/plugin';
+import type { HasDynamicActions } from '@kbn/embeddable-enhanced-plugin/public';
+import type { EDITABLE_SAVED_SEARCH_KEYS } from './constants';
 
 export type SearchEmbeddableState = Pick<
   SerializableSavedSearch,
@@ -63,6 +66,7 @@ export type SearchEmbeddableSerializedAttributes = Omit<
 
 export type SearchEmbeddableSerializedState = SerializedTitles &
   SerializedTimeRange &
+  Partial<DynamicActionsSerializedState> &
   Partial<Pick<SavedSearchAttributes, (typeof EDITABLE_SAVED_SEARCH_KEYS)[number]>> & {
     // by value
     attributes?: SavedSearchAttributes & { references: SavedSearch['references'] };
@@ -72,7 +76,8 @@ export type SearchEmbeddableSerializedState = SerializedTitles &
 
 export type SearchEmbeddableRuntimeState = SearchEmbeddableSerializedAttributes &
   SerializedTitles &
-  SerializedTimeRange & {
+  SerializedTimeRange &
+  Partial<DynamicActionsSerializedState> & {
     savedObjectTitle?: string;
     savedObjectId?: string;
     savedObjectDescription?: string;
@@ -93,7 +98,9 @@ export type SearchEmbeddableApi = DefaultEmbeddableApi<
   HasInPlaceLibraryTransforms &
   HasTimeRange &
   HasInspectorAdapters &
-  Partial<HasEditCapabilities & PublishesSavedObjectId>;
+  Partial<HasEditCapabilities & PublishesSavedObjectId> &
+  HasDynamicActions &
+  HasSupportedTriggers;
 
 export interface PublishesSavedSearch {
   savedSearch$: PublishingSubject<SavedSearch>;

src/plugins/discover/public/embeddable/utils/serialization_utils.test.ts

@@ -121,6 +121,7 @@ describe('Serialization utils', () => {
         savedSearch,
         serializeTitles: jest.fn(),
         serializeTimeRange: jest.fn(),
+        serializeDynamicActions: jest.fn(),
         discoverServices: discoverServiceMock,
       });
 
@@ -159,6 +160,7 @@ describe('Serialization utils', () => {
           savedSearch,
           serializeTitles: jest.fn(),
           serializeTimeRange: jest.fn(),
+          serializeDynamicActions: jest.fn(),
           savedObjectId: 'test-id',
           discoverServices: discoverServiceMock,
         });
@@ -178,6 +180,7 @@ describe('Serialization utils', () => {
           savedSearch: { ...savedSearch, sampleSize: 500, sort: [['order_date', 'asc']] },
           serializeTitles: jest.fn(),
           serializeTimeRange: jest.fn(),
+          serializeDynamicActions: jest.fn(),
           savedObjectId: 'test-id',
           discoverServices: discoverServiceMock,
         });

src/plugins/discover/public/embeddable/utils/serialization_utils.ts

@@ -20,6 +20,7 @@ import {
 } from '@kbn/saved-search-plugin/common';
 import { SavedSearchUnwrapResult } from '@kbn/saved-search-plugin/public';
 
+import type { DynamicActionsSerializedState } from '@kbn/embeddable-enhanced-plugin/public/plugin';
 import { extract, inject } from '../../../common/embeddable/search_inject_extract';
 import { DiscoverServices } from '../../build_services';
 import {
@@ -77,6 +78,7 @@ export const serializeState = async ({
   savedSearch,
   serializeTitles,
   serializeTimeRange,
+  serializeDynamicActions,
   savedObjectId,
   discoverServices,
 }: {
@@ -85,6 +87,7 @@ export const serializeState = async ({
   savedSearch: SavedSearch;
   serializeTitles: () => SerializedTitles;
   serializeTimeRange: () => SerializedTimeRange;
+  serializeDynamicActions: (() => DynamicActionsSerializedState) | undefined;
   savedObjectId?: string;
   discoverServices: DiscoverServices;
 }): Promise<SerializedPanelState<SearchEmbeddableSerializedState>> => {
@@ -110,6 +113,7 @@ export const serializeState = async ({
         // Serialize the current dashboard state into the panel state **without** updating the saved object
         ...serializeTitles(),
         ...serializeTimeRange(),
+        ...serializeDynamicActions?.(),
         ...overwriteState,
       },
       // No references to extract for by-reference embeddable since all references are stored with by-reference saved object

src/plugins/discover/public/types.ts

@@ -42,6 +42,7 @@ import type { AiopsPluginStart } from '@kbn/aiops-plugin/public';
 import type { DataVisualizerPluginStart } from '@kbn/data-visualizer-plugin/public';
 import type { FieldsMetadataPublicStart } from '@kbn/fields-metadata-plugin/public';
 import type { LogsDataAccessPluginStart } from '@kbn/logs-data-access-plugin/public';
+import type { EmbeddableEnhancedPluginStart } from '@kbn/embeddable-enhanced-plugin/public';
 import { DiscoverAppLocator } from '../common';
 import { DiscoverCustomizationContext } from './customizations';
 import { type DiscoverContainerProps } from './components/discover_container';
@@ -172,4 +173,5 @@ export interface DiscoverStartPlugins {
   unifiedSearch: UnifiedSearchPublicPluginStart;
   urlForwarding: UrlForwardingStart;
   usageCollection?: UsageCollectionSetup;
+  embeddableEnhanced?: EmbeddableEnhancedPluginStart;
 }

src/plugins/discover/tsconfig.json

@@ -101,7 +101,8 @@
     "@kbn/react-hooks",
     "@kbn/logs-data-access-plugin",
     "@kbn/core-lifecycle-browser",
-    "@kbn/esql-ast"
+    "@kbn/esql-ast",
+    "@kbn/embeddable-enhanced-plugin"
   ],
   "exclude": [
     "target/**/*"

test/functional/services/dashboard/drilldowns_manage.ts

@@ -78,7 +78,11 @@ export function DashboardDrilldownsManageProvider({ getService }: FtrProviderCon
     }: {
       drilldownName: string;
       destinationURLTemplate: string;
-      trigger: 'VALUE_CLICK_TRIGGER' | 'SELECT_RANGE_TRIGGER' | 'IMAGE_CLICK_TRIGGER';
+      trigger:
+        | 'VALUE_CLICK_TRIGGER'
+        | 'SELECT_RANGE_TRIGGER'
+        | 'IMAGE_CLICK_TRIGGER'
+        | 'CONTEXT_MENU_TRIGGER';
     }) {
       await this.fillInDrilldownName(drilldownName);
       await this.selectTriggerIfNeeded(trigger);
@@ -94,7 +98,11 @@ export function DashboardDrilldownsManageProvider({ getService }: FtrProviderCon
     }
 
     async selectTriggerIfNeeded(
-      trigger: 'VALUE_CLICK_TRIGGER' | 'SELECT_RANGE_TRIGGER' | 'IMAGE_CLICK_TRIGGER'
+      trigger:
+        | 'VALUE_CLICK_TRIGGER'
+        | 'SELECT_RANGE_TRIGGER'
+        | 'IMAGE_CLICK_TRIGGER'
+        | 'CONTEXT_MENU_TRIGGER'
     ) {
       if (await testSubjects.exists(`triggerPicker`)) {
         const container = await testSubjects.find(`triggerPicker-${trigger}`);

x-pack/test/functional/apps/discover/saved_search_embeddable.ts

@@ -13,11 +13,20 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const dataGrid = getService('dataGrid');
   const dashboardAddPanel = getService('dashboardAddPanel');
   const dashboardPanelActions = getService('dashboardPanelActions');
+  const dashboardDrilldownPanelActions = getService('dashboardDrilldownPanelActions');
+  const dashboardDrilldownsManage = getService('dashboardDrilldownsManage');
   const filterBar = getService('filterBar');
   const esArchiver = getService('esArchiver');
   const kibanaServer = getService('kibanaServer');
   const testSubjects = getService('testSubjects');
-  const { common, dashboard, header } = getPageObjects(['common', 'dashboard', 'header']);
+  const find = getService('find');
+  const queryBar = getService('queryBar');
+  const { common, dashboard, header, discover } = getPageObjects([
+    'common',
+    'dashboard',
+    'header',
+    'discover',
+  ]);
 
   describe('discover saved search embeddable', () => {
     before(async () => {
@@ -106,5 +115,39 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
       await header.waitUntilLoadingHasFinished();
       await testSubjects.missingOrFail('embeddableError');
     });
+
+    it('should support URL drilldown', async () => {
+      await addSearchEmbeddableToDashboard();
+      await dashboardDrilldownPanelActions.clickCreateDrilldown();
+      const drilldownName = 'URL drilldown';
+      const urlTemplate =
+        "{{kibanaUrl}}/app/discover#/?_g=(filters:!(),refreshInterval:(pause:!t,value:0),time:(from:'{{context.panel.timeRange.from}}',to:'{{context.panel.timeRange.to}}'))" +
+        "&_a=(columns:!(_source),filters:{{rison context.panel.filters}},index:'{{context.panel.indexPatternId}}',interval:auto," +
+        "query:(language:{{context.panel.query.language}},query:'clientip:239.190.189.77'),sort:!())";
+      await testSubjects.click('actionFactoryItem-URL_DRILLDOWN');
+      await dashboardDrilldownsManage.fillInDashboardToURLDrilldownWizard({
+        drilldownName,
+        destinationURLTemplate: urlTemplate,
+        trigger: 'CONTEXT_MENU_TRIGGER',
+      });
+      await testSubjects.click('urlDrilldownAdditionalOptions');
+      await testSubjects.click('urlDrilldownOpenInNewTab');
+      await dashboardDrilldownsManage.saveChanges();
+      await dashboard.saveDashboard('Dashboard with URL drilldown', {
+        saveAsNew: true,
+        waitDialogIsClosed: true,
+        exitFromEditMode: true,
+      });
+      await browser.refresh();
+      await header.waitUntilLoadingHasFinished();
+      await dashboard.waitForRenderComplete();
+      await dashboardPanelActions.openContextMenu();
+      await find.clickByLinkText(drilldownName);
+      await discover.waitForDiscoverAppOnScreen();
+      await header.waitUntilLoadingHasFinished();
+      await discover.waitForDocTableLoadingComplete();
+      expect(await queryBar.getQueryString()).to.be('clientip:239.190.189.77');
+      expect(await discover.getHitCount()).to.be('6');
+    });
   });
 }