49:I[660678,["/_next/static/chunks/13vqyfldau57p.js","/_next/static/chunks/1gbl-dcot4vlq.js","/_next/static/chunks/2ugxrg8mt6ccc.js","/_next/static/chunks/06u_dm-_ph36_.js","/_next/static/chunks/0cnrn8dx8wpm6.js","/_next/static/chunks/2e4udl7tfg2xd.js","/_next/static/chunks/3erz2--ndwlxz.js","/_next/static/chunks/0pp6seif9t0rh.js","/_next/static/chunks/40fmu66fmb8tm.js","/_next/static/chunks/1sh719482-5um.js","/_next/static/chunks/2i4xo8xu-dpuk.js","/_next/static/chunks/1gth09_ur0iam.js","/_next/static/chunks/2wyk4b1ao4pa_.js","/_next/static/chunks/3vehc-g2atkra.js","/_next/static/chunks/0ugk39ckud30x.js","/_next/static/chunks/2a4jc680f5x-9.js","/_next/static/chunks/44c_5nh0vyeb5.js","/_next/static/chunks/0r86cplnpkdza.js","/_next/static/chunks/1jiredr0b6jr_.js","/_next/static/chunks/3inhpdbyfua_r.js","/_next/static/chunks/1qsa_rj-5yj90.js","/_next/static/chunks/3s8x8w7a2lgsa.js","/_next/static/chunks/2md3whhhv655w.js","/_next/static/chunks/1_5ue0bs85y9-.js","/_next/static/chunks/39r5jk4yvppc5.js","/_next/static/chunks/3-906s1ue5fj3.js","/_next/static/chunks/2t_5zfez2-77k.js","/_next/static/chunks/3v9yse6gfm876.js","/_next/static/chunks/2ghxk472-g0i6.js","/_next/static/chunks/3t7z44cjl4fyh.js","/_next/static/chunks/0meqi_44gz4np.js","/_next/static/chunks/2641m2aqdum9a.js","/_next/static/chunks/0ojgzwcpt7vsk.js","/_next/static/chunks/2l8l4_a9-xhts.js","/_next/static/chunks/2f0mnapfb6qc-.js","/_next/static/chunks/04zz8eh1956za.js"],"HydrationBoundary"] 48:Tabf,{"@context":"https://schema.org","@graph":[{"@type":"WebSite","@id":"https://app.codemod.com/registry#website","url":"https://app.codemod.com/registry","name":"Codemod Registry"},{"@type":"Organization","@id":"https://app.codemod.com#org","name":"backstage","url":"https://app.codemod.com","logo":"https://avatars.githubusercontent.com/u/72526453?v=4"},{"@type":"BreadcrumbList","@id":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Registry","item":"https://app.codemod.com/registry"},{"@type":"ListItem","position":2,"name":"@backstage/migrate-nav-item-to-page","item":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page"}]},{"@type":"WebPage","@id":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page#webpage","url":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page","name":"migrate-nav-item-to-page - Codemod Registry","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","isPartOf":{"@id":"https://app.codemod.com/registry#website"},"author":{"@id":"https://app.codemod.com#org"},"breadcrumb":{"@id":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page#breadcrumb"},"mainEntity":{"@id":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page#sourcecode"}},{"@type":"SoftwareSourceCode","@id":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page#sourcecode","name":"@backstage/migrate-nav-item-to-page","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","url":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page","publisher":{"@id":"https://app.codemod.com#org"},"image":"https://avatars.githubusercontent.com/u/72526453?v=4","isAccessibleForFree":true,"license":"Apache-2.0","codeRepository":"https://github.com/backstage/codemods","version":"0.2.2","keywords":["backstage","migration","frontend-plugin-api","NavItemBlueprint","PageBlueprint","1.51.0"],"datePublished":"2026-06-01 19:47:34.403252+00","dateModified":"2026-07-22 20:12:57.387807+00"},{"@type":"SoftwareApplication","@id":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page#app","name":"migrate-nav-item-to-page codemod","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","url":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page","publisher":{"@id":"https://app.codemod.com#org"},"softwareVersion":"0.2.2","applicationCategory":"DeveloperApplication","operatingSystem":"Cross-platform","offers":{"@type":"Offer","price":"0","priceCurrency":"USD","availability":"https://schema.org/InStock"}}]}4a:Teff,# @backstage/migrate-nav-item-to-page Backstage 1.51.0 migration codemod that merges `NavItemBlueprint` navigation metadata into matching `PageBlueprint` extensions. ## What it does `NavItemBlueprint` was removed from `@backstage/frontend-plugin-api` in Backstage 1.51.0. Navigation items are now discovered from `PageBlueprint` extensions via their `title` and `icon` params. For each `NavItemBlueprint.make` call, the codemod: 1. Extracts `title`, `icon`, and `routeRef` from `params` 2. Finds the matching `PageBlueprint.make` or `PageBlueprint.makeWithOverrides` with the same static `routeRef` 3. Adds `title` and `icon` to the page extension params (or the `originalFactory` argument for `makeWithOverrides`) 4. Wraps MUI icon identifiers as `` when the icon is not already JSX 5. Removes the nav item declaration and its entry from `extensions` arrays 6. Removes unused `NavItemBlueprint` imports ### Before / After ```ts // Before import { NavItemBlueprint, PageBlueprint } from '@backstage/frontend-plugin-api'; import ExampleIcon from '@material-ui/icons/Extension'; const navItem = NavItemBlueprint.make({ params: { title: 'Example', icon: ExampleIcon, routeRef }, }); const page = PageBlueprint.make({ params: { routeRef, path: '/example', loader: () => import('./Page').then(m => ) }, }); // After import { PageBlueprint } from '@backstage/frontend-plugin-api'; import ExampleIcon from '@material-ui/icons/Extension'; const page = PageBlueprint.make({ params: { title: 'Example', icon: , routeRef, path: '/example', loader: () => import('./Page').then(m => ), }, }); ``` ### Known limitations - **MUI to Remix icon migration** is not performed — icons are wrapped as JSX elements only. Use `--param aiFixup=true` for heuristic MUI → `@remixicon/react` conversion. - **Dynamic `routeRef` values** (non-identifier expressions) are flagged with `TODO(backstage-codemod)` for manual migration. - **Unpaired nav items** (no matching `PageBlueprint` with the same `routeRef`) are flagged with `TODO(backstage-codemod)` and left in place. - **Ambiguous pairings** (multiple pages sharing the same static `routeRef`) are flagged with `TODO(backstage-codemod)`. - **Non-static icons** (computed expressions, function calls) may need manual conversion to `IconElement` JSX. - **Namespace imports** of `NavItemBlueprint` are detected via usage patterns but not fully decomposed — use AI fixup for complex cases. ### Optional: AI fixup step Enable the AI-powered fixup step with `--param aiFixup=true` to address edge cases: - Pair orphaned `NavItemBlueprint` extensions with the correct `PageBlueprint` - Convert MUI icons to `@remixicon/react` where only used for navigation - Clean up `createFrontendModule` / `createFrontendPlugin` extension arrays - Resolve ambiguous pairings and dynamic `routeRef` values ## Installation ```bash # From registry yarn dlx codemod@latest run @backstage/migrate-nav-item-to-page -t /path/to/target ``` ## Usage (from this repo) ```bash # AST codemod only (deterministic) yarn dlx codemod@latest workflow run \ -w codemods/v1.51.0/migrate-nav-item-to-page/workflow.yaml \ -t /path/to/your/backstage-repo # AST codemod + AI fixup for edge cases yarn dlx codemod@latest workflow run \ -w codemods/v1.51.0/migrate-nav-item-to-page/workflow.yaml \ -t /path/to/your/backstage-repo \ --param aiFixup=true # Dry run (preview changes) yarn dlx codemod@latest workflow run \ -w codemods/v1.51.0/migrate-nav-item-to-page/workflow.yaml \ -t /path/to/your/backstage-repo \ --dry-run ``` ## Development From the repo root: ```bash yarn install yarn workspace @backstage/migrate-nav-item-to-page test ``` Or from this package directory: ```bash yarn test ``` 1a:[["$","script",null,{"type":"application/ld+json","dangerouslySetInnerHTML":{"__html":"$48"}}],["$","$L49",null,{"state":{"mutations":[],"queries":[{"dehydratedAt":1790115343765,"state":{"data":{"json":{"id":"2af37a1a-921b-4f29-bdeb-73329ec57d2c","name":"migrate-nav-item-to-page","displayName":"@backstage/migrate-nav-item-to-page","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","scope":"backstage","visibility":"public","downloadCount":46,"executionCount":0,"createdAt":"2026-06-01 19:47:34.403252+00","updatedAt":"2026-07-22 20:12:57.387807+00","latestVersion":"0.2.2","keywords":["backstage","migration","frontend-plugin-api","NavItemBlueprint","PageBlueprint","1.51.0"],"starCount":0,"author":"Paul Schultz","homepage":null,"repository":"https://github.com/backstage/codemods","license":"Apache-2.0","access":"public","documentation":null,"bugsUrl":null,"readme":"$4a","organization":{"id":"7b129592-a10a-42f8-8dcb-46b0edd84f1e","name":"backstage","slug":"backstage","avatarUrl":"https://avatars.githubusercontent.com/u/72526453?v=4"},"owner":{"id":"498826df-6a91-4c45-9aed-18bea7ba2d4d","username":"cdedreuille","name":"Charles de Dreuille","avatarUrl":"https://avatars.githubusercontent.com/u/1540635?v=4"},"isLegacy":false,"versions":[{"version":{"id":"7cad8688-b56b-49ce-94e4-bddaa583edf9","packageId":"2af37a1a-921b-4f29-bdeb-73329ec57d2c","version":"0.2.2","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","manifest":{"name":"@backstage/migrate-nav-item-to-page","author":"Paul Schultz","license":"Apache-2.0","targets":{"versions":{},"languages":["typescript","tsx"],"frameworks":[]},"version":"0.2.2","keywords":["backstage","migration","frontend-plugin-api","NavItemBlueprint","PageBlueprint","1.51.0"],"registry":{"access":"public","visibility":"public"},"workflow":"workflow.yaml","repository":"https://github.com/backstage/codemods","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","dependencies":[],"schema_version":"1.0"},"checksum":"0f7b1c7e035c51be8b5e3cb1107deb1d05782caa3260d308fe4414cfd4d8996f","size":11814,"downloadUrl":"https://registry-cdn.codemod.com/prod/packages/backstage/migrate-nav-item-to-page/0.2.2/public.tar.gz","aiGenerated":false,"sourceArchiveS3Key":null,"targets":{"languages":["typescript"],"frameworks":[]},"dependencies":[],"languages":["tsx"],"stepTypes":["js-ast-grep","ai"],"workflowMetadata":{"nodes":[{"id":"apply-transforms","name":"Apply AST Transformations","steps":[{"name":"Migrate NavItemBlueprint into matching PageBlueprint extensions","type":"js-ast-grep","language":"tsx"}]},{"id":"ai-fixup","name":"AI fixup for edge cases","steps":[{"name":"Fix remaining NavItemBlueprint migration edge cases","type":"ai"}]}]},"validated":false,"validationErrors":null,"publishedBy":"498826df-6a91-4c45-9aed-18bea7ba2d4d","deprecated":false,"deprecationMessage":null,"downloadCount":20,"cachedTestCases":{"input":"import {\n NavItemBlueprint as NavBP,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsNav = NavBP.make({\n params: {\n title: 'Docs',\n icon: DocsIcon,\n routeRef: docsRouteRef,\n },\n});\n\nconst docsPage = PageBlueprint.make({\n params: {\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage, docsNav],\n};\n","output":"import {\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsPage = PageBlueprint.make({\n params: {\n title: 'Docs',\n icon: ,\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage],\n};\n","isValid":true,"examples":[{"name":"alias-import","path":"tests/alias-import","input":"import {\n NavItemBlueprint as NavBP,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsNav = NavBP.make({\n params: {\n title: 'Docs',\n icon: DocsIcon,\n routeRef: docsRouteRef,\n },\n});\n\nconst docsPage = PageBlueprint.make({\n params: {\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage, docsNav],\n};\n","output":"import {\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsPage = PageBlueprint.make({\n params: {\n title: 'Docs',\n icon: ,\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage],\n};\n","filename":"input.tsx"},{"name":"ambiguous-icon","path":"tests/ambiguous-icon","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport * as Icons from '@material-ui/icons';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Home', icon: Icons.Home, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport * as Icons from '@material-ui/icons';\n\nconst routeRef = createRouteRef();\n\n// TODO(backstage-codemod): Convert nav icon to IconElement JSX manually\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: Icons.Home,\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"ambiguous-multiple-pages","path":"tests/ambiguous-multiple-pages","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport DuplicateIcon from '@material-ui/icons/Star';\n\nconst sharedRouteRef = createRouteRef();\n\nexport const navItem = NavItemBlueprint.make({\n params: {\n title: 'Shared',\n icon: DuplicateIcon,\n routeRef: sharedRouteRef,\n },\n});\n\nexport const pageOne = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/one',\n loader: async () => null,\n },\n});\n\nexport const pageTwo = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/two',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [pageOne, pageTwo, navItem],\n};\n","output":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport DuplicateIcon from '@material-ui/icons/Star';\n\nconst sharedRouteRef = createRouteRef();\n\n// TODO(backstage-codemod): Ambiguous NavItemBlueprint pairing — multiple PageBlueprint extensions share the same routeRef\nexport const navItem = NavItemBlueprint.make({\n params: {\n title: 'Shared',\n icon: DuplicateIcon,\n routeRef: sharedRouteRef,\n },\n});\n\nexport const pageOne = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/one',\n loader: async () => null,\n },\n});\n\nexport const pageTwo = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/two',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [pageOne, pageTwo, navItem],\n};\n","filename":"input.tsx"},{"name":"basic","path":"tests/basic","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport ExampleIcon from '@material-ui/icons/Extension';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Example', icon: ExampleIcon, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/example',\n loader: () => import('./Page').then(m => ),\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport ExampleIcon from '@material-ui/icons/Extension';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Example',\n icon: ,\n routeRef,\n path: '/example',\n loader: () => import('./Page').then(m => ),\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"icon-already-jsx","path":"tests/icon-already-jsx","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: {\n title: 'Home',\n icon: ,\n routeRef,\n },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page, navItem],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: ,\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"icon-in-ts-file","path":"tests/icon-in-ts-file","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Home', icon: HomeIcon, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => import('./Page'),\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\n// TODO(backstage-codemod): Convert nav icon to IconElement JSX manually\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: HomeIcon,\n routeRef,\n path: '/home',\n loader: async () => import('./Page'),\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.ts"},{"name":"make-with-overrides","path":"tests/make-with-overrides","input":"import {\n createExtensionInput,\n PageBlueprint,\n NavItemBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport SearchIcon from '@material-ui/icons/Search';\n\nconst rootRouteRef = createRouteRef();\n\nexport const searchPage = PageBlueprint.makeWithOverrides({\n inputs: {\n items: createExtensionInput([]),\n },\n factory(originalFactory) {\n return originalFactory({\n path: '/search',\n routeRef: rootRouteRef,\n loader: async () => null,\n });\n },\n});\n\nexport const searchNavItem = NavItemBlueprint.make({\n params: {\n routeRef: rootRouteRef,\n title: 'Search',\n icon: SearchIcon,\n },\n});\n\nexport default {\n extensions: [searchPage, searchNavItem],\n};\n","output":"import {\n createExtensionInput,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport SearchIcon from '@material-ui/icons/Search';\n\nconst rootRouteRef = createRouteRef();\n\nexport const searchPage = PageBlueprint.makeWithOverrides({\n inputs: {\n items: createExtensionInput([]),\n },\n factory(originalFactory) {\n return originalFactory({\n title: 'Search',\n icon: ,\n path: '/search',\n routeRef: rootRouteRef,\n loader: async () => null,\n });\n },\n});\n\nexport default {\n extensions: [searchPage],\n};\n","filename":"input.tsx"},{"name":"make-with-overrides-two-arg","path":"tests/make-with-overrides-two-arg","input":"import {\n coreExtensionData,\n createExtensionInput,\n PageBlueprint,\n NavItemBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport BuildIcon from '@material-ui/icons/Build';\n\nconst rootRouteRef = createRouteRef();\n\nexport const devToolsPage = PageBlueprint.makeWithOverrides({\n inputs: {\n pages: createExtensionInput([coreExtensionData.reactElement]),\n },\n factory(originalFactory, { inputs }) {\n return originalFactory(\n {\n path: '/devtools',\n routeRef: rootRouteRef,\n title: 'DevTools',\n },\n {\n inputs: {\n pages: inputs.pages,\n },\n },\n );\n },\n});\n\nexport const devToolsNavItem = NavItemBlueprint.make({\n params: {\n title: 'DevTools',\n routeRef: rootRouteRef,\n icon: BuildIcon,\n },\n});\n\nexport default {\n extensions: [devToolsPage, devToolsNavItem],\n};\n","output":"import {\n coreExtensionData,\n createExtensionInput,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport BuildIcon from '@material-ui/icons/Build';\n\nconst rootRouteRef = createRouteRef();\n\nexport const devToolsPage = PageBlueprint.makeWithOverrides({\n inputs: {\n pages: createExtensionInput([coreExtensionData.reactElement]),\n },\n factory(originalFactory, { inputs }) {\n return originalFactory(\n {\n icon: ,\n path: '/devtools',\n routeRef: rootRouteRef,\n title: 'DevTools',\n },\n {\n inputs: {\n pages: inputs.pages,\n },\n },\n );\n },\n});\n\nexport default {\n extensions: [devToolsPage],\n};\n","filename":"input.tsx"},{"name":"nav-without-icon","path":"tests/nav-without-icon","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Settings', routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/settings',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Settings',\n routeRef,\n path: '/settings',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"noop-no-nav-item","path":"tests/noop-no-nav-item","input":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nexport const page = PageBlueprint.make({\n params: {\n title: 'Catalog',\n routeRef,\n path: '/catalog',\n loader: async () => null,\n },\n});\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nexport const page = PageBlueprint.make({\n params: {\n title: 'Catalog',\n routeRef,\n path: '/catalog',\n loader: async () => null,\n },\n});\n","filename":"input.tsx"}]},"defaultWorkflowName":"default","createdAt":"2026-07-22T20:12:57.387Z","updatedAt":"2026-09-05 16:15:37.602969+00"},"publishedBy":{"id":"498826df-6a91-4c45-9aed-18bea7ba2d4d","username":"cdedreuille","name":"Charles de Dreuille"},"insightsTemplate":{"packageVersionId":"7cad8688-b56b-49ce-94e4-bddaa583edf9","status":"ready","generatedAt":"2026-07-22T20:14:53.387Z"},"workflows":[{"name":"default","path":"workflow.yaml","description":null,"isDefault":true,"languages":["tsx"],"stepTypes":["js-ast-grep","ai"],"workflowMetadata":{"nodes":[{"id":"apply-transforms","name":"Apply AST Transformations","steps":[{"name":"Migrate NavItemBlueprint into matching PageBlueprint extensions","type":"js-ast-grep","language":"tsx"}]},{"id":"ai-fixup","name":"AI fixup for edge cases","steps":[{"name":"Fix remaining NavItemBlueprint migration edge cases","type":"ai"}]}]}}],"packageBehavior":"workflow-only","isBundle":false,"bundleChildren":[],"parentBundles":[{"id":"24e5f2af-80f0-447d-af41-7b8af8ef99c0","parentWorkflowName":"default","parentNodeId":"apply-recipe","parentStepId":null,"parentStepName":"Migrate NavItemBlueprint title/icon into matching PageBlueprint params","childSourceRaw":"@backstage/migrate-nav-item-to-page","childWorkflowName":null,"resolutionKind":"registry","resolutionReason":null,"resolutionMessage":null,"isDirect":true,"createdAt":"2026-06-19T16:07:44.975Z","updatedAt":"2026-07-22 20:12:57.752842+00","parentPackage":{"id":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","name":"v1-51-0-migration-recipe","displayName":"@backstage/v1-51-0-migration-recipe","description":"Backstage 1.51.0: Migration recipe that runs every @backstage v1.51.0 codemod from the registry in a safe order.","scope":"backstage","visibility":"public","access":"public","latestVersion":"0.2.3","author":"Paul Schultz"},"parentPackageVersion":{"id":"90aae98f-9e86-48b7-9b5a-d987cfca5071","packageId":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","version":"0.2.1"}},{"id":"532f5fe2-7563-4461-9814-e46584872147","parentWorkflowName":"default","parentNodeId":"apply-recipe","parentStepId":null,"parentStepName":"Migrate NavItemBlueprint title/icon into matching PageBlueprint params","childSourceRaw":"@backstage/migrate-nav-item-to-page","childWorkflowName":null,"resolutionKind":"registry","resolutionReason":null,"resolutionMessage":null,"isDirect":true,"createdAt":"2026-06-19T16:07:47.926Z","updatedAt":"2026-07-22 20:12:57.766567+00","parentPackage":{"id":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","name":"v1-51-0-migration-recipe","displayName":"@backstage/v1-51-0-migration-recipe","description":"Backstage 1.51.0: Migration recipe that runs every @backstage v1.51.0 codemod from the registry in a safe order.","scope":"backstage","visibility":"public","access":"public","latestVersion":"0.2.3","author":"Paul Schultz"},"parentPackageVersion":{"id":"fc7bc6d5-a4e7-4083-a2b0-3b162cfe21a2","packageId":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","version":"0.2.2"}},{"id":"25ddc24b-334b-47bc-8064-f5f1a774a090","parentWorkflowName":"default","parentNodeId":"apply-recipe","parentStepId":null,"parentStepName":"Migrate NavItemBlueprint title/icon into matching PageBlueprint params","childSourceRaw":"@backstage/migrate-nav-item-to-page","childWorkflowName":null,"resolutionKind":"registry","resolutionReason":null,"resolutionMessage":null,"isDirect":true,"createdAt":"2026-06-19T16:07:53.122Z","updatedAt":"2026-07-22 20:12:57.778628+00","parentPackage":{"id":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","name":"v1-51-0-migration-recipe","displayName":"@backstage/v1-51-0-migration-recipe","description":"Backstage 1.51.0: Migration recipe that runs every @backstage v1.51.0 codemod from the registry in a safe order.","scope":"backstage","visibility":"public","access":"public","latestVersion":"0.2.3","author":"Paul Schultz"},"parentPackageVersion":{"id":"e7e81a44-d0b9-42ca-b5cf-ebc101f91285","packageId":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","version":"0.2.0"}},{"id":"afa5f447-35f1-451c-975c-98b529dfb40c","parentWorkflowName":"default","parentNodeId":"apply-recipe","parentStepId":null,"parentStepName":"Migrate NavItemBlueprint title/icon into matching PageBlueprint params","childSourceRaw":"@backstage/migrate-nav-item-to-page","childWorkflowName":null,"resolutionKind":"registry","resolutionReason":null,"resolutionMessage":null,"isDirect":true,"createdAt":"2026-07-22T20:13:00.594Z","updatedAt":"2026-07-22 20:13:00.594852+00","parentPackage":{"id":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","name":"v1-51-0-migration-recipe","displayName":"@backstage/v1-51-0-migration-recipe","description":"Backstage 1.51.0: Migration recipe that runs every @backstage v1.51.0 codemod from the registry in a safe order.","scope":"backstage","visibility":"public","access":"public","latestVersion":"0.2.3","author":"Paul Schultz"},"parentPackageVersion":{"id":"55ad31c0-5843-4ac9-a7be-1e1afece4b34","packageId":"d6794190-b1bc-40a3-90fc-6943ad4e4d87","version":"0.2.3"}}]},{"version":{"id":"53fba89b-d915-434f-821c-1778c709731a","packageId":"2af37a1a-921b-4f29-bdeb-73329ec57d2c","version":"0.2.1","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","manifest":{"name":"@backstage/migrate-nav-item-to-page","author":"Paul Schultz","license":"Apache-2.0","targets":{"versions":{},"languages":["typescript","tsx"],"frameworks":[]},"version":"0.2.1","keywords":["backstage","migration","frontend-plugin-api","NavItemBlueprint","PageBlueprint","1.51.0"],"registry":{"access":"public","visibility":"public"},"workflow":"workflow.yaml","repository":"https://github.com/backstage/codemods","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","dependencies":[],"schema_version":"1.0"},"checksum":"3b8261ce8c67e0d43204c137d2fa87872743173c9d3b9cd2e8814e7ad2716635","size":11274,"downloadUrl":"https://registry-cdn.codemod.com/prod/packages/backstage/migrate-nav-item-to-page/0.2.1/public.tar.gz","aiGenerated":false,"sourceArchiveS3Key":null,"targets":{"languages":["typescript"],"frameworks":[]},"dependencies":[],"languages":["tsx"],"stepTypes":["js-ast-grep","ai"],"workflowMetadata":{"nodes":[{"id":"apply-transforms","name":"Apply AST Transformations","steps":[{"name":"Migrate NavItemBlueprint into matching PageBlueprint extensions","type":"js-ast-grep","language":"tsx"}]},{"id":"ai-fixup","name":"AI fixup for edge cases","steps":[{"name":"Fix remaining NavItemBlueprint migration edge cases","type":"ai"}]}]},"validated":false,"validationErrors":null,"publishedBy":"498826df-6a91-4c45-9aed-18bea7ba2d4d","deprecated":false,"deprecationMessage":null,"downloadCount":9,"cachedTestCases":{"input":"import {\n NavItemBlueprint as NavBP,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsNav = NavBP.make({\n params: {\n title: 'Docs',\n icon: DocsIcon,\n routeRef: docsRouteRef,\n },\n});\n\nconst docsPage = PageBlueprint.make({\n params: {\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage, docsNav],\n};\n","output":"import {\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsPage = PageBlueprint.make({\n params: {\n title: 'Docs',\n icon: ,\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage],\n};\n","isValid":true,"examples":[{"name":"alias-import","path":"tests/alias-import","input":"import {\n NavItemBlueprint as NavBP,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsNav = NavBP.make({\n params: {\n title: 'Docs',\n icon: DocsIcon,\n routeRef: docsRouteRef,\n },\n});\n\nconst docsPage = PageBlueprint.make({\n params: {\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage, docsNav],\n};\n","output":"import {\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsPage = PageBlueprint.make({\n params: {\n title: 'Docs',\n icon: ,\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage],\n};\n","filename":"input.tsx"},{"name":"ambiguous-icon","path":"tests/ambiguous-icon","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport * as Icons from '@material-ui/icons';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Home', icon: Icons.Home, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport * as Icons from '@material-ui/icons';\n\nconst routeRef = createRouteRef();\n\n// TODO(backstage-codemod): Convert nav icon to IconElement JSX manually\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: Icons.Home,\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"ambiguous-multiple-pages","path":"tests/ambiguous-multiple-pages","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport DuplicateIcon from '@material-ui/icons/Star';\n\nconst sharedRouteRef = createRouteRef();\n\nexport const navItem = NavItemBlueprint.make({\n params: {\n title: 'Shared',\n icon: DuplicateIcon,\n routeRef: sharedRouteRef,\n },\n});\n\nexport const pageOne = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/one',\n loader: async () => null,\n },\n});\n\nexport const pageTwo = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/two',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [pageOne, pageTwo, navItem],\n};\n","output":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport DuplicateIcon from '@material-ui/icons/Star';\n\nconst sharedRouteRef = createRouteRef();\n\n// TODO(backstage-codemod): Ambiguous NavItemBlueprint pairing — multiple PageBlueprint extensions share the same routeRef\nexport const navItem = NavItemBlueprint.make({\n params: {\n title: 'Shared',\n icon: DuplicateIcon,\n routeRef: sharedRouteRef,\n },\n});\n\nexport const pageOne = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/one',\n loader: async () => null,\n },\n});\n\nexport const pageTwo = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/two',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [pageOne, pageTwo, navItem],\n};\n","filename":"input.tsx"},{"name":"basic","path":"tests/basic","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport ExampleIcon from '@material-ui/icons/Extension';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Example', icon: ExampleIcon, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/example',\n loader: () => import('./Page').then(m => ),\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport ExampleIcon from '@material-ui/icons/Extension';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Example',\n icon: ,\n routeRef,\n path: '/example',\n loader: () => import('./Page').then(m => ),\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"icon-already-jsx","path":"tests/icon-already-jsx","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: {\n title: 'Home',\n icon: ,\n routeRef,\n },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page, navItem],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: ,\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"icon-in-ts-file","path":"tests/icon-in-ts-file","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Home', icon: HomeIcon, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => import('./Page'),\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\n// TODO(backstage-codemod): Convert nav icon to IconElement JSX manually\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: HomeIcon,\n routeRef,\n path: '/home',\n loader: async () => import('./Page'),\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.ts"},{"name":"make-with-overrides","path":"tests/make-with-overrides","input":"import {\n createExtensionInput,\n PageBlueprint,\n NavItemBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport SearchIcon from '@material-ui/icons/Search';\n\nconst rootRouteRef = createRouteRef();\n\nexport const searchPage = PageBlueprint.makeWithOverrides({\n inputs: {\n items: createExtensionInput([]),\n },\n factory(originalFactory) {\n return originalFactory({\n path: '/search',\n routeRef: rootRouteRef,\n loader: async () => null,\n });\n },\n});\n\nexport const searchNavItem = NavItemBlueprint.make({\n params: {\n routeRef: rootRouteRef,\n title: 'Search',\n icon: SearchIcon,\n },\n});\n\nexport default {\n extensions: [searchPage, searchNavItem],\n};\n","output":"import {\n createExtensionInput,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport SearchIcon from '@material-ui/icons/Search';\n\nconst rootRouteRef = createRouteRef();\n\nexport const searchPage = PageBlueprint.makeWithOverrides({\n inputs: {\n items: createExtensionInput([]),\n },\n factory(originalFactory) {\n return originalFactory({\n title: 'Search',\n icon: ,\n path: '/search',\n routeRef: rootRouteRef,\n loader: async () => null,\n });\n },\n});\n\nexport default {\n extensions: [searchPage],\n};\n","filename":"input.tsx"},{"name":"make-with-overrides-two-arg","path":"tests/make-with-overrides-two-arg","input":"import {\n coreExtensionData,\n createExtensionInput,\n PageBlueprint,\n NavItemBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport BuildIcon from '@material-ui/icons/Build';\n\nconst rootRouteRef = createRouteRef();\n\nexport const devToolsPage = PageBlueprint.makeWithOverrides({\n inputs: {\n pages: createExtensionInput([coreExtensionData.reactElement]),\n },\n factory(originalFactory, { inputs }) {\n return originalFactory(\n {\n path: '/devtools',\n routeRef: rootRouteRef,\n title: 'DevTools',\n },\n {\n inputs: {\n pages: inputs.pages,\n },\n },\n );\n },\n});\n\nexport const devToolsNavItem = NavItemBlueprint.make({\n params: {\n title: 'DevTools',\n routeRef: rootRouteRef,\n icon: BuildIcon,\n },\n});\n\nexport default {\n extensions: [devToolsPage, devToolsNavItem],\n};\n","output":"import {\n coreExtensionData,\n createExtensionInput,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport BuildIcon from '@material-ui/icons/Build';\n\nconst rootRouteRef = createRouteRef();\n\nexport const devToolsPage = PageBlueprint.makeWithOverrides({\n inputs: {\n pages: createExtensionInput([coreExtensionData.reactElement]),\n },\n factory(originalFactory, { inputs }) {\n return originalFactory(\n {\n icon: ,\n path: '/devtools',\n routeRef: rootRouteRef,\n title: 'DevTools',\n },\n {\n inputs: {\n pages: inputs.pages,\n },\n },\n );\n },\n});\n\nexport default {\n extensions: [devToolsPage],\n};\n","filename":"input.tsx"},{"name":"nav-without-icon","path":"tests/nav-without-icon","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Settings', routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/settings',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Settings',\n routeRef,\n path: '/settings',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"noop-no-nav-item","path":"tests/noop-no-nav-item","input":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nexport const page = PageBlueprint.make({\n params: {\n title: 'Catalog',\n routeRef,\n path: '/catalog',\n loader: async () => null,\n },\n});\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nexport const page = PageBlueprint.make({\n params: {\n title: 'Catalog',\n routeRef,\n path: '/catalog',\n loader: async () => null,\n },\n});\n","filename":"input.tsx"}]},"defaultWorkflowName":"default","createdAt":"2026-06-17T17:57:08.942Z","updatedAt":"2026-09-06 12:29:10.434513+00"},"publishedBy":{"id":"498826df-6a91-4c45-9aed-18bea7ba2d4d","username":"cdedreuille","name":"Charles de Dreuille"},"insightsTemplate":{"packageVersionId":"53fba89b-d915-434f-821c-1778c709731a","status":"ready","generatedAt":"2026-07-21T16:22:19.602Z"},"workflows":[{"name":"default","path":"workflow.yaml","description":null,"isDefault":true,"languages":["tsx"],"stepTypes":["js-ast-grep","ai"],"workflowMetadata":{"nodes":[{"id":"apply-transforms","name":"Apply AST Transformations","steps":[{"name":"Migrate NavItemBlueprint into matching PageBlueprint extensions","type":"js-ast-grep","language":"tsx"}]},{"id":"ai-fixup","name":"AI fixup for edge cases","steps":[{"name":"Fix remaining NavItemBlueprint migration edge cases","type":"ai"}]}]}}],"packageBehavior":"workflow-only","isBundle":false,"bundleChildren":[],"parentBundles":[]},{"version":{"id":"4c10b91b-dafc-42c6-8d5c-04f38a3c631e","packageId":"2af37a1a-921b-4f29-bdeb-73329ec57d2c","version":"0.2.0","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","manifest":{"name":"@backstage/migrate-nav-item-to-page","author":"Paul Schultz","license":"MIT","targets":{"versions":{},"languages":["typescript","tsx"],"frameworks":[]},"version":"0.2.0","keywords":["backstage","migration","frontend-plugin-api","NavItemBlueprint","PageBlueprint","1.51.0"],"registry":{"access":"public","visibility":"public"},"workflow":"workflow.yaml","repository":"https://github.com/backstage/codemods","description":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0","dependencies":[],"schema_version":"1.0"},"checksum":"d4f8c5ea059df1cec2e9e5165b0e20e2ecf9f4e092a50c1f0d86611920fda468","size":11417,"downloadUrl":"https://registry-cdn.codemod.com/prod/packages/backstage/migrate-nav-item-to-page/0.2.0/public.tar.gz","aiGenerated":false,"sourceArchiveS3Key":null,"targets":{"languages":["typescript"],"frameworks":[]},"dependencies":[],"languages":["tsx"],"stepTypes":["js-ast-grep","ai"],"workflowMetadata":{"nodes":[{"id":"apply-transforms","name":"Apply AST Transformations","steps":[{"name":"Migrate NavItemBlueprint into matching PageBlueprint extensions","type":"js-ast-grep","language":"tsx"}]},{"id":"ai-fixup","name":"AI fixup for edge cases","steps":[{"name":"Fix remaining NavItemBlueprint migration edge cases","type":"ai"}]}]},"validated":false,"validationErrors":null,"publishedBy":"498826df-6a91-4c45-9aed-18bea7ba2d4d","deprecated":false,"deprecationMessage":null,"downloadCount":17,"cachedTestCases":{"input":"import {\n NavItemBlueprint as NavBP,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsNav = NavBP.make({\n params: {\n title: 'Docs',\n icon: DocsIcon,\n routeRef: docsRouteRef,\n },\n});\n\nconst docsPage = PageBlueprint.make({\n params: {\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage, docsNav],\n};\n","output":"import {\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsPage = PageBlueprint.make({\n params: {\n title: 'Docs',\n icon: ,\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage],\n};\n","isValid":true,"examples":[{"name":"alias-import","path":"tests/alias-import","input":"import {\n NavItemBlueprint as NavBP,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsNav = NavBP.make({\n params: {\n title: 'Docs',\n icon: DocsIcon,\n routeRef: docsRouteRef,\n },\n});\n\nconst docsPage = PageBlueprint.make({\n params: {\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage, docsNav],\n};\n","output":"import {\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport DocsIcon from '@material-ui/icons/Description';\n\nconst docsRouteRef = createRouteRef();\n\nconst docsPage = PageBlueprint.make({\n params: {\n title: 'Docs',\n icon: ,\n routeRef: docsRouteRef,\n path: '/docs',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [docsPage],\n};\n","filename":"input.tsx"},{"name":"ambiguous-icon","path":"tests/ambiguous-icon","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport * as Icons from '@material-ui/icons';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Home', icon: Icons.Home, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport * as Icons from '@material-ui/icons';\n\nconst routeRef = createRouteRef();\n\n// TODO(backstage-codemod): Convert nav icon to IconElement JSX manually\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: Icons.Home,\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"ambiguous-multiple-pages","path":"tests/ambiguous-multiple-pages","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport DuplicateIcon from '@material-ui/icons/Star';\n\nconst sharedRouteRef = createRouteRef();\n\nexport const navItem = NavItemBlueprint.make({\n params: {\n title: 'Shared',\n icon: DuplicateIcon,\n routeRef: sharedRouteRef,\n },\n});\n\nexport const pageOne = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/one',\n loader: async () => null,\n },\n});\n\nexport const pageTwo = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/two',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [pageOne, pageTwo, navItem],\n};\n","output":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport DuplicateIcon from '@material-ui/icons/Star';\n\nconst sharedRouteRef = createRouteRef();\n\n// TODO(backstage-codemod): Ambiguous NavItemBlueprint pairing — multiple PageBlueprint extensions share the same routeRef\nexport const navItem = NavItemBlueprint.make({\n params: {\n title: 'Shared',\n icon: DuplicateIcon,\n routeRef: sharedRouteRef,\n },\n});\n\nexport const pageOne = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/one',\n loader: async () => null,\n },\n});\n\nexport const pageTwo = PageBlueprint.make({\n params: {\n routeRef: sharedRouteRef,\n path: '/two',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [pageOne, pageTwo, navItem],\n};\n","filename":"input.tsx"},{"name":"basic","path":"tests/basic","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport ExampleIcon from '@material-ui/icons/Extension';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Example', icon: ExampleIcon, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/example',\n loader: () => import('./Page').then(m => ),\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport ExampleIcon from '@material-ui/icons/Extension';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Example',\n icon: ,\n routeRef,\n path: '/example',\n loader: () => import('./Page').then(m => ),\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"icon-already-jsx","path":"tests/icon-already-jsx","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: {\n title: 'Home',\n icon: ,\n routeRef,\n },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page, navItem],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: ,\n routeRef,\n path: '/home',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"icon-in-ts-file","path":"tests/icon-in-ts-file","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Home', icon: HomeIcon, routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/home',\n loader: async () => import('./Page'),\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\nimport HomeIcon from '@material-ui/icons/Home';\n\nconst routeRef = createRouteRef();\n\n// TODO(backstage-codemod): Convert nav icon to IconElement JSX manually\nconst page = PageBlueprint.make({\n params: {\n title: 'Home',\n icon: HomeIcon,\n routeRef,\n path: '/home',\n loader: async () => import('./Page'),\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.ts"},{"name":"make-with-overrides","path":"tests/make-with-overrides","input":"import {\n createExtensionInput,\n PageBlueprint,\n NavItemBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport SearchIcon from '@material-ui/icons/Search';\n\nconst rootRouteRef = createRouteRef();\n\nexport const searchPage = PageBlueprint.makeWithOverrides({\n inputs: {\n items: createExtensionInput([]),\n },\n factory(originalFactory) {\n return originalFactory({\n path: '/search',\n routeRef: rootRouteRef,\n loader: async () => null,\n });\n },\n});\n\nexport const searchNavItem = NavItemBlueprint.make({\n params: {\n routeRef: rootRouteRef,\n title: 'Search',\n icon: SearchIcon,\n },\n});\n\nexport default {\n extensions: [searchPage, searchNavItem],\n};\n","output":"import {\n createExtensionInput,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport SearchIcon from '@material-ui/icons/Search';\n\nconst rootRouteRef = createRouteRef();\n\nexport const searchPage = PageBlueprint.makeWithOverrides({\n inputs: {\n items: createExtensionInput([]),\n },\n factory(originalFactory) {\n return originalFactory({\n title: 'Search',\n icon: ,\n path: '/search',\n routeRef: rootRouteRef,\n loader: async () => null,\n });\n },\n});\n\nexport default {\n extensions: [searchPage],\n};\n","filename":"input.tsx"},{"name":"make-with-overrides-two-arg","path":"tests/make-with-overrides-two-arg","input":"import {\n coreExtensionData,\n createExtensionInput,\n PageBlueprint,\n NavItemBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport BuildIcon from '@material-ui/icons/Build';\n\nconst rootRouteRef = createRouteRef();\n\nexport const devToolsPage = PageBlueprint.makeWithOverrides({\n inputs: {\n pages: createExtensionInput([coreExtensionData.reactElement]),\n },\n factory(originalFactory, { inputs }) {\n return originalFactory(\n {\n path: '/devtools',\n routeRef: rootRouteRef,\n title: 'DevTools',\n },\n {\n inputs: {\n pages: inputs.pages,\n },\n },\n );\n },\n});\n\nexport const devToolsNavItem = NavItemBlueprint.make({\n params: {\n title: 'DevTools',\n routeRef: rootRouteRef,\n icon: BuildIcon,\n },\n});\n\nexport default {\n extensions: [devToolsPage, devToolsNavItem],\n};\n","output":"import {\n coreExtensionData,\n createExtensionInput,\n PageBlueprint,\n createRouteRef,\n} from '@backstage/frontend-plugin-api';\nimport BuildIcon from '@material-ui/icons/Build';\n\nconst rootRouteRef = createRouteRef();\n\nexport const devToolsPage = PageBlueprint.makeWithOverrides({\n inputs: {\n pages: createExtensionInput([coreExtensionData.reactElement]),\n },\n factory(originalFactory, { inputs }) {\n return originalFactory(\n {\n icon: ,\n path: '/devtools',\n routeRef: rootRouteRef,\n title: 'DevTools',\n },\n {\n inputs: {\n pages: inputs.pages,\n },\n },\n );\n },\n});\n\nexport default {\n extensions: [devToolsPage],\n};\n","filename":"input.tsx"},{"name":"nav-without-icon","path":"tests/nav-without-icon","input":"import { NavItemBlueprint, PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nconst navItem = NavItemBlueprint.make({\n params: { title: 'Settings', routeRef },\n});\n\nconst page = PageBlueprint.make({\n params: {\n routeRef,\n path: '/settings',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [navItem, page],\n};\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nconst page = PageBlueprint.make({\n params: {\n title: 'Settings',\n routeRef,\n path: '/settings',\n loader: async () => null,\n },\n});\n\nexport default {\n extensions: [page],\n};\n","filename":"input.tsx"},{"name":"noop-no-nav-item","path":"tests/noop-no-nav-item","input":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nexport const page = PageBlueprint.make({\n params: {\n title: 'Catalog',\n routeRef,\n path: '/catalog',\n loader: async () => null,\n },\n});\n","output":"import { PageBlueprint, createRouteRef } from '@backstage/frontend-plugin-api';\n\nconst routeRef = createRouteRef();\n\nexport const page = PageBlueprint.make({\n params: {\n title: 'Catalog',\n routeRef,\n path: '/catalog',\n loader: async () => null,\n },\n});\n","filename":"input.tsx"}]},"defaultWorkflowName":"default","createdAt":"2026-06-01T19:47:34.403Z","updatedAt":"2026-09-06 12:29:10.704469+00"},"publishedBy":{"id":"498826df-6a91-4c45-9aed-18bea7ba2d4d","username":"cdedreuille","name":"Charles de Dreuille"},"insightsTemplate":null,"workflows":[{"name":"default","path":"workflow.yaml","description":null,"isDefault":true,"languages":["tsx"],"stepTypes":["js-ast-grep","ai"],"workflowMetadata":{"nodes":[{"id":"apply-transforms","name":"Apply AST Transformations","steps":[{"name":"Migrate NavItemBlueprint into matching PageBlueprint extensions","type":"js-ast-grep","language":"tsx"}]},{"id":"ai-fixup","name":"AI fixup for edge cases","steps":[{"name":"Fix remaining NavItemBlueprint migration edge cases","type":"ai"}]}]}}],"packageBehavior":"workflow-only","isBundle":false,"bundleChildren":[],"parentBundles":[]}],"distTags":{"latest":"0.2.2"},"latestPackageBehavior":"workflow-only","cachedTestCases":"$1a:1:props:state:queries:0:state:data:json:versions:0:version:cachedTestCases"},"meta":{"values":{"versions.0.version.createdAt":["Date"],"versions.0.insightsTemplate.generatedAt":["Date"],"versions.0.parentBundles.0.createdAt":["Date"],"versions.0.parentBundles.1.createdAt":["Date"],"versions.0.parentBundles.2.createdAt":["Date"],"versions.0.parentBundles.3.createdAt":["Date"],"versions.1.version.createdAt":["Date"],"versions.1.insightsTemplate.generatedAt":["Date"],"versions.2.version.createdAt":["Date"]},"referentialEqualities":{"cachedTestCases":["versions.0.version.cachedTestCases"]}}},"dataUpdateCount":1,"dataUpdatedAt":1790115343764,"error":null,"errorUpdateCount":0,"errorUpdatedAt":0,"fetchFailureCount":0,"fetchFailureReason":null,"fetchMeta":null,"isInvalidated":false,"status":"success","fetchStatus":"idle"},"queryKey":[["registry","getPackage"],{"input":{"name":"migrate-nav-item-to-page","scope":"backstage"},"type":"query"}],"queryHash":"[[\"registry\",\"getPackage\"],{\"input\":{\"name\":\"migrate-nav-item-to-page\",\"scope\":\"backstage\"},\"type\":\"query\"}]"}]},"children":"$L4b"}]] 1d:null 21:[["$","title","0",{"children":"backstage/migrate-nav-item-to-page - Codemod Registry"}],["$","meta","1",{"name":"description","content":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0"}],["$","meta","2",{"name":"author","content":"backstage"}],["$","meta","3",{"name":"keywords","content":"migrate-nav-item-to-page, codemod, code transformation, automated refactoring, package, registry, backstage, migration, frontend-plugin-api, NavItemBlueprint, PageBlueprint, 1.51.0"}],["$","meta","4",{"name":"creator","content":"backstage"}],["$","meta","5",{"name":"publisher","content":"Codemod"}],["$","meta","6",{"name":"robots","content":"index, follow"}],["$","meta","7",{"name":"googlebot","content":"index, follow, max-video-preview:-1, max-image-preview:large, max-snippet:-1"}],["$","meta","8",{"name":"application-name","content":"Codemod Registry"}],["$","meta","9",{"name":"apple-mobile-web-app-title","content":"Codemod"}],["$","meta","10",{"name":"apple-mobile-web-app-capable","content":"yes"}],["$","meta","11",{"name":"apple-mobile-web-app-status-bar-style","content":"default"}],["$","meta","12",{"name":"format-detection","content":"telephone=no"}],["$","meta","13",{"name":"mobile-web-app-capable","content":"yes"}],["$","meta","14",{"name":"msapplication-config","content":"/browserconfig.xml"}],["$","meta","15",{"name":"msapplication-TileColor","content":"#000000"}],["$","meta","16",{"name":"msapplication-tap-highlight","content":"no"}],["$","meta","17",{"name":"theme-color","content":"#000000"}],["$","meta","18",{"name":"viewport","content":"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"}],["$","link","19",{"rel":"canonical","href":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page"}],["$","meta","20",{"property":"og:title","content":"backstage/migrate-nav-item-to-page - Codemod Registry"}],["$","meta","21",{"property":"og:description","content":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0"}],["$","meta","22",{"property":"og:url","content":"https://app.codemod.com/registry/@backstage/migrate-nav-item-to-page"}],["$","meta","23",{"property":"og:site_name","content":"Codemod Registry"}],["$","meta","24",{"property":"og:locale","content":"en_US"}],["$","meta","25",{"property":"og:image","content":"https://app.codemod.com/api/og/registry/@backstage/migrate-nav-item-to-page"}],["$","meta","26",{"property":"og:image:width","content":"1200"}],["$","meta","27",{"property":"og:image:height","content":"630"}],["$","meta","28",{"property":"og:image:alt","content":"migrate-nav-item-to-page package"}],["$","meta","29",{"property":"og:type","content":"website"}],["$","meta","30",{"name":"twitter:card","content":"summary_large_image"}],["$","meta","31",{"name":"twitter:site","content":"@codemod"}],["$","meta","32",{"name":"twitter:creator","content":"@codemod"}],["$","meta","33",{"name":"twitter:title","content":"backstage/migrate-nav-item-to-page - Codemod Registry"}],["$","meta","34",{"name":"twitter:description","content":"Migrate NavItemBlueprint to PageBlueprint title/icon params for Backstage 1.51.0"}],["$","meta","35",{"name":"twitter:image","content":"https://app.codemod.com/api/og/registry/@backstage/migrate-nav-item-to-page"}]]