Skip to content

Commit

Permalink
remove reactEmbeddableRegistryHasKey usage from canvas (elastic#203256)
Browse files Browse the repository at this point in the history
Part of elastic#203250

Removes `reactEmbeddableRegistryHasKey` usage from canvas

---------

Co-authored-by: kibanamachine <[email protected]>
Co-authored-by: Elastic Machine <[email protected]>
  • Loading branch information
3 people authored Dec 10, 2024
1 parent e706b66 commit da93119
Showing 1 changed file with 16 additions and 142 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,7 @@
*/

import { CoreStart } from '@kbn/core/public';
import {
EmbeddableFactory,
EmbeddableFactoryNotFoundError,
EmbeddablePanel,
IEmbeddable,
isErrorEmbeddable,
ReactEmbeddableRenderer,
} from '@kbn/embeddable-plugin/public';
import { ReactEmbeddableRenderer } from '@kbn/embeddable-plugin/public';
import { KibanaRenderContextProvider } from '@kbn/react-kibana-context-render';
import React, { FC } from 'react';
import ReactDOM from 'react-dom';
Expand All @@ -31,15 +24,9 @@ import { EmbeddableExpression } from '../../expression_types/embeddable';
import { StartDeps } from '../../plugin';
import { embeddableInputToExpression } from './embeddable_input_to_expression';
import { useGetAppContext } from './use_get_app_context';
import { embeddableService } from '../../../public/services/kibana_services';

const { embeddable: strings } = RendererStrings;

// registry of references to embeddables on the workpad
const embeddablesRegistry: {
[key: string]: IEmbeddable | Promise<IEmbeddable>;
} = {};

const renderReactEmbeddable = ({
type,
uuid,
Expand Down Expand Up @@ -98,147 +85,34 @@ const renderReactEmbeddable = ({
);
};

const renderEmbeddableFactory = (core: CoreStart, _plugins: StartDeps) => {
const EmbeddableRenderer: FC<{ embeddable: IEmbeddable }> = ({ embeddable }) => {
const getAppContext = useGetAppContext(core);

embeddable.getAppContext = getAppContext;

return <EmbeddablePanel embeddable={embeddable} />;
};

return (embeddableObject: IEmbeddable) => {
return (
<KibanaRenderContextProvider {...core}>
<div
className={CANVAS_EMBEDDABLE_CLASSNAME}
style={{ width: '100%', height: '100%', cursor: 'auto' }}
>
<EmbeddableRenderer embeddable={embeddableObject} />
</div>
</KibanaRenderContextProvider>
);
};
};

export const embeddableRendererFactory = (
core: CoreStart,
plugins: StartDeps
): RendererFactory<EmbeddableExpression<EmbeddableInput> & { canvasApi: CanvasContainerApi }> => {
const renderEmbeddable = renderEmbeddableFactory(core, plugins);
return () => ({
name: 'embeddable',
displayName: strings.getDisplayName(),
help: strings.getHelpDescription(),
reuseDomNode: true,
render: async (domNode, { input, embeddableType, canvasApi }, handlers) => {
const uniqueId = handlers.getElementId();
const isByValueEnabled = plugins.presentationUtil.labsService.isProjectEnabled(
'labs:canvas:byValueEmbeddable'
ReactDOM.render(
renderReactEmbeddable({
input,
handlers,
uuid: uniqueId,
type: embeddableType,
container: canvasApi,
core,
}),
domNode,
() => handlers.done()
);

if (embeddableService.reactEmbeddableRegistryHasKey(embeddableType)) {
/**
* Prioritize React embeddables
*/
ReactDOM.render(
renderReactEmbeddable({
input,
handlers,
uuid: uniqueId,
type: embeddableType,
container: canvasApi,
core,
}),
domNode,
() => handlers.done()
);

handlers.onDestroy(() => {
handlers.onEmbeddableDestroyed();
return ReactDOM.unmountComponentAtNode(domNode);
});
} else if (!embeddablesRegistry[uniqueId]) {
/**
* Handle legacy embeddables - embeddable does not exist in registry
*/
const factory = Array.from(plugins.embeddable.getEmbeddableFactories()).find(
(embeddableFactory) => embeddableFactory.type === embeddableType
) as EmbeddableFactory<EmbeddableInput>;

if (!factory) {
handlers.done();
throw new EmbeddableFactoryNotFoundError(embeddableType);
}

const embeddableInput = {
...input,
id: uniqueId,
executionContext: {
type: 'canvas',
},
};

const embeddablePromise = input.savedObjectId
? factory
.createFromSavedObject(input.savedObjectId, embeddableInput)
.then((embeddable) => {
// stores embeddable in registrey
embeddablesRegistry[uniqueId] = embeddable;
return embeddable;
})
: factory.create(embeddableInput).then((embeddable) => {
if (!embeddable || isErrorEmbeddable(embeddable)) {
return;
}
// stores embeddable in registry
embeddablesRegistry[uniqueId] = embeddable as IEmbeddable;
return embeddable;
});
embeddablesRegistry[uniqueId] = embeddablePromise as Promise<IEmbeddable>;

const embeddableObject = (await (async () => embeddablePromise)()) as IEmbeddable;

const palettes = await plugins.charts.palettes.getPalettes();

embeddablesRegistry[uniqueId] = embeddableObject;
ReactDOM.unmountComponentAtNode(domNode);

const subscription = embeddableObject.getInput$().subscribe(function (updatedInput) {
const updatedExpression = embeddableInputToExpression(
updatedInput,
embeddableType,
palettes,
isByValueEnabled
);

if (updatedExpression) {
handlers.onEmbeddableInputChange(updatedExpression);
}
});

ReactDOM.render(renderEmbeddable(embeddableObject), domNode, () => handlers.done());

handlers.onDestroy(() => {
subscription.unsubscribe();
handlers.onEmbeddableDestroyed();

delete embeddablesRegistry[uniqueId];

return ReactDOM.unmountComponentAtNode(domNode);
});
} else {
/**
* Handle legacy embeddables - embeddable already exists in registry
*/
const embeddable = embeddablesRegistry[uniqueId];

// updating embeddable input with changes made to expression or filters
if ('updateInput' in embeddable) {
embeddable.updateInput(input);
embeddable.reload();
}
}
handlers.onDestroy(() => {
handlers.onEmbeddableDestroyed();
return ReactDOM.unmountComponentAtNode(domNode);
});
},
});
};

0 comments on commit da93119

Please sign in to comment.