From 86346c2c11dbe15fd2be2bd3f6e924b13239e622 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fredrik=20Adel=C3=B6w?= <freben@gmail.com>
Date: Sat, 20 Jan 2024 11:16:25 +0100
Subject: [PATCH] simplify route bindings in config
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Fredrik Adelöw <freben@gmail.com>
---
 .changeset/silent-hotels-knock.md             | 25 +++++++++++++++++++
 .../frontend-system/architecture/07-routes.md |  4 +--
 packages/app-next/app-config.yaml             |  6 ++---
 .../src/routing/collectRouteIds.test.ts       | 10 +++-----
 .../src/routing/collectRouteIds.ts            |  4 +--
 5 files changed, 36 insertions(+), 13 deletions(-)
 create mode 100644 .changeset/silent-hotels-knock.md

diff --git a/.changeset/silent-hotels-knock.md b/.changeset/silent-hotels-knock.md
new file mode 100644
index 0000000000..7ff5d978d2
--- /dev/null
+++ b/.changeset/silent-hotels-knock.md
@@ -0,0 +1,25 @@
+---
+'@backstage/frontend-app-api': minor
+---
+
+**BREAKING**: The `app.routes.bindings` app-config mapping has been simplified. You now only need to specify the plugin ID and route ID on both sides of the mapping.
+
+Old form:
+
+```yaml
+app:
+  routes:
+    bindings:
+      plugin.catalog.externalRoutes.viewTechDoc: plugin.techdocs.routes.docRoot
+      plugin.catalog.externalRoutes.createComponent: plugin.catalog-import.routes.importPage
+```
+
+New form:
+
+```yaml
+app:
+  routes:
+    bindings:
+      catalog.viewTechDoc: techdocs.docRoot
+      catalog.createComponent: catalog-import.importPage
+```
diff --git a/docs/frontend-system/architecture/07-routes.md b/docs/frontend-system/architecture/07-routes.md
index 8351a864ba..11586573be 100644
--- a/docs/frontend-system/architecture/07-routes.md
+++ b/docs/frontend-system/architecture/07-routes.md
@@ -241,10 +241,10 @@ app:
     bindings:
       # point to the Scaffolder create component page when the Catalog create component ref is used
       # highlight-next-line
-      plugin.catalog.externalRoutes.createComponent: plugin.scaffolder.routes.index
+      catalog.createComponent: scaffolder.index
       # point to the Catalog details page when the Scaffolder component details ref is used
       # highlight-next-line
-      plugin.scaffolder.externalRoutes.componentDetails: plugin.catalog.routes.details
+      scaffolder.componentDetails: catalog.details
 ```
 
 We also have the ability to express this in code as an option to `createApp`, but you of course only need to use one of these two methods:
diff --git a/packages/app-next/app-config.yaml b/packages/app-next/app-config.yaml
index 1b77205d5e..9cc3507fa4 100644
--- a/packages/app-next/app-config.yaml
+++ b/packages/app-next/app-config.yaml
@@ -3,9 +3,9 @@ app:
     packages: 'all' # ✨
   routes:
     bindings:
-      plugin.pages.externalRoutes.pageX: plugin.pages.routes.pageX
-      plugin.catalog.externalRoutes.viewTechDoc: plugin.techdocs.routes.docRoot
-      plugin.catalog.externalRoutes.createComponent: plugin.catalog-import.routes.importPage
+      pages.pageX: pages.pageX
+      catalog.viewTechDoc: techdocs.docRoot
+      catalog.createComponent: catalog-import.importPage
 
   extensions:
     # - apis.plugin.graphiql.browse.gitlab: true
diff --git a/packages/frontend-app-api/src/routing/collectRouteIds.test.ts b/packages/frontend-app-api/src/routing/collectRouteIds.test.ts
index 95a5afd8cd..6b9fdecf70 100644
--- a/packages/frontend-app-api/src/routing/collectRouteIds.test.ts
+++ b/packages/frontend-app-api/src/routing/collectRouteIds.test.ts
@@ -37,15 +37,13 @@ describe('collectRouteIds', () => {
       createPlugin({ id: 'test', routes: { ref }, externalRoutes: { extRef } }),
     ]);
     expect(Object.fromEntries(collected.routes)).toEqual({
-      'plugin.test.routes.ref': ref,
+      'test.ref': ref,
     });
     expect(Object.fromEntries(collected.externalRoutes)).toEqual({
-      'plugin.test.externalRoutes.extRef': extRef,
+      'test.extRef': extRef,
     });
 
-    expect(String(ref)).toBe('RouteRef{plugin.test.routes.ref}');
-    expect(String(extRef)).toBe(
-      'ExternalRouteRef{plugin.test.externalRoutes.extRef}',
-    );
+    expect(String(ref)).toBe('RouteRef{test.ref}');
+    expect(String(extRef)).toBe('ExternalRouteRef{test.extRef}');
   });
 });
diff --git a/packages/frontend-app-api/src/routing/collectRouteIds.ts b/packages/frontend-app-api/src/routing/collectRouteIds.ts
index 2fbb8b6791..d45871ae89 100644
--- a/packages/frontend-app-api/src/routing/collectRouteIds.ts
+++ b/packages/frontend-app-api/src/routing/collectRouteIds.ts
@@ -47,7 +47,7 @@ export function collectRouteIds(features: FrontendFeature[]): RouteRefsById {
     }
 
     for (const [name, ref] of Object.entries(feature.routes)) {
-      const refId = `plugin.${feature.id}.routes.${name}`;
+      const refId = `${feature.id}.${name}`;
       if (routesById.has(refId)) {
         throw new Error(`Unexpected duplicate route '${refId}'`);
       }
@@ -62,7 +62,7 @@ export function collectRouteIds(features: FrontendFeature[]): RouteRefsById {
       }
     }
     for (const [name, ref] of Object.entries(feature.externalRoutes)) {
-      const refId = `plugin.${feature.id}.externalRoutes.${name}`;
+      const refId = `${feature.id}.${name}`;
       if (externalRoutesById.has(refId)) {
         throw new Error(`Unexpected duplicate external route '${refId}'`);
       }