paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 48 Packages Projects Releases Wiki Activity

Merge pull request #26011 from backstage/rugvip/frontend-plugin

Browse Source 
frontend-plugin-api: renamed createPlugin to createFrontendPlugin
This commit is contained in:
Patrik Oldsberg
2024-08-14 16:38:14 +02:00
committed by GitHub
parent f90cdd6483 9b356dcaac
commit 1d40a3316f
38 changed files with 154 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/chilly-numbers-chew.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/frontend-plugin-api': patch
---
Renamed `createPlugin` to `createFrontendPlugin`. The old symbol is still exported but deprecated.
docs/frontend-system/architecture/15-plugins.md
+5 -5
View File
@@ -25,7 +25,7 @@ How to create a simple plugin
-->
```ts
export const myPlugin = createPlugin({
export const myPlugin = createFrontendPlugin({
id: 'my-plugin',
});
```
@@ -48,7 +48,7 @@ link to relevant docs
<!--
- Example of how this option is used in `createPlugin`
- Example of how this option is used in `createFrontendPlugin`
link to relevant docs
@@ -58,7 +58,7 @@ link to relevant docs
<!--
- Example of how this option is used in `createPlugin`
- Example of how this option is used in `createFrontendPlugin`
link to relevant docs
@@ -68,7 +68,7 @@ link to relevant docs
<!--
- Example of how this option is used in `createPlugin`
- Example of how this option is used in `createFrontendPlugin`
link to relevant docs
@@ -78,7 +78,7 @@ link to relevant docs
<!--
- Example of how this option is used in `createPlugin`
- Example of how this option is used in `createFrontendPlugin`
link to relevant docs
docs/frontend-system/architecture/36-routes.md
+6 -6
View File
@@ -42,7 +42,7 @@ The code snippet in the previous section does not indicate which plugin the rout
```tsx title="plugins/catalog/src/plugin.tsx"
import React from 'react';
import {
createPlugin,
createFrontendPlugin,
createPageExtension,
} from '@backstage/frontend-plugin-api';
import { indexRouteRef } from './routes';
@@ -55,7 +55,7 @@ const catalogIndexPage = createPageExtension({
loader: () => import('./components').then(m => <m.IndexPage />),
});
export default createPlugin({
export default createFrontendPlugin({
id: 'catalog',
// highlight-start
routes: {
@@ -196,7 +196,7 @@ Now the only thing left is to provide the page and external route via a plugin:
```tsx title="plugins/catalog/src/plugin.tsx"
import React from 'react';
import {
createPlugin,
createFrontendPlugin,
createPageExtension,
useRouteRef,
} from '@backstage/frontend-plugin-api';
@@ -208,7 +208,7 @@ const catalogIndexPage = createPageExtension({
loader: () => import('./components').then(m => <m.IndexPage />),
});
export default createPlugin({
export default createFrontendPlugin({
id: 'catalog',
routes: {
index: indexRouteRef,
@@ -404,7 +404,7 @@ Finally, see how a plugin can provide subroutes:
```tsx title="plugins/catalog/src/plugin.tsx"
import React from 'react';
import {
createPlugin,
createFrontendPlugin,
createPageExtension,
} from '@backstage/frontend-plugin-api';
import { indexRouteRef, detailsSubRouteRef } from './routes';
@@ -415,7 +415,7 @@ const catalogIndexPage = createPageExtension({
loader: () => import('./components').then(m => <m.IndexPage />),
});
export default createPlugin({
export default createFrontendPlugin({
id: 'catalog',
routes: {
index: indexRouteRef,
docs/frontend-system/architecture/50-naming-patterns.md
+2 -2
View File
@@ -23,7 +23,7 @@ Example:
```ts
// This declaration is only for internal usage in tests. This could also be a direct default export.
export const userSettingsPlugin = createPlugin({
export const userSettingsPlugin = createFrontendPlugin({
id: 'user-settings',
...
})
@@ -67,7 +67,7 @@ const catalogSearchResultListItem = SearchResultListItemBlueprint.make({
});
// Note that the extensions themselves are not exported, only the plugin instance
export const catalogPlugin = createPlugin({
export const catalogPlugin = createFrontendPlugin({
id: 'catalog',
extensions: [catalogEntityPage, catalogSearchResultListItem /* ... */],
});
docs/frontend-system/building-apps/08-migrating.md
+1 -1
View File
@@ -207,7 +207,7 @@ createApp({
Can be converted to the following plugin configuration:
```tsx
createPlugin({
createFrontendPlugin({
id: 'tech-radar',
// ...
featureFlags: [{ name: 'tech-radar' }],
docs/frontend-system/building-plugins/01-index.md
+7 -7
View File
@@ -24,14 +24,14 @@ The created plugin will currently be templated for use in the legacy frontend sy
## The plugin instance
The starting point of a frontend plugin is the `createPlugin` function, which accepts a single options object as its only parameter. It is imported from `@backstage/frontend-plugin-api`, which is where you will find most of the common APIs for building plugins.
The starting point of a frontend plugin is the `createFrontendPlugin` function, which accepts a single options object as its only parameter. It is imported from `@backstage/frontend-plugin-api`, which is where you will find most of the common APIs for building plugins.
This is how to create a minimal plugin:
```tsx title="in src/plugin.ts"
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
export const examplePlugin = createPlugin({
export const examplePlugin = createFrontendPlugin({
id: 'example',
extensions: [],
});
@@ -63,7 +63,7 @@ export const rootRouteRef = createRouteRef();
```tsx title="in src/plugin.ts"
import {
createPlugin,
createFrontendPlugin,
createPageExtension,
createNavItemExtension,
} from '@backstage/frontend-plugin-api';
@@ -92,7 +92,7 @@ const exampleNavItem = createNavItemExtension({
});
// The same plugin as above, now with the extensions added
export const examplePlugin = createPlugin({
export const examplePlugin = createFrontendPlugin({
id: 'example',
extensions: [examplePage, exampleNavItem],
// We can also make routes available to other plugins.
@@ -168,7 +168,7 @@ const exampleApi = createApiExtension({
/* Omitted definitions for examplePage, exampleNavItem, and rootRouteRef. */
export const examplePlugin = createPlugin({
export const examplePlugin = createFrontendPlugin({
id: 'example',
extensions: [
// highlight-add-next-line
@@ -202,7 +202,7 @@ const exampleEntityContent = createEntityContentExtension({
)),
});
export const examplePlugin = createPlugin({
export const examplePlugin = createFrontendPlugin({
id: 'example',
extensions: [
// highlight-add-next-line
docs/frontend-system/building-plugins/05-migrating.md
+10 -10
View File
@@ -15,9 +15,9 @@ The main concept is that routes, components, apis are now extensions. You can us
In the legacy frontend system a plugin was defined in its own `plugin.ts` file as following:
```ts title="my-plugin/src/plugin.ts"
import { createPlugin } from '@backstage/core-plugin-api';
import { createFrontendPlugin } from '@backstage/core-plugin-api';
export const myPlugin = createPlugin({
export const myPlugin = createFrontendPlugin({
id: 'my-plugin',
apis: [],
routes: {
@@ -29,13 +29,13 @@ In the legacy frontend system a plugin was defined in its own `plugin.ts` file a
});
```
In order to migrate the actual definition of the plugin you need to recreate the plugin using the new `createPlugin` utility exported by `@backstage/frontend-plugin-api`.
The new `createPlugin` function doesn't accept apis anymore as apis are now extensions.
In order to migrate the actual definition of the plugin you need to recreate the plugin using the new `createFrontendPlugin` utility exported by `@backstage/frontend-plugin-api`.
The new `createFrontendPlugin` function doesn't accept apis anymore as apis are now extensions.
```ts title="my-plugin/src/alpha.ts"
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
export default createPlugin({
export default createFrontendPlugin({
id: 'my-plugin',
// bind all the extensions to the plugin
/* highlight-next-line */
@@ -118,9 +118,9 @@ const fooPage = createPageExtension({
then add the `fooPage` extension to the plugin:
```ts title="my-plugin/src/alpha.ts"
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
export default createPlugin({
export default createFrontendPlugin({
id: 'my-plugin',
// bind all the extensions to the plugin
/* highlight-remove-next-line */
@@ -207,9 +207,9 @@ const exampleWorkApi = createApiExtension({
Finally, let's add the `exampleWorkApi` extension to the plugin:
```ts title="my-plugin/src/alpha.ts"
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
export default createPlugin({
export default createFrontendPlugin({
id: 'my-plugin',
// bind all the extensions to the plugin
/* highlight-remove-next-line */
docs/frontend-system/utility-apis/02-creating.md
+2 -2
View File
@@ -47,7 +47,7 @@ The plugin itself now wants to provide this API and its default implementation,
import {
createApiExtension,
createApiFactory,
createPlugin,
createFrontendPlugin,
storageApiRef,
StorageApi,
} from '@backstage/frontend-plugin-api';
@@ -76,7 +76,7 @@ const exampleWorkApi = createApiExtension({
* The Example plugin.
* @public
*/
export default createPlugin({
export default createFrontendPlugin({
id: 'example',
extensions: [exampleWorkApi],
});
packages/app-next-example-plugin/src/plugin.tsx
+2 -2
View File
@@ -17,7 +17,7 @@
import React from 'react';
import {
createPageExtension,
createPlugin,
createFrontendPlugin,
} from '@backstage/frontend-plugin-api';
export const ExamplePage = createPageExtension({
@@ -26,7 +26,7 @@ export const ExamplePage = createPageExtension({
});
/** @public */
export const examplePlugin = createPlugin({
export const examplePlugin = createFrontendPlugin({
id: 'example',
extensions: [ExamplePage],
});
packages/app-next/src/examples/pagesPlugin.tsx
+2 -2
View File
@@ -18,7 +18,7 @@ import React from 'react';
import { Link } from '@backstage/core-components';
import {
createPageExtension,
createPlugin,
createFrontendPlugin,
createRouteRef,
createExternalRouteRef,
useRouteRef,
@@ -125,7 +125,7 @@ const ExternalPage = createPageExtension({
},
});
export const pagesPlugin = createPlugin({
export const pagesPlugin = createFrontendPlugin({
id: 'pages',
// routes: {
// index: indexRouteRef,
packages/core-compat-api/src/collectLegacyRoutes.test.tsx
+1 -1
View File
@@ -31,7 +31,7 @@ import { Navigate, Route, Routes } from 'react-router-dom';
import { collectLegacyRoutes } from './collectLegacyRoutes';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
import { toInternalBackstagePlugin } from '../../frontend-plugin-api/src/wiring/createPlugin';
import { toInternalBackstagePlugin } from '../../frontend-plugin-api/src/wiring/createFrontendPlugin';
import {
createPlugin,
createRoutableExtension,
packages/core-compat-api/src/collectLegacyRoutes.tsx
+2 -2
View File
@@ -28,7 +28,7 @@ import {
createExtension,
createExtensionInput,
createPageExtension,
createPlugin,
createFrontendPlugin,
} from '@backstage/frontend-plugin-api';
import React, { Children, ReactNode, isValidElement } from 'react';
import { Route, Routes } from 'react-router-dom';
@@ -253,7 +253,7 @@ export function collectLegacyRoutes(
);
return Array.from(pluginExtensions).map(([plugin, extensions]) =>
createPlugin({
createFrontendPlugin({
id: plugin.getId(),
extensions: [
...extensions,
packages/core-compat-api/src/compatWrapper/BackwardsCompatProvider.tsx
+1 -1
View File
@@ -21,7 +21,7 @@ import { AppContextProvider } from '../../../core-app-api/src/app/AppContext';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
import { RouteResolver } from '../../../core-plugin-api/src/routing/useRouteRef';
import {
createPlugin as createNewPlugin,
createFrontendPlugin as createNewPlugin,
BackstagePlugin as NewBackstagePlugin,
appTreeApiRef,
componentsApiRef,
packages/frontend-app-api/src/routing/collectRouteIds.test.ts
+6 -2
View File
@@ -17,7 +17,7 @@
import {
createRouteRef,
createExternalRouteRef,
createPlugin,
createFrontendPlugin,
} from '@backstage/frontend-plugin-api';
import { collectRouteIds } from './collectRouteIds';
@@ -34,7 +34,11 @@ describe('collectRouteIds', () => {
);
const collected = collectRouteIds([
createPlugin({ id: 'test', routes: { ref }, externalRoutes: { extRef } }),
createFrontendPlugin({
id: 'test',
routes: { ref },
externalRoutes: { extRef },
}),
]);
expect(Object.fromEntries(collected.routes)).toEqual({
'test.ref': ref,
packages/frontend-app-api/src/routing/extractRouteInfoFromAppNode.test.ts
+2 -2
View File
@@ -25,7 +25,7 @@ import {
coreExtensionData,
createExtension,
createExtensionInput,
createPlugin,
createFrontendPlugin,
createRouteRef,
} from '@backstage/frontend-plugin-api';
import { MockConfigApi } from '@backstage/test-utils';
@@ -71,7 +71,7 @@ function createTestExtension(options: {
}
function routeInfoFromExtensions(extensions: ExtensionDefinition<any, any>[]) {
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions,
});
packages/frontend-app-api/src/tree/createAppTree.test.ts
+2 -2
View File
@@ -17,7 +17,7 @@
import {
createExtension,
createExtensionOverrides,
createPlugin,
createFrontendPlugin,
} from '@backstage/frontend-plugin-api';
import { MockConfigApi } from '@backstage/test-utils';
import { createAppTree } from './createAppTree';
@@ -41,7 +41,7 @@ describe('createAppTree', () => {
},
});
const features = [
createPlugin({
createFrontendPlugin({
id: 'plugin',
extensions: [],
}),
packages/frontend-app-api/src/tree/resolveAppNodeSpecs.test.ts
+14 -8
View File
@@ -16,7 +16,7 @@
import {
createExtensionOverrides,
createPlugin,
createFrontendPlugin,
Extension,
ExtensionDefinition,
} from '@backstage/frontend-plugin-api';
@@ -98,7 +98,10 @@ describe('resolveAppNodeSpecs', () => {
it('should override attachment points', () => {
const b = makeExt('b');
const pluginA = createPlugin({ id: 'test', extensions: [makeExtDef('a')] });
const pluginA = createFrontendPlugin({
id: 'test',
extensions: [makeExtDef('a')],
});
expect(
resolveAppNodeSpecs({
features: [pluginA],
@@ -130,7 +133,7 @@ describe('resolveAppNodeSpecs', () => {
it('should fully override configuration and duplicate', () => {
const a = makeExt('test/a');
const b = makeExt('test/b');
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions: [makeExtDef('a'), makeExtDef('b')],
});
@@ -178,7 +181,7 @@ describe('resolveAppNodeSpecs', () => {
const b = makeExt('b', 'disabled');
expect(
resolveAppNodeSpecs({
features: [createPlugin({ id: 'empty', extensions: [] })],
features: [createFrontendPlugin({ id: 'empty', extensions: [] })],
builtinExtensions: [a, b],
parameters: [
{
@@ -217,7 +220,7 @@ describe('resolveAppNodeSpecs', () => {
const g = makeExt('g', 'disabled');
expect(
resolveAppNodeSpecs({
features: [createPlugin({ id: 'empty', extensions: [] })],
features: [createFrontendPlugin({ id: 'empty', extensions: [] })],
builtinExtensions: [a, b, c, d, e, f, g],
parameters: [
{ id: 'e', disabled: false },
@@ -272,7 +275,7 @@ describe('resolveAppNodeSpecs', () => {
});
it('should apply extension overrides', () => {
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions: [makeExtDef('a'), makeExtDef('b')],
});
@@ -323,7 +326,7 @@ describe('resolveAppNodeSpecs', () => {
it('should use order from configuration when rather than overrides', () => {
const result = resolveAppNodeSpecs({
features: [
createPlugin({
createFrontendPlugin({
id: 'test',
extensions: [
makeExtDef('a', 'disabled'),
@@ -357,7 +360,10 @@ describe('resolveAppNodeSpecs', () => {
expect(() =>
resolveAppNodeSpecs({
features: [
createPlugin({ id: 'test', extensions: [makeExtDef('forbidden')] }),
createFrontendPlugin({
id: 'test',
extensions: [makeExtDef('forbidden')],
}),
],
builtinExtensions: [],
parameters: [],
packages/frontend-app-api/src/tree/resolveAppNodeSpecs.ts
+1 -1
View File
@@ -25,7 +25,7 @@ import { toInternalExtensionOverrides } from '../../../frontend-plugin-api/src/w
import { ExtensionParameters } from './readAppExtensionsConfig';
import { AppNodeSpec } from '@backstage/frontend-plugin-api';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
import { toInternalBackstagePlugin } from '../../../frontend-plugin-api/src/wiring/createPlugin';
import { toInternalBackstagePlugin } from '../../../frontend-plugin-api/src/wiring/createFrontendPlugin';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
import { toInternalExtension } from '../../../frontend-plugin-api/src/wiring/resolveExtensionDefinition';
packages/frontend-app-api/src/wiring/createApp.test.tsx
+7 -7
View File
@@ -21,7 +21,7 @@ import {
createExtension,
createExtensionOverrides,
createPageExtension,
createPlugin,
createFrontendPlugin,
createThemeExtension,
} from '@backstage/frontend-plugin-api';
import { screen, waitFor } from '@testing-library/react';
@@ -44,7 +44,7 @@ describe('createApp', () => {
}),
}),
features: [
createPlugin({
createFrontendPlugin({
id: 'test',
extensions: [
createThemeExtension({
@@ -68,7 +68,7 @@ describe('createApp', () => {
const app = createApp({
configLoader: async () => ({ config: new MockConfigApi({}) }),
features: [
createPlugin({
createFrontendPlugin({
id: duplicatedFeatureId,
extensions: [
createPageExtension({
@@ -77,7 +77,7 @@ describe('createApp', () => {
}),
],
}),
createPlugin({
createFrontendPlugin({
id: duplicatedFeatureId,
extensions: [
createPageExtension({
@@ -107,7 +107,7 @@ describe('createApp', () => {
async load({ config }) {
return {
features: [
createPlugin({
createFrontendPlugin({
id: 'test',
extensions: [
createPageExtension({
@@ -163,7 +163,7 @@ describe('createApp', () => {
const app = createApp({
configLoader: async () => ({ config: new MockConfigApi({}) }),
features: [
createPlugin({
createFrontendPlugin({
id: 'test',
featureFlags: [{ name: 'test-1' }],
extensions: [
@@ -218,7 +218,7 @@ describe('createApp', () => {
const app = createApp({
configLoader: async () => ({ config: new MockConfigApi({}) }),
features: [
createPlugin({
createFrontendPlugin({
id: 'my-plugin',
extensions: [
createPageExtension({
packages/frontend-app-api/src/wiring/createApp.tsx
+1 -1
View File
@@ -100,7 +100,7 @@ import {
import { InternalAppContext } from './InternalAppContext';
import { AppRoot } from '../extensions/AppRoot';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
import { toInternalBackstagePlugin } from '../../../frontend-plugin-api/src/wiring/createPlugin';
import { toInternalBackstagePlugin } from '../../../frontend-plugin-api/src/wiring/createFrontendPlugin';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
import { toInternalExtensionOverrides } from '../../../frontend-plugin-api/src/wiring/createExtensionOverrides';
import { DefaultComponentsApi } from '../apis/implementations/ComponentsApi';
packages/frontend-app-api/src/wiring/discovery.test.ts
+5 -5
View File
@@ -14,7 +14,7 @@
* limitations under the License.
*/
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
import { getAvailableFeatures } from './discovery';
import { ConfigReader } from '@backstage/config';
@@ -42,7 +42,7 @@ describe('getAvailableFeatures', () => {
});
it('should discover a plugin', () => {
const testPlugin = createPlugin({ id: 'test' });
const testPlugin = createFrontendPlugin({ id: 'test' });
globalSpy.mockReturnValue({
modules: [{ default: testPlugin }],
});
@@ -67,9 +67,9 @@ describe('getAvailableFeatures', () => {
});
it('should discover multiple plugins', () => {
const test1Plugin = createPlugin({ id: 'test1' });
const test2Plugin = createPlugin({ id: 'test2' });
const test3Plugin = createPlugin({ id: 'test3' });
const test1Plugin = createFrontendPlugin({ id: 'test1' });
const test2Plugin = createFrontendPlugin({ id: 'test2' });
const test3Plugin = createFrontendPlugin({ id: 'test3' });
globalSpy.mockReturnValue({
modules: [
{ default: test1Plugin },
packages/frontend-plugin-api/api-report.md
+21 -18
View File
@@ -893,6 +893,25 @@ export function createExternalRouteRef<
}
>;
// @public (undocumented)
export function createFrontendPlugin<
TId extends string,
TRoutes extends AnyRoutes = {},
TExternalRoutes extends AnyExternalRoutes = {},
TExtensions extends readonly ExtensionDefinition<any, any>[] = [],
>(
options: PluginOptions<TId, TRoutes, TExternalRoutes, TExtensions>,
): BackstagePlugin<
TRoutes,
TExternalRoutes,
{
[KExtension in TExtensions[number] as ResolveExtensionId<
KExtension,
TId
>]: KExtension;
}
>;
// @public @deprecated
export function createNavItemExtension(options: {
namespace?: string;
@@ -988,24 +1007,8 @@ export function createPageExtension<
},
): ExtensionDefinition<TConfig>;
// @public (undocumented)
export function createPlugin<
TId extends string,
TRoutes extends AnyRoutes = {},
TExternalRoutes extends AnyExternalRoutes = {},
TExtensions extends readonly ExtensionDefinition<any, any>[] = [],
>(
options: PluginOptions<TId, TRoutes, TExternalRoutes, TExtensions>,
): BackstagePlugin<
TRoutes,
TExternalRoutes,
{
[KExtension in TExtensions[number] as ResolveExtensionId<
KExtension,
TId
>]: KExtension;
}
>;
// @public @deprecated (undocumented)
export const createPlugin: typeof createFrontendPlugin;
// @public
export function createRouteRef<
packages/frontend-plugin-api/src/wiring/createPlugin.test.ts → packages/frontend-plugin-api/src/wiring/createFrontendPlugin.test.ts
+10 -10
View File
@@ -18,7 +18,7 @@ import React from 'react';
import { createApp } from '@backstage/frontend-app-api';
import { screen } from '@testing-library/react';
import { createSchemaFromZod } from '../schema/createSchemaFromZod';
import { createPlugin } from './createPlugin';
import { createFrontendPlugin } from './createFrontendPlugin';
import { JsonObject } from '@backstage/types';
import { createExtension } from './createExtension';
import { createExtensionDataRef } from './createExtensionDataRef';
@@ -133,16 +133,16 @@ function createTestAppRoot({
}).createRoot();
}
describe('createPlugin', () => {
describe('createFrontendPlugin', () => {
it('should create an empty plugin', () => {
const plugin = createPlugin({ id: 'test' });
const plugin = createFrontendPlugin({ id: 'test' });
expect(plugin).toBeDefined();
expect(String(plugin)).toBe('Plugin{id=test}');
});
it('should create a plugin with extension instances', async () => {
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions: [Extension1, Extension2, outputExtension],
});
@@ -186,7 +186,7 @@ describe('createPlugin', () => {
});
it('should create a plugin with nested extension instances', async () => {
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions: [Extension1, Extension2, Extension3, Child, outputExtension],
});
@@ -218,7 +218,7 @@ describe('createPlugin', () => {
});
it('should create a plugin with nested extension instances and multiple children', async () => {
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions: [
Extension1,
@@ -251,14 +251,14 @@ describe('createPlugin', () => {
it('should throw on duplicate extensions', async () => {
expect(() =>
createPlugin({
createFrontendPlugin({
id: 'test',
extensions: [Extension1, Extension1],
}),
).toThrow("Plugin 'test' provided duplicate extensions: test/1");
expect(() =>
createPlugin({
createFrontendPlugin({
id: 'test',
extensions: [
Extension1,
@@ -274,7 +274,7 @@ describe('createPlugin', () => {
describe('overrides', () => {
it('should return a plugin instance with the correct namespace', () => {
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions: [Extension1, Extension2],
});
@@ -304,7 +304,7 @@ describe('createPlugin', () => {
});
it('should allow overriding extensions that have a matching ID, while keeping old extensions that do not have overlapping IDs', async () => {
const plugin = createPlugin({
const plugin = createFrontendPlugin({
id: 'test',
extensions: [Extension1, Extension2, outputExtension],
});
packages/frontend-plugin-api/src/wiring/createPlugin.ts → packages/frontend-plugin-api/src/wiring/createFrontendPlugin.ts
+8 -2
View File
@@ -52,7 +52,7 @@ export interface InternalBackstagePlugin<
}
/** @public */
export function createPlugin<
export function createFrontendPlugin<
TId extends string,
TRoutes extends AnyRoutes = {},
TExternalRoutes extends AnyExternalRoutes = {},
@@ -122,7 +122,7 @@ export function createPlugin<
resolveExtensionDefinition(e, { namespace: options.id }).id,
),
);
return createPlugin({
return createFrontendPlugin({
...options,
extensions: [...nonOverriddenExtensions, ...overrides.extensions],
});
@@ -145,3 +145,9 @@ export function toInternalBackstagePlugin(
}
return internal;
}
/**
* @public
* @deprecated Use {@link createFrontendPlugin} instead.
*/
export const createPlugin = createFrontendPlugin;
packages/frontend-plugin-api/src/wiring/index.ts
+5 -1
View File
@@ -40,7 +40,11 @@ export {
type ExtensionDataValue,
type ConfigurableExtensionDataRef,
} from './createExtensionDataRef';
export { createPlugin, type PluginOptions } from './createPlugin';
export {
createPlugin,
createFrontendPlugin,
type PluginOptions,
} from './createFrontendPlugin';
export {
createExtensionOverrides,
type ExtensionOverridesOptions,
plugins/api-docs/src/alpha.tsx
+2 -2
View File
@@ -22,7 +22,7 @@ import {
createApiFactory,
createNavItemExtension,
createPageExtension,
createPlugin,
createFrontendPlugin,
createSchemaFromZod,
} from '@backstage/frontend-plugin-api';
@@ -203,7 +203,7 @@ const apiDocsApisEntityContent = createEntityContentExtension({
),
});
export default createPlugin({
export default createFrontendPlugin({
id: 'api-docs',
routes: {
root: convertLegacyRouteRef(rootRoute),
plugins/app-visualizer/src/plugin.tsx
+2 -2
View File
@@ -17,7 +17,7 @@
import {
createNavItemExtension,
createPageExtension,
createPlugin,
createFrontendPlugin,
createRouteRef,
} from '@backstage/frontend-plugin-api';
import VisualizerIcon from '@material-ui/icons/Visibility';
@@ -39,7 +39,7 @@ export const appVisualizerNavItem = createNavItemExtension({
});
/** @public */
export const visualizerPlugin = createPlugin({
export const visualizerPlugin = createFrontendPlugin({
id: 'app-visualizer',
extensions: [appVisualizerPage, appVisualizerNavItem],
});
plugins/catalog-graph/src/alpha.tsx
+2 -2
View File
@@ -17,7 +17,7 @@
import React from 'react';
import {
createPageExtension,
createPlugin,
createFrontendPlugin,
createSchemaFromZod,
} from '@backstage/frontend-plugin-api';
import {
@@ -96,7 +96,7 @@ const CatalogGraphPage = createPageExtension({
),
});
export default createPlugin({
export default createFrontendPlugin({
id: 'catalog-graph',
routes: {
catalogGraph: convertLegacyRouteRef(catalogGraphRouteRef),
plugins/catalog-import/src/alpha.tsx
+2 -2
View File
@@ -27,7 +27,7 @@ import {
import {
createApiExtension,
createPageExtension,
createPlugin,
createFrontendPlugin,
} from '@backstage/frontend-plugin-api';
import {
scmAuthApiRef,
@@ -80,7 +80,7 @@ const catalogImportApi = createApiExtension({
});
/** @alpha */
export default createPlugin({
export default createFrontendPlugin({
id: 'catalog-import',
extensions: [catalogImportApi, catalogImportPage],
routes: {
plugins/catalog/src/alpha/plugin.tsx
+2 -2
View File
@@ -15,7 +15,7 @@
*/
import { convertLegacyRouteRefs } from '@backstage/core-compat-api';
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
import { entityRouteRef } from '@backstage/plugin-catalog-react';
@@ -36,7 +36,7 @@ import entityContents from './entityContents';
import searchResultItems from './searchResultItems';
/** @alpha */
export default createPlugin({
export default createFrontendPlugin({
id: 'catalog',
routes: convertLegacyRouteRefs({
catalogIndex: rootRouteRef,
plugins/devtools/src/alpha/plugin.tsx
+2 -2
View File
@@ -20,7 +20,7 @@ import {
createApiFactory,
createNavItemExtension,
createPageExtension,
createPlugin,
createFrontendPlugin,
discoveryApiRef,
fetchApiRef,
} from '@backstage/frontend-plugin-api';
@@ -64,7 +64,7 @@ export const devToolsNavItem = createNavItemExtension({
});
/** @alpha */
export default createPlugin({
export default createFrontendPlugin({
id: 'devtools',
routes: {
root: convertLegacyRouteRef(rootRouteRef),
plugins/home/src/alpha.tsx
+2 -2
View File
@@ -21,7 +21,7 @@ import {
createExtensionDataRef,
createExtensionInput,
createPageExtension,
createPlugin,
createFrontendPlugin,
createRouteRef,
} from '@backstage/frontend-plugin-api';
import { compatWrapper } from '@backstage/core-compat-api';
@@ -65,7 +65,7 @@ const homePage = createPageExtension({
/**
* @alpha
*/
export default createPlugin({
export default createFrontendPlugin({
id: 'home',
extensions: [homePage],
});
plugins/kubernetes/src/alpha/plugin.tsx
+2 -2
View File
@@ -15,7 +15,7 @@
*/
import { convertLegacyRouteRefs } from '@backstage/core-compat-api';
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
import { kubernetesPage } from './pages';
import { entityKubernetesContent } from './entityContents';
import { rootCatalogKubernetesRouteRef } from '../plugin';
@@ -26,7 +26,7 @@ import {
kubernetesProxyApi,
} from './apis';
export default createPlugin({
export default createFrontendPlugin({
id: 'kubernetes',
extensions: [
kubernetesPage,
plugins/org/src/alpha.tsx
+2 -2
View File
@@ -18,7 +18,7 @@ import {
compatWrapper,
convertLegacyRouteRefs,
} from '@backstage/core-compat-api';
import { createPlugin } from '@backstage/frontend-plugin-api';
import { createFrontendPlugin } from '@backstage/frontend-plugin-api';
import React from 'react';
import { catalogIndexRouteRef } from './routes';
import { createEntityCardExtension } from '@backstage/plugin-catalog-react/alpha';
@@ -64,7 +64,7 @@ const EntityUserProfileCard = createEntityCardExtension({
});
/** @alpha */
export default createPlugin({
export default createFrontendPlugin({
id: 'org',
extensions: [
EntityGroupProfileCard,
plugins/scaffolder/src/alpha.tsx
+2 -2
View File
@@ -20,7 +20,7 @@ import {
createApiFactory,
createNavItemExtension,
createPageExtension,
createPlugin,
createFrontendPlugin,
discoveryApiRef,
fetchApiRef,
identityApiRef,
@@ -84,7 +84,7 @@ const scaffolderNavItem = createNavItemExtension({
});
/** @alpha */
export default createPlugin({
export default createFrontendPlugin({
id: 'scaffolder',
routes: convertLegacyRouteRefs({
root: rootRouteRef,
plugins/search/src/alpha.tsx
+2 -2
View File
@@ -37,7 +37,7 @@ import {
} from '@backstage/core-plugin-api';
import {
createPlugin,
createFrontendPlugin,
createApiExtension,
createPageExtension,
createExtensionInput,
@@ -237,7 +237,7 @@ export const searchNavItem = createNavItemExtension({
});
/** @alpha */
export default createPlugin({
export default createFrontendPlugin({
id: 'search',
extensions: [searchApi, searchPage, searchNavItem],
routes: convertLegacyRouteRefs({
plugins/techdocs/src/alpha.tsx
+2 -2
View File
@@ -17,7 +17,7 @@
import React from 'react';
import LibraryBooks from '@material-ui/icons/LibraryBooks';
import {
createPlugin,
createFrontendPlugin,
createSchemaFromZod,
createApiExtension,
createPageExtension,
@@ -155,7 +155,7 @@ const techDocsNavItem = createNavItemExtension({
});
/** @alpha */
export default createPlugin({
export default createFrontendPlugin({
id: 'techdocs',
extensions: [
techDocsClientApi,
plugins/user-settings/src/alpha.tsx
+2 -2
View File
@@ -18,7 +18,7 @@ import {
createExtensionInput,
createNavItemExtension,
createPageExtension,
createPlugin,
createFrontendPlugin,
} from '@backstage/frontend-plugin-api';
import {
convertLegacyRouteRef,
@@ -63,7 +63,7 @@ export const settingsNavItem = createNavItemExtension({
/**
* @alpha
*/
export default createPlugin({
export default createFrontendPlugin({
id: 'user-settings',
extensions: [userSettingsPage, settingsNavItem],
routes: convertLegacyRouteRefs({