diff --git a/packages/frontend-plugin-api/src/alpha.ts b/packages/frontend-plugin-api/src/alpha.ts
index 9d73b8cc84..2251bfafb7 100644
--- a/packages/frontend-plugin-api/src/alpha.ts
+++ b/packages/frontend-plugin-api/src/alpha.ts
@@ -14,12 +14,6 @@
* limitations under the License.
*/
-/**
- * Alpha exports for plugin wrapper functionality.
- *
- * @alpha
- */
-
export { PluginWrapperBlueprint } from './blueprints/PluginWrapperBlueprint';
export {
type PluginWrapperApi,
diff --git a/plugins/app/src/apis/PluginWrapperApi/DefaultPluginWrapperApi.tsx b/plugins/app/src/apis/PluginWrapperApi/DefaultPluginWrapperApi.tsx
index 65c41ee2e2..7e602ee23f 100644
--- a/plugins/app/src/apis/PluginWrapperApi/DefaultPluginWrapperApi.tsx
+++ b/plugins/app/src/apis/PluginWrapperApi/DefaultPluginWrapperApi.tsx
@@ -15,7 +15,7 @@
*/
import { PluginWrapperApi } from '@backstage/frontend-plugin-api/alpha';
-import { ComponentType, ReactNode, useEffect, useState } from 'react';
+import { ComponentType, ReactNode, useEffect, useMemo, useState } from 'react';
type WrapperInput = {
loader: () => Promise<{ component: ComponentType<{ children: ReactNode }> }>;
@@ -86,17 +86,19 @@ export class DefaultPluginWrapperApi implements PluginWrapperApi {
throw error;
}
- if (!loadedWrappers) {
- return null;
- }
+ return useMemo(() => {
+ if (!loadedWrappers) {
+ return null;
+ }
- let content = props.children;
+ let current = props.children;
- for (const Wrapper of loadedWrappers) {
- content = {content};
- }
+ for (const Wrapper of loadedWrappers) {
+ current = {current};
+ }
- return <>{content}>;
+ return current;
+ }, [loadedWrappers, props.children]);
};
composedWrappers.set(pluginId, ComposedWrapper);