improve lens lazy loading (#79292)
This commit is contained in:
parent
66878b4285
commit
b66de2ce1d
|
@ -21,4 +21,5 @@ export * from './xy_visualization/xy_visualization';
|
|||
export * from './indexpattern_datasource/indexpattern';
|
||||
|
||||
export * from './editor_frame_service/editor_frame';
|
||||
export * from './editor_frame_service/embeddable';
|
||||
export * from './app_plugin/mounter';
|
||||
|
|
|
@ -5,3 +5,5 @@
|
|||
*/
|
||||
|
||||
export * from './editor_frame';
|
||||
export * from './state_helpers';
|
||||
export * from './state_management';
|
||||
|
|
|
@ -26,7 +26,6 @@ import { VIS_EVENT_TO_TRIGGER } from '../../../../../../src/plugins/visualizatio
|
|||
import { coreMock, httpServiceMock } from '../../../../../../src/core/public/mocks';
|
||||
import { IBasePath } from '../../../../../../src/core/public';
|
||||
import { AttributeService } from '../../../../../../src/plugins/dashboard/public';
|
||||
import { Ast } from '@kbn/interpreter/common';
|
||||
import { LensAttributeService } from '../../lens_attribute_service';
|
||||
|
||||
jest.mock('../../../../../../src/plugins/inspector/public/', () => ({
|
||||
|
@ -103,8 +102,14 @@ describe('embeddable', () => {
|
|||
indexPatternService: {} as IndexPatternsContract,
|
||||
editable: true,
|
||||
getTrigger,
|
||||
documentToExpression: () => Promise.resolve({} as Ast),
|
||||
toExpressionString: () => 'my | expression',
|
||||
documentToExpression: () =>
|
||||
Promise.resolve({
|
||||
type: 'expression',
|
||||
chain: [
|
||||
{ type: 'function', function: 'my', arguments: {} },
|
||||
{ type: 'function', function: 'expression', arguments: {} },
|
||||
],
|
||||
}),
|
||||
},
|
||||
{} as LensEmbeddableInput
|
||||
);
|
||||
|
@ -112,7 +117,8 @@ describe('embeddable', () => {
|
|||
embeddable.render(mountpoint);
|
||||
|
||||
expect(expressionRenderer).toHaveBeenCalledTimes(1);
|
||||
expect(expressionRenderer.mock.calls[0][0]!.expression).toEqual('my | expression');
|
||||
expect(expressionRenderer.mock.calls[0][0]!.expression).toEqual(`my
|
||||
| expression`);
|
||||
});
|
||||
|
||||
it('should re-render if new input is pushed', async () => {
|
||||
|
@ -129,8 +135,14 @@ describe('embeddable', () => {
|
|||
indexPatternService: {} as IndexPatternsContract,
|
||||
editable: true,
|
||||
getTrigger,
|
||||
documentToExpression: () => Promise.resolve({} as Ast),
|
||||
toExpressionString: () => 'my | expression',
|
||||
documentToExpression: () =>
|
||||
Promise.resolve({
|
||||
type: 'expression',
|
||||
chain: [
|
||||
{ type: 'function', function: 'my', arguments: {} },
|
||||
{ type: 'function', function: 'expression', arguments: {} },
|
||||
],
|
||||
}),
|
||||
},
|
||||
{ id: '123' } as LensEmbeddableInput
|
||||
);
|
||||
|
@ -162,8 +174,14 @@ describe('embeddable', () => {
|
|||
indexPatternService: {} as IndexPatternsContract,
|
||||
editable: true,
|
||||
getTrigger,
|
||||
documentToExpression: () => Promise.resolve({} as Ast),
|
||||
toExpressionString: () => 'my | expression',
|
||||
documentToExpression: () =>
|
||||
Promise.resolve({
|
||||
type: 'expression',
|
||||
chain: [
|
||||
{ type: 'function', function: 'my', arguments: {} },
|
||||
{ type: 'function', function: 'expression', arguments: {} },
|
||||
],
|
||||
}),
|
||||
},
|
||||
input
|
||||
);
|
||||
|
@ -208,8 +226,14 @@ describe('embeddable', () => {
|
|||
indexPatternService: {} as IndexPatternsContract,
|
||||
editable: true,
|
||||
getTrigger,
|
||||
documentToExpression: () => Promise.resolve({} as Ast),
|
||||
toExpressionString: () => 'my | expression',
|
||||
documentToExpression: () =>
|
||||
Promise.resolve({
|
||||
type: 'expression',
|
||||
chain: [
|
||||
{ type: 'function', function: 'my', arguments: {} },
|
||||
{ type: 'function', function: 'expression', arguments: {} },
|
||||
],
|
||||
}),
|
||||
},
|
||||
input
|
||||
);
|
||||
|
@ -237,8 +261,14 @@ describe('embeddable', () => {
|
|||
indexPatternService: {} as IndexPatternsContract,
|
||||
editable: true,
|
||||
getTrigger,
|
||||
documentToExpression: () => Promise.resolve({} as Ast),
|
||||
toExpressionString: () => 'my | expression',
|
||||
documentToExpression: () =>
|
||||
Promise.resolve({
|
||||
type: 'expression',
|
||||
chain: [
|
||||
{ type: 'function', function: 'my', arguments: {} },
|
||||
{ type: 'function', function: 'expression', arguments: {} },
|
||||
],
|
||||
}),
|
||||
},
|
||||
{ id: '123' } as LensEmbeddableInput
|
||||
);
|
||||
|
@ -270,8 +300,14 @@ describe('embeddable', () => {
|
|||
indexPatternService: {} as IndexPatternsContract,
|
||||
editable: true,
|
||||
getTrigger,
|
||||
documentToExpression: () => Promise.resolve({} as Ast),
|
||||
toExpressionString: () => 'my | expression',
|
||||
documentToExpression: () =>
|
||||
Promise.resolve({
|
||||
type: 'expression',
|
||||
chain: [
|
||||
{ type: 'function', function: 'my', arguments: {} },
|
||||
{ type: 'function', function: 'expression', arguments: {} },
|
||||
],
|
||||
}),
|
||||
},
|
||||
{ id: '123', timeRange, query, filters } as LensEmbeddableInput
|
||||
);
|
||||
|
@ -311,8 +347,14 @@ describe('embeddable', () => {
|
|||
indexPatternService: {} as IndexPatternsContract,
|
||||
editable: true,
|
||||
getTrigger,
|
||||
documentToExpression: () => Promise.resolve({} as Ast),
|
||||
toExpressionString: () => 'my | expression',
|
||||
documentToExpression: () =>
|
||||
Promise.resolve({
|
||||
type: 'expression',
|
||||
chain: [
|
||||
{ type: 'function', function: 'my', arguments: {} },
|
||||
{ type: 'function', function: 'expression', arguments: {} },
|
||||
],
|
||||
}),
|
||||
},
|
||||
{ id: '123', timeRange, query, filters } as LensEmbeddableInput
|
||||
);
|
||||
|
|
|
@ -18,7 +18,7 @@ import {
|
|||
import { ExecutionContextSearch } from 'src/plugins/expressions';
|
||||
|
||||
import { Subscription } from 'rxjs';
|
||||
import { Ast } from '@kbn/interpreter/common';
|
||||
import { toExpression, Ast } from '@kbn/interpreter/common';
|
||||
import {
|
||||
ExpressionRendererEvent,
|
||||
ReactExpressionRendererType,
|
||||
|
@ -59,7 +59,6 @@ export interface LensEmbeddableOutput extends EmbeddableOutput {
|
|||
export interface LensEmbeddableDeps {
|
||||
attributeService: LensAttributeService;
|
||||
documentToExpression: (doc: Document) => Promise<Ast | null>;
|
||||
toExpressionString: (astObj: Ast, type?: string) => string;
|
||||
editable: boolean;
|
||||
indexPatternService: IndexPatternsContract;
|
||||
expressionRenderer: ReactExpressionRendererType;
|
||||
|
@ -135,7 +134,7 @@ export class Embeddable
|
|||
savedObjectId: (input as LensByReferenceInput)?.savedObjectId,
|
||||
};
|
||||
const expression = await this.deps.documentToExpression(this.savedVis);
|
||||
this.expression = expression ? this.deps.toExpressionString(expression) : null;
|
||||
this.expression = expression ? toExpression(expression) : null;
|
||||
await this.initializeOutput();
|
||||
this.isInitialized = true;
|
||||
if (this.domNode) {
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
import { Capabilities, HttpSetup } from 'kibana/public';
|
||||
import { i18n } from '@kbn/i18n';
|
||||
import { RecursiveReadonly } from '@kbn/utility-types';
|
||||
import { toExpression, Ast } from '@kbn/interpreter/target/common';
|
||||
import { Ast } from '@kbn/interpreter/target/common';
|
||||
import {
|
||||
IndexPatternsContract,
|
||||
TimefilterContract,
|
||||
|
@ -17,7 +17,7 @@ import {
|
|||
EmbeddableFactoryDefinition,
|
||||
IContainer,
|
||||
} from '../../../../../../src/plugins/embeddable/public';
|
||||
import { Embeddable, LensByReferenceInput, LensEmbeddableInput } from './embeddable';
|
||||
import { LensByReferenceInput, LensEmbeddableInput } from './embeddable';
|
||||
import { DOC_TYPE } from '../../persistence';
|
||||
import { UiActionsStart } from '../../../../../../src/plugins/ui_actions/public';
|
||||
import { Document } from '../../persistence/saved_object_store';
|
||||
|
@ -83,6 +83,8 @@ export class EmbeddableFactory implements EmbeddableFactoryDefinition {
|
|||
indexPatternService,
|
||||
} = await this.getStartServices();
|
||||
|
||||
const { Embeddable } = await import('../../async_services');
|
||||
|
||||
return new Embeddable(
|
||||
{
|
||||
attributeService,
|
||||
|
@ -93,7 +95,6 @@ export class EmbeddableFactory implements EmbeddableFactoryDefinition {
|
|||
basePath: coreHttp.basePath,
|
||||
getTrigger: uiActions?.getTrigger,
|
||||
documentToExpression,
|
||||
toExpressionString: toExpression,
|
||||
},
|
||||
input,
|
||||
parent
|
||||
|
|
|
@ -0,0 +1,7 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License;
|
||||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
|
||||
export * from './embeddable';
|
|
@ -25,10 +25,8 @@ import { Document } from '../persistence/saved_object_store';
|
|||
import { mergeTables } from './merge_tables';
|
||||
import { formatColumn } from './format_column';
|
||||
import { EmbeddableFactory, LensEmbeddableStartServices } from './embeddable/embeddable_factory';
|
||||
import { getActiveDatasourceIdFromDoc } from './editor_frame/state_management';
|
||||
import { UiActionsStart } from '../../../../../src/plugins/ui_actions/public';
|
||||
import { DashboardStart } from '../../../../../src/plugins/dashboard/public';
|
||||
import { persistedStateToExpression } from './editor_frame/state_helpers';
|
||||
import { LensAttributeService } from '../lens_attribute_service';
|
||||
|
||||
export interface EditorFrameSetupPlugins {
|
||||
|
@ -77,6 +75,8 @@ export class EditorFrameService {
|
|||
collectAsyncDefinitions(this.visualizations),
|
||||
]);
|
||||
|
||||
const { persistedStateToExpression } = await import('../async_services');
|
||||
|
||||
return await persistedStateToExpression(resolvedDatasources, resolvedVisualizations, doc);
|
||||
}
|
||||
|
||||
|
@ -133,7 +133,7 @@ export class EditorFrameService {
|
|||
const firstDatasourceId = Object.keys(resolvedDatasources)[0];
|
||||
const firstVisualizationId = Object.keys(resolvedVisualizations)[0];
|
||||
|
||||
const { EditorFrame } = await import('../async_services');
|
||||
const { EditorFrame, getActiveDatasourceIdFromDoc } = await import('../async_services');
|
||||
|
||||
render(
|
||||
<I18nProvider>
|
||||
|
|
Loading…
Reference in a new issue