remove reactEmbeddableRegistryHasKey usage from canvas (#203256)

Part of https://github.com/elastic/kibana/issues/203250

Removes `reactEmbeddableRegistryHasKey` usage from canvas

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
Nathan Reese 2024-12-10 10:26:45 -07:00 committed by GitHub
parent e706b6689d
commit da93119780
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -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';
@ -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,
@ -98,34 +85,10 @@ 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(),
@ -133,112 +96,23 @@ export const embeddableRendererFactory = (
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);
});
},
});
};