From 67ce18b6b01fefa3a0b5eec8d153931129fd34f9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Se=CC=81bastien=20Loix?= Date: Tue, 3 Nov 2020 17:15:30 +0100 Subject: [PATCH] Expose handler from plugin setup() to load the editor --- x-pack/plugins/runtime_fields/public/index.ts | 2 +- .../runtime_fields/public/load_editor.tsx | 50 +++++++++++++++++++ .../runtime_fields/public/plugin.test.ts | 50 +++++++++++++++++++ .../plugins/runtime_fields/public/plugin.ts | 5 +- .../runtime_fields/public/shared_imports.ts | 6 ++- x-pack/plugins/runtime_fields/public/types.ts | 9 +++- 6 files changed, 117 insertions(+), 5 deletions(-) create mode 100644 x-pack/plugins/runtime_fields/public/load_editor.tsx create mode 100644 x-pack/plugins/runtime_fields/public/plugin.test.ts diff --git a/x-pack/plugins/runtime_fields/public/index.ts b/x-pack/plugins/runtime_fields/public/index.ts index 98b018089bd37..0eab32c0b3d97 100644 --- a/x-pack/plugins/runtime_fields/public/index.ts +++ b/x-pack/plugins/runtime_fields/public/index.ts @@ -11,7 +11,7 @@ export { RuntimeFieldFormState, } from './components'; export { RUNTIME_FIELD_OPTIONS } from './constants'; -export { RuntimeField, RuntimeType } from './types'; +export { RuntimeField, RuntimeType, PluginSetup as RuntimeFieldsSetup } from './types'; export function plugin() { return new RuntimeFieldsPlugin(); diff --git a/x-pack/plugins/runtime_fields/public/load_editor.tsx b/x-pack/plugins/runtime_fields/public/load_editor.tsx new file mode 100644 index 0000000000000..9c1c9e3ba829e --- /dev/null +++ b/x-pack/plugins/runtime_fields/public/load_editor.tsx @@ -0,0 +1,50 @@ +/* + * 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. + */ +import React from 'react'; +import { CoreSetup, OverlayRef } from 'src/core/public'; + +import { toMountPoint, createKibanaReactContext } from './shared_imports'; +import { LoadEditorResponse, RuntimeField } from './types'; + +export interface OpenRuntimeFieldEditorProps { + onSave(field: RuntimeField): void; + defaultValue?: RuntimeField; +} + +export const getRuntimeFieldEditorLoader = (coreSetup: CoreSetup) => async (): Promise< + LoadEditorResponse +> => { + const { RuntimeFieldEditorFlyoutContent } = await import('./components'); + const [core] = await coreSetup.getStartServices(); + const { uiSettings, overlays, docLinks } = core; + const { Provider: KibanaReactContextProvider } = createKibanaReactContext({ uiSettings }); + + let overlayRef: OverlayRef | null = null; + + const openEditor = ({ onSave, defaultValue }: OpenRuntimeFieldEditorProps) => { + const onSaveField = (field: RuntimeField) => { + overlayRef?.close(); + onSave(field); + }; + + overlayRef = overlays.openFlyout( + toMountPoint( + + overlayRef?.close()} + docLinks={docLinks} + defaultValue={defaultValue} + /> + + ) + ); + }; + + return { + openEditor, + }; +}; diff --git a/x-pack/plugins/runtime_fields/public/plugin.test.ts b/x-pack/plugins/runtime_fields/public/plugin.test.ts new file mode 100644 index 0000000000000..918b18cf75a6c --- /dev/null +++ b/x-pack/plugins/runtime_fields/public/plugin.test.ts @@ -0,0 +1,50 @@ +/* + * 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. + */ + +import { CoreSetup } from 'src/core/public'; +import { coreMock } from 'src/core/public/mocks'; + +import { StartPlugins, PluginStart } from './types'; +import { RuntimeFieldsPlugin } from './plugin'; + +describe('RuntimeFieldsPlugin', () => { + const noop = () => {}; + let coreSetup: CoreSetup; + let plugin: RuntimeFieldsPlugin; + + beforeEach(() => { + plugin = new RuntimeFieldsPlugin(); + coreSetup = coreMock.createSetup(); + }); + + test('should return a handler to load the runtime field editor', async () => { + const setupApi = await plugin.setup(coreSetup, {}); + expect(setupApi.loadEditor).toBeDefined(); + }); + + test('once it is loaded it should expose a handler to open the editor', async () => { + const setupApi = await plugin.setup(coreSetup, {}); + const response = await setupApi.loadEditor(); + expect(response.openEditor).toBeDefined(); + }); + + test('should call core.overlays.openFlyout when opening the editor', async () => { + const openFlyout = jest.fn(); + const mockCore = { + overlays: { + openFlyout, + }, + uiSettings: {}, + }; + coreSetup.getStartServices = async () => [mockCore] as any; + const setupApi = await plugin.setup(coreSetup, {}); + const { openEditor } = await setupApi.loadEditor(); + + openEditor({ onSave: noop }); + + expect(openFlyout).toHaveBeenCalled(); + }); +}); diff --git a/x-pack/plugins/runtime_fields/public/plugin.ts b/x-pack/plugins/runtime_fields/public/plugin.ts index d893a1e181811..ebc8b98db66ba 100644 --- a/x-pack/plugins/runtime_fields/public/plugin.ts +++ b/x-pack/plugins/runtime_fields/public/plugin.ts @@ -6,11 +6,14 @@ import { Plugin, CoreSetup, CoreStart } from 'src/core/public'; import { PluginSetup, PluginStart, SetupPlugins, StartPlugins } from './types'; +import { getRuntimeFieldEditorLoader } from './load_editor'; export class RuntimeFieldsPlugin implements Plugin { public setup(core: CoreSetup, plugins: SetupPlugins): PluginSetup { - return {}; + return { + loadEditor: getRuntimeFieldEditorLoader(core), + }; } public start(core: CoreStart, plugins: StartPlugins) { diff --git a/x-pack/plugins/runtime_fields/public/shared_imports.ts b/x-pack/plugins/runtime_fields/public/shared_imports.ts index 8ce22a66b627b..200a68ab71031 100644 --- a/x-pack/plugins/runtime_fields/public/shared_imports.ts +++ b/x-pack/plugins/runtime_fields/public/shared_imports.ts @@ -16,4 +16,8 @@ export { fieldValidators } from '../../../../src/plugins/es_ui_shared/static/for export { TextField } from '../../../../src/plugins/es_ui_shared/static/forms/components'; -export { CodeEditor } from '../../../../src/plugins/kibana_react/public'; +export { + CodeEditor, + toMountPoint, + createKibanaReactContext, +} from '../../../../src/plugins/kibana_react/public'; diff --git a/x-pack/plugins/runtime_fields/public/types.ts b/x-pack/plugins/runtime_fields/public/types.ts index 9d1daa9eacb0e..2b094628b7f66 100644 --- a/x-pack/plugins/runtime_fields/public/types.ts +++ b/x-pack/plugins/runtime_fields/public/types.ts @@ -6,9 +6,14 @@ import { DataPublicPluginStart } from 'src/plugins/data/public'; import { RUNTIME_FIELD_TYPES } from './constants'; +import { OpenRuntimeFieldEditorProps } from './load_editor'; -// eslint-disable-next-line @typescript-eslint/no-empty-interface -export interface PluginSetup {} +export interface LoadEditorResponse { + openEditor(props: OpenRuntimeFieldEditorProps): void; +} +export interface PluginSetup { + loadEditor(): Promise; +} // eslint-disable-next-line @typescript-eslint/no-empty-interface export interface PluginStart {}