Update serverlessops-catalog plugin for new frontend system - #16
Conversation
…system - Replace createPlugin/createRoutableExtension (old system) with createFrontendPlugin/PageBlueprint.make from @backstage/frontend-plugin-api - Replace createRouteRef per page (catalogIndexRouteRef, tabbedCatalogRouteRef, tabbedDirectoryRouteRef) using the new API (no id param required) - Export plugin as default; keep SoCatalogIndexPageEntityList, SoTabbedCatalogIndexPage, SoTabbedDirectoryIndexPage as named exports - Add @backstage/frontend-plugin-api to dependencies; replace @backstage/dev-utils with @backstage/frontend-defaults in devDependencies; add react-dom to peerDependencies - Update dev/index.tsx to use createApp from @backstage/frontend-defaults - Add plugin to app features in App.tsx - Update plugin.test.ts to use test() per convention and validate default export
/alpha entrypoints
…default catalog page
This comment has been minimized.
This comment has been minimized.
It's not a page and we don't use this component elsewhere.
93f1a0e to
b0813af
Compare
dd6a728 to
a888a95
Compare
|
@copilot Please update the PR's initial comment based on the current state of the branch |
I can’t edit the PR’s initial comment/description from this environment. Based on the current branch state, it should describe the package root exporting the new frontend plugin wiring, the app importing |
|
@copilot If you could edit the first commit based on the current state of the branch what would you write? |
I’d rewrite it along these lines:
|
a package change in this branch caused the latest `knex` to be pulled in which brought in the latest `tarn` which causes tsc to fail.
/alpha entrypointsThere was a problem hiding this comment.
Pull request overview
This PR migrates the serverlessops-catalog plugin to Backstage’s new frontend plugin system by introducing a createFrontendPlugin entrypoint and updating the app/dev wiring to consume the plugin from the package root.
Changes:
- Introduces a new frontend-plugin entrypoint (
createFrontendPlugin+PageBlueprint) and updates exports to provide a default plugin surface. - Updates the main app to register the plugin as a frontend “feature” and adjusts routes to avoid conflicts under
/serverlessops-catalog/*. - Switches the plugin dev app to
@backstage/frontend-dev-utils.
Reviewed changes
Copilot reviewed 9 out of 11 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| src/plugins/serverlessops-catalog/src/routes.ts | Migrates route ref creation to the frontend plugin API (but appears to be left unused). |
| src/plugins/serverlessops-catalog/src/plugin.tsx | Adds the new frontend-plugin entrypoint with route refs and PageBlueprint pages. |
| src/plugins/serverlessops-catalog/src/plugin.ts | Removes the legacy createPlugin/createRoutableExtension implementation. |
| src/plugins/serverlessops-catalog/src/plugin.test.ts | Updates export-surface tests to match the new entrypoint/exports. |
| src/plugins/serverlessops-catalog/src/index.ts | Switches exports to a default plugin export + named page blueprints. |
| src/plugins/serverlessops-catalog/package.json | Aligns Backstage metadata and dependencies for the new frontend system. |
| src/plugins/serverlessops-catalog/dev/index.tsx | Migrates dev app setup to @backstage/frontend-dev-utils. |
| src/packages/app/src/App.tsx | Registers the migrated plugin as an app feature via the package root entrypoint. |
| src/package.json | Adds resolutions for knex and tarn. |
| node_modules/.yarn-integrity | Introduces a committed node_modules artifact at repo root (should not be tracked). |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| createDevApp({ | ||
| features: [serverlessOpsCatalogPlugin], | ||
| }) |
| { | ||
| "systemParams": "linux-x64-137", | ||
| "modulesFolders": [], | ||
| "flags": [], | ||
| "linkedModules": [], | ||
| "topLevelPatterns": [], | ||
| "lockfileEntries": {}, | ||
| "files": [], | ||
| "artifacts": {} | ||
| } No newline at end of file |
| describe('catalog', () => { | ||
| it('should export plugin SoCatalogIndexPageEntityList', () => { | ||
| expect(SoCatalogIndexPageEntityList).toBeDefined(); | ||
| it('should export plugin SoCatalogTabbedDirectoryIndexPage', () => { | ||
| expect(SoCatalogTabbedDirectoryIndexPage).toBeDefined(); | ||
| }); | ||
| it('should export plugin SoTabbedCatalogIndexPage', () => { | ||
| expect(SoTabbedCatalogIndexPage).toBeDefined(); | ||
| it('should export plugin SoCatalogTabbedIndexPage', () => { |
| import { createRouteRef } from '@backstage/frontend-plugin-api' | ||
|
|
||
| export const rootRouteRef = createRouteRef({ | ||
| id: 'serverlessops-catalog', | ||
| }); | ||
| export const rootRouteRef = createRouteRef() |
Migrate serverlessops-catalog to the frontend plugin entrypoint
Example of the intended consumption pattern after this change:
NOTE: This comment was ediyed by @tmclaugh after additional work was performed