From 889e393f5214bd636f2c18f0bb7a3bf5fb407f84 Mon Sep 17 00:00:00 2001 From: bnechyporenko Date: Mon, 9 May 2022 20:35:49 +0200 Subject: [PATCH] Draft(WIP): Add reconfigure to plugin Signed-off-by: bnechyporenko --- packages/app/src/App.tsx | 6 ++++++ .../src/extensions/extensions.tsx | 18 +++++++++--------- packages/core-plugin-api/src/plugin/Plugin.tsx | 6 +++++- packages/core-plugin-api/src/plugin/types.ts | 1 + plugins/catalog/src/index.ts | 1 + plugins/catalog/src/plugin.ts | 8 ++++---- 6 files changed, 26 insertions(+), 14 deletions(-) diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index 4cf2c02e55..4c2d8aabcb 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -94,6 +94,7 @@ import { techDocsPage } from './components/techdocs/TechDocsPage'; import { ApacheAirflowPage } from '@backstage/plugin-apache-airflow'; import { PermissionedRoute } from '@backstage/plugin-permission-react'; import { catalogEntityCreatePermission } from '@backstage/plugin-catalog-common'; +import { CatalogPluginMetadata } from '@backstage/plugin-catalog'; const app = createApp({ apis, @@ -134,6 +135,11 @@ const app = createApp({ const AppProvider = app.getProvider(); const AppRouter = app.getRouter(); +catalogPlugin.reconfigure({ + createComponentTitle: 'Create!!', + supportButton: () =>
Contact Support
, +} as CatalogPluginMetadata); + const routes = ( diff --git a/packages/core-plugin-api/src/extensions/extensions.tsx b/packages/core-plugin-api/src/extensions/extensions.tsx index b4b5c0bdfc..408cf054e2 100644 --- a/packages/core-plugin-api/src/extensions/extensions.tsx +++ b/packages/core-plugin-api/src/extensions/extensions.tsx @@ -19,7 +19,7 @@ import { AnalyticsContext } from '../analytics/AnalyticsContext'; import { useApp } from '../app'; import { RouteRef, useRouteRef } from '../routing'; import { attachComponentData } from './componentData'; -import { Extension, BackstagePlugin, AnyMetadata } from '../plugin/types'; +import { Extension, BackstagePlugin } from '../plugin/types'; import { PluginErrorBoundary } from './PluginErrorBoundary'; /** @@ -73,13 +73,8 @@ export function createRoutableExtension< * variable for this extension. */ name?: string; - - /** - * - */ - metadata?: AnyMetadata; }): Extension { - const { component, mountPoint, name, metadata } = options; + const { component, mountPoint, name } = options; return createReactExtension({ component: { lazy: () => @@ -105,7 +100,7 @@ export function createRoutableExtension< } throw error; } - return ; + return ; }; const componentName = @@ -240,6 +235,11 @@ export function createReactExtension< | { id?: string } | undefined; + const metadata = plugin.getMetadata(); + const componentProperties = metadata + ? { ...props, metadata } + : { ...props }; + return ( }> @@ -250,7 +250,7 @@ export function createReactExtension< ...(mountPoint && { routeRef: mountPoint.id }), }} > - + diff --git a/packages/core-plugin-api/src/plugin/Plugin.tsx b/packages/core-plugin-api/src/plugin/Plugin.tsx index fdf4585462..6c4c77f58b 100644 --- a/packages/core-plugin-api/src/plugin/Plugin.tsx +++ b/packages/core-plugin-api/src/plugin/Plugin.tsx @@ -54,6 +54,10 @@ export class PluginImpl< return this.config.featureFlags?.slice() ?? []; } + getMetadata(): PluginMetadata { + return this.config.metadata!!; + } + get routes(): Routes { return this.config.routes ?? ({} as Routes); } @@ -67,7 +71,7 @@ export class PluginImpl< } reconfigure(metadata: PluginMetadata): BackstagePlugin { - this.config.metadata = metadata; + this.config.metadata = { ...this.config.metadata, ...metadata }; return this; } diff --git a/packages/core-plugin-api/src/plugin/types.ts b/packages/core-plugin-api/src/plugin/types.ts index 5a56d775b2..a640013c47 100644 --- a/packages/core-plugin-api/src/plugin/types.ts +++ b/packages/core-plugin-api/src/plugin/types.ts @@ -67,6 +67,7 @@ export type BackstagePlugin< * Returns all registered feature flags for this plugin. */ getFeatureFlags(): Iterable; + getMetadata(): PluginMetadata; provide(extension: Extension): T; reconfigure(metadata: PluginMetadata): BackstagePlugin; routes: Routes; diff --git a/plugins/catalog/src/index.ts b/plugins/catalog/src/index.ts index cfe4851d09..ca55bac335 100644 --- a/plugins/catalog/src/index.ts +++ b/plugins/catalog/src/index.ts @@ -53,6 +53,7 @@ export { RelatedEntitiesCard, } from './plugin'; +export type { CatalogPluginMetadata } from './plugin'; export type { DependencyOfComponentsCardProps } from './components/DependencyOfComponentsCard'; export type { DependsOnComponentsCardProps } from './components/DependsOnComponentsCard'; export type { DependsOnResourcesCardProps } from './components/DependsOnResourcesCard'; diff --git a/plugins/catalog/src/plugin.ts b/plugins/catalog/src/plugin.ts index a8a0951b5d..264b3bdaf9 100644 --- a/plugins/catalog/src/plugin.ts +++ b/plugins/catalog/src/plugin.ts @@ -32,6 +32,7 @@ import { storageApiRef, AnyMetadata, } from '@backstage/core-plugin-api'; +import { SupportButton } from '@backstage/core-components'; import { DefaultStarredEntitiesApi } from './apis'; import { AboutCardProps } from './components/AboutCard'; import { DefaultCatalogPageProps } from './components/CatalogPage'; @@ -47,14 +48,14 @@ import { rootRouteRef } from './routes'; export interface CatalogPluginMetadata extends AnyMetadata { createComponentTitle: string; - supportButton: () => Promise; + supportButton: () => JSX.Element; supportButtonText: string; } const metadata = { createComponentTitle: 'Create Component', - supportButton: () => - import('@backstage/core-components').then(m => m.SupportButton), + // eslint-disable-next-line new-cap + supportButton: () => SupportButton({}), supportButtonText: 'All your software catalog entities', } as CatalogPluginMetadata; @@ -96,7 +97,6 @@ export const CatalogIndexPage: (props: DefaultCatalogPageProps) => JSX.Element = name: 'CatalogIndexPage', component: () => import('./components/CatalogPage').then(m => m.CatalogPage), - metadata, mountPoint: rootRouteRef, }), );