Skip to content

Commit

Permalink
[8.x] remove reactEmbeddableRegistryHasKey usage from canvas (#203256) (
Browse files Browse the repository at this point in the history 
#203653)

# Backport

This will backport the following commits from `main` to `8.x`:
- [remove reactEmbeddableRegistryHasKey usage from canvas
(#203256)](#203256)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Nathan
Reese","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-12-10T17:26:45Z","message":"remove
reactEmbeddableRegistryHasKey usage from canvas (#203256)\n\nPart of
https://github.com/elastic/kibana/issues/203250\r\n\r\nRemoves
`reactEmbeddableRegistryHasKey` usage from
canvas\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<[email protected]>\r\nCo-authored-by:
Elastic Machine
<[email protected]>","sha":"da93119780520740510c78b659609c049d275903","branchLabelMapping":{"^v9.0.0$":"main","^v8.18.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Team:Presentation","release_note:skip","v9.0.0","project:embeddableRebuild","backport:version","v8.18.0"],"title":"remove
reactEmbeddableRegistryHasKey usage from
canvas","number":203256,"url":"https://github.com/elastic/kibana/pull/203256","mergeCommit":{"message":"remove
reactEmbeddableRegistryHasKey usage from canvas (#203256)\n\nPart of
https://github.com/elastic/kibana/issues/203250\r\n\r\nRemoves
`reactEmbeddableRegistryHasKey` usage from
canvas\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<[email protected]>\r\nCo-authored-by:
Elastic Machine
<[email protected]>","sha":"da93119780520740510c78b659609c049d275903"}},"sourceBranch":"main","suggestedTargetBranches":["8.x"],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/203256","number":203256,"mergeCommit":{"message":"remove
reactEmbeddableRegistryHasKey usage from canvas (#203256)\n\nPart of
https://github.com/elastic/kibana/issues/203250\r\n\r\nRemoves
`reactEmbeddableRegistryHasKey` usage from
canvas\r\n\r\n---------\r\n\r\nCo-authored-by: kibanamachine
<[email protected]>\r\nCo-authored-by:
Elastic Machine
<[email protected]>","sha":"da93119780520740510c78b659609c049d275903"}},{"branch":"8.x","label":"v8.18.0","branchLabelMappingKey":"^v8.18.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: Nathan Reese <[email protected]>
  • Loading branch information
@kibanamachine @nreese
kibanamachine and nreese authored Dec 10, 2024
1 parent d223cd7 commit afec01e
Showing 1 changed file with 16 additions and 142 deletions.
158 changes: 16 additions & 142 deletions x-pack/plugins/canvas/canvas_plugin_src/renderers/embeddable/embeddable.tsx
View file
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 afec01e

Please sign in to comment.