🏷️ Add palettes to the minimal set of frameAPI to load

x-pack/plugins/lens/public/editor_frame_service/editor_frame/state_helpers.ts

@@ -7,6 +7,7 @@
 
 import { SavedObjectReference } from 'kibana/public';
 import { Ast } from '@kbn/interpreter/common';
+import { PaletteRegistry } from 'src/plugins/charts/public';
 import {
  Datasource,
  DatasourcePublicAPI,
@@ -74,7 +75,8 @@ export function createDatasourceLayers(
 export async function persistedStateToExpression(
  datasources: Record<string, Datasource>,
  visualizations: Record<string, Visualization>,
- doc: Document
+ doc: Document,
+ palettes: PaletteRegistry
 ): Promise<{ ast: Ast | null; errors: ErrorMessage[] | undefined }> {
  const {
  state: { visualization: visualizationState, datasourceStates: persistedDatasourceStates },
@@ -117,7 +119,7 @@ export async function persistedStateToExpression(
  datasourceStates[datasourceId].state,
  visualization,
  visualizationState,
- { datasourceLayers }
+ { datasourceLayers, availablePalettes: palettes }
  );
 
  return {
@@ -139,7 +141,7 @@ export const validateDatasourceAndVisualization = (
  currentDatasourceState: unknown | null,
  currentVisualization: Visualization | null,
  currentVisualizationState: unknown | undefined,
- frameAPI: Pick<FramePublicAPI, 'datasourceLayers'>
+ frameAPI: Pick<FramePublicAPI, 'datasourceLayers' | 'activeData' | 'availablePalettes'>
 ): ErrorMessage[] | undefined => {
  const layersGroups = currentVisualizationState
  ? currentVisualization

x-pack/plugins/lens/public/editor_frame_service/embeddable/embeddable.test.tsx

@@ -23,6 +23,7 @@ import { AttributeService, ViewMode } from '../../../../../../src/plugins/embedd
 import { LensAttributeService } from '../../lens_attribute_service';
 import { OnSaveProps } from '../../../../../../src/plugins/saved_objects/public/save_modal';
 import { act } from 'react-dom/test-utils';
+import { chartPluginMock } from 'src/plugins/charts/public/mocks';
 
 jest.mock('../../../../../../src/plugins/inspector/public/', () => ({
  isAvailable: false,
@@ -125,6 +126,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  {} as LensEmbeddableInput
  );
@@ -157,6 +159,7 @@ describe('embeddable', () => {
  },
  errors: [{ shortMessage: '', longMessage: 'my validation error' }],
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  {} as LensEmbeddableInput
  );
@@ -197,6 +200,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  {} as LensEmbeddableInput
  );
@@ -232,6 +236,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  { id: '123' } as LensEmbeddableInput
  );
@@ -273,6 +278,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  { id: '123' } as LensEmbeddableInput
  );
@@ -309,6 +315,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  { id: '123' } as LensEmbeddableInput
  );
@@ -359,6 +366,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  input
  );
@@ -409,6 +417,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  input
  );
@@ -458,6 +467,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  input
  );
@@ -496,6 +506,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  { id: '123' } as LensEmbeddableInput
  );
@@ -534,6 +545,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  { id: '123' } as LensEmbeddableInput
  );
@@ -572,6 +584,7 @@ describe('embeddable', () => {
  },
  errors: undefined,
  }),
+ palettes: chartPluginMock.createPaletteRegistry(),
  },
  { id: '123', timeRange, query, filters } as LensEmbeddableInput
  );

x-pack/plugins/lens/public/editor_frame_service/embeddable/embeddable.tsx

@@ -17,7 +17,7 @@ import {
  TimeRange,
  IndexPattern,
 } from 'src/plugins/data/public';
-import { PaletteOutput } from 'src/plugins/charts/public';
+import { PaletteOutput, PaletteRegistry } from 'src/plugins/charts/public';
 
 import { Subscription } from 'rxjs';
 import { toExpression, Ast } from '@kbn/interpreter/common';
@@ -78,8 +78,10 @@ export interface LensEmbeddableOutput extends EmbeddableOutput {
 
 export interface LensEmbeddableDeps {
  attributeService: LensAttributeService;
+ palettes: PaletteRegistry;
  documentToExpression: (
- doc: Document
+ doc: Document,
+ palettes: PaletteRegistry
  ) => Promise<{ ast: Ast | null; errors: ErrorMessage[] | undefined }>;
  editable: boolean;
  indexPatternService: IndexPatternsContract;
@@ -229,7 +231,7 @@ export class Embeddable
  type: this.type,
  savedObjectId: (input as LensByReferenceInput)?.savedObjectId,
  };
- const { ast, errors } = await this.deps.documentToExpression(this.savedVis);
+ const { ast, errors } = await this.deps.documentToExpression(this.savedVis, this.deps.palettes);
  this.errors = errors;
  this.expression = ast ? toExpression(ast) : null;
  await this.initializeOutput();

x-pack/plugins/lens/public/editor_frame_service/embeddable/embeddable_factory.ts

@@ -9,6 +9,7 @@ import { Capabilities, HttpSetup } from 'kibana/public';
 import { i18n } from '@kbn/i18n';
 import { RecursiveReadonly } from '@kbn/utility-types';
 import { Ast } from '@kbn/interpreter/target/common';
+import { PaletteRegistry } from 'src/plugins/charts/public';
 import {
  IndexPatternsContract,
  TimefilterContract,
@@ -34,8 +35,10 @@ export interface LensEmbeddableStartServices {
  indexPatternService: IndexPatternsContract;
  uiActions?: UiActionsStart;
  documentToExpression: (
- doc: Document
+ doc: Document,
+ palettes: PaletteRegistry
  ) => Promise<{ ast: Ast | null; errors: ErrorMessage[] | undefined }>;
+ palettes: PaletteRegistry;
 }
 
 export class EmbeddableFactory implements EmbeddableFactoryDefinition {
@@ -85,6 +88,7 @@ export class EmbeddableFactory implements EmbeddableFactoryDefinition {
  coreHttp,
  attributeService,
  indexPatternService,
+ palettes,
  } = await this.getStartServices();
 
  const { Embeddable } = await import('../../async_services');
@@ -100,6 +104,7 @@ export class EmbeddableFactory implements EmbeddableFactoryDefinition {
  getTrigger: uiActions?.getTrigger,
  getTriggerCompatibleActions: uiActions?.getTriggerCompatibleActions,
  documentToExpression,
+ palettes,
  },
  input,
  parent

x-pack/plugins/lens/public/editor_frame_service/service.tsx

@@ -26,7 +26,7 @@ import { Document } from '../persistence/saved_object_store';
 import { mergeTables } from './merge_tables';
 import { EmbeddableFactory, LensEmbeddableStartServices } from './embeddable/embeddable_factory';
 import { UiActionsStart } from '../../../../../src/plugins/ui_actions/public';
-import { ChartsPluginSetup } from '../../../../../src/plugins/charts/public';
+import { ChartsPluginSetup, PaletteRegistry } from '../../../../../src/plugins/charts/public';
 import { DashboardStart } from '../../../../../src/plugins/dashboard/public';
 import { LensAttributeService } from '../lens_attribute_service';
 
@@ -72,15 +72,20 @@ export class EditorFrameService {
  * This is an asynchronous process and should only be triggered once for a saved object.
  * @param doc parsed Lens saved object
  */
- private documentToExpression = async (doc: Document) => {
+ private documentToExpression = async (doc: Document, palettes: PaletteRegistry) => {
  const [resolvedDatasources, resolvedVisualizations] = await Promise.all([
  collectAsyncDefinitions(this.datasources),
  collectAsyncDefinitions(this.visualizations),
  ]);
 
  const { persistedStateToExpression } = await import('../async_services');
 
- return await persistedStateToExpression(resolvedDatasources, resolvedVisualizations, doc);
+ return await persistedStateToExpression(
+ resolvedDatasources,
+ resolvedVisualizations,
+ doc,
+ palettes
+ );
  };
 
  public setup(
@@ -101,6 +106,7 @@ export class EditorFrameService {
  documentToExpression: this.documentToExpression,
  indexPatternService: deps.data.indexPatterns,
  uiActions: deps.uiActions,
+ palettes: await plugins.charts.palettes.getPalettes(),
  };
  };
 

x-pack/plugins/lens/public/types.ts

@@ -358,7 +358,7 @@ export interface LensMultiTable {
 
 export interface VisualizationConfigProps<T = unknown> {
  layerId: string;
- frame: Pick<FramePublicAPI, 'datasourceLayers' | 'activeData'>;
+ frame: Pick<FramePublicAPI, 'datasourceLayers' | 'activeData' | 'availablePalettes'>;
  state: T;
 }
 

x-pack/plugins/lens/public/xy_visualization/color_assignment.ts

@@ -95,7 +95,7 @@ export function getColorAssignments(
 
 export function getAccessorColorConfig(
  colorAssignments: ColorAssignments,
- frame: FramePublicAPI,
+ frame: Pick<FramePublicAPI, 'datasourceLayers'>,
  layer: XYLayerConfig,
  paletteService: PaletteRegistry
 ): AccessorConfig[] {