Use saved object references for dashboard drilldowns (elastic#82602) (e…

…lastic#83293)

docs/development/plugins/embeddable/server/kibana-plugin-plugins-embeddable-server.embeddablesetup.md

@@ -7,14 +7,13 @@
 <b>Signature:</b>
 
 ```typescript
-export interface EmbeddableSetup 
+export interface EmbeddableSetup extends PersistableStateService<EmbeddableStateWithType> 
 ```
 
 ## Properties
 
 |  Property | Type | Description |
 |  --- | --- | --- |
-|  [getAttributeService](./kibana-plugin-plugins-embeddable-server.embeddablesetup.getattributeservice.md) | <code>any</code> |  |
 |  [registerEmbeddableFactory](./kibana-plugin-plugins-embeddable-server.embeddablesetup.registerembeddablefactory.md) | <code>(factory: EmbeddableRegistryDefinition) =&gt; void</code> |  |
 |  [registerEnhancement](./kibana-plugin-plugins-embeddable-server.embeddablesetup.registerenhancement.md) | <code>(enhancement: EnhancementRegistryDefinition) =&gt; void</code> |  |
 

src/plugins/dashboard/common/embeddable/embeddable_references.test.ts

@@ -0,0 +1,87 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import {
+  ExtractDeps,
+  extractPanelsReferences,
+  InjectDeps,
+  injectPanelsReferences,
+} from './embeddable_references';
+import { createEmbeddablePersistableStateServiceMock } from '../../../embeddable/common/mocks';
+import { SavedDashboardPanel } from '../types';
+import { EmbeddableStateWithType } from '../../../embeddable/common';
+
+const embeddablePersistableStateService = createEmbeddablePersistableStateServiceMock();
+const deps: InjectDeps & ExtractDeps = {
+  embeddablePersistableStateService,
+};
+
+test('inject/extract panel references', () => {
+  embeddablePersistableStateService.extract.mockImplementationOnce((state) => {
+    const { HARDCODED_ID, ...restOfState } = (state as unknown) as Record<string, unknown>;
+    return {
+      state: restOfState as EmbeddableStateWithType,
+      references: [{ id: HARDCODED_ID as string, name: 'refName', type: 'type' }],
+    };
+  });
+
+  embeddablePersistableStateService.inject.mockImplementationOnce((state, references) => {
+    const ref = references.find((r) => r.name === 'refName');
+    return {
+      ...state,
+      HARDCODED_ID: ref!.id,
+    };
+  });
+
+  const savedDashboardPanel: SavedDashboardPanel = {
+    type: 'search',
+    embeddableConfig: {
+      HARDCODED_ID: 'IMPORTANT_HARDCODED_ID',
+    },
+    id: 'savedObjectId',
+    panelIndex: '123',
+    gridData: {
+      x: 0,
+      y: 0,
+      h: 15,
+      w: 15,
+      i: '123',
+    },
+    version: '7.0.0',
+  };
+
+  const [{ panel: extractedPanel, references }] = extractPanelsReferences(
+    [savedDashboardPanel],
+    deps
+  );
+  expect(extractedPanel.embeddableConfig).toEqual({});
+  expect(references).toMatchInlineSnapshot(`
+    Array [
+      Object {
+        "id": "IMPORTANT_HARDCODED_ID",
+        "name": "refName",
+        "type": "type",
+      },
+    ]
+  `);
+
+  const [injectedPanel] = injectPanelsReferences([extractedPanel], references, deps);
+
+  expect(injectedPanel).toEqual(savedDashboardPanel);
+});

src/plugins/dashboard/common/embeddable/embeddable_references.ts

@@ -0,0 +1,82 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { omit } from 'lodash';
+import {
+  convertSavedDashboardPanelToPanelState,
+  convertPanelStateToSavedDashboardPanel,
+} from './embeddable_saved_object_converters';
+import { SavedDashboardPanel } from '../types';
+import { SavedObjectReference } from '../../../../core/types';
+import { EmbeddablePersistableStateService } from '../../../embeddable/common/types';
+
+export interface InjectDeps {
+  embeddablePersistableStateService: EmbeddablePersistableStateService;
+}
+
+export function injectPanelsReferences(
+  panels: SavedDashboardPanel[],
+  references: SavedObjectReference[],
+  deps: InjectDeps
+): SavedDashboardPanel[] {
+  const result: SavedDashboardPanel[] = [];
+  for (const panel of panels) {
+    const embeddableState = convertSavedDashboardPanelToPanelState(panel);
+    embeddableState.explicitInput = omit(
+      deps.embeddablePersistableStateService.inject(
+        { ...embeddableState.explicitInput, type: panel.type },
+        references
+      ),
+      'type'
+    );
+    result.push(convertPanelStateToSavedDashboardPanel(embeddableState, panel.version));
+  }
+  return result;
+}
+
+export interface ExtractDeps {
+  embeddablePersistableStateService: EmbeddablePersistableStateService;
+}
+
+export function extractPanelsReferences(
+  panels: SavedDashboardPanel[],
+  deps: ExtractDeps
+): Array<{ panel: SavedDashboardPanel; references: SavedObjectReference[] }> {
+  const result: Array<{ panel: SavedDashboardPanel; references: SavedObjectReference[] }> = [];
+
+  for (const panel of panels) {
+    const embeddable = convertSavedDashboardPanelToPanelState(panel);
+    const {
+      state: embeddableInputWithExtractedReferences,
+      references,
+    } = deps.embeddablePersistableStateService.extract({
+      ...embeddable.explicitInput,
+      type: embeddable.type,
+    });
+    embeddable.explicitInput = omit(embeddableInputWithExtractedReferences, 'type');
+
+    const newPanel = convertPanelStateToSavedDashboardPanel(embeddable, panel.version);
+    result.push({
+      panel: newPanel,
+      references,
+    });
+  }
+
+  return result;
+}

src/plugins/dashboard/public/application/lib/embeddable_saved_object_converters.test.ts → src/plugins/dashboard/common/embeddable/embeddable_saved_object_converters.test.ts

@@ -21,9 +21,8 @@ import {
   convertSavedDashboardPanelToPanelState,
   convertPanelStateToSavedDashboardPanel,
 } from './embeddable_saved_object_converters';
-import { SavedDashboardPanel } from '../../types';
-import { DashboardPanelState } from '../embeddable';
-import { EmbeddableInput } from '../../../../embeddable/public';
+import { SavedDashboardPanel, DashboardPanelState } from '../types';
+import { EmbeddableInput } from '../../../embeddable/common/types';
 
 test('convertSavedDashboardPanelToPanelState', () => {
   const savedDashboardPanel: SavedDashboardPanel = {
@@ -135,3 +134,24 @@ test('convertPanelStateToSavedDashboardPanel will not add an undefined id when n
   const converted = convertPanelStateToSavedDashboardPanel(dashboardPanel, '8.0.0');
   expect(converted.hasOwnProperty('id')).toBe(false);
 });
+
+test('convertPanelStateToSavedDashboardPanel will not leave title as part of embeddable config', () => {
+  const dashboardPanel: DashboardPanelState = {
+    gridData: {
+      x: 0,
+      y: 0,
+      h: 15,
+      w: 15,
+      i: '123',
+    },
+    explicitInput: {
+      id: '123',
+      title: 'title',
+    } as EmbeddableInput,
+    type: 'search',
+  };
+
+  const converted = convertPanelStateToSavedDashboardPanel(dashboardPanel, '8.0.0');
+  expect(converted.embeddableConfig.hasOwnProperty('title')).toBe(false);
+  expect(converted.title).toBe('title');
+});

src/plugins/dashboard/public/application/lib/embeddable_saved_object_converters.ts → src/plugins/dashboard/common/embeddable/embeddable_saved_object_converters.ts

@@ -17,9 +17,8 @@
  * under the License.
  */
 import { omit } from 'lodash';
-import { SavedDashboardPanel } from '../../types';
-import { DashboardPanelState } from '../embeddable';
-import { SavedObjectEmbeddableInput } from '../../embeddable_plugin';
+import { DashboardPanelState, SavedDashboardPanel } from '../types';
+import { SavedObjectEmbeddableInput } from '../../../embeddable/common/';
 
 export function convertSavedDashboardPanelToPanelState(
   savedDashboardPanel: SavedDashboardPanel
@@ -49,7 +48,7 @@ export function convertPanelStateToSavedDashboardPanel(
     type: panelState.type,
     gridData: panelState.gridData,
     panelIndex: panelState.explicitInput.id,
-    embeddableConfig: omit(panelState.explicitInput, ['id', 'savedObjectId']),
+    embeddableConfig: omit(panelState.explicitInput, ['id', 'savedObjectId', 'title']),
     ...(customTitle && { title: customTitle }),
     ...(savedObjectId !== undefined && { id: savedObjectId }),
   };