From 4c1f50cbd2062ff7516887a6ab1d772d17728a14 Mon Sep 17 00:00:00 2001
From: Patrik Oldsberg <poldsberg@gmail.com>
Date: Sun, 7 Jan 2024 14:37:56 +0100
Subject: [PATCH 1/2] core-compat-api: wrap discovered elements with
 compatWrapper

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
---
 .changeset/brave-queens-crash.md              |  5 +++++
 .../src/collectLegacyRoutes.tsx               | 19 +++++++++++--------
 2 files changed, 16 insertions(+), 8 deletions(-)
 create mode 100644 .changeset/brave-queens-crash.md

diff --git a/.changeset/brave-queens-crash.md b/.changeset/brave-queens-crash.md
new file mode 100644
index 0000000000..c28e5975f3
--- /dev/null
+++ b/.changeset/brave-queens-crash.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core-compat-api': patch
+---
+
+Make `convertLegacyApp` wrap discovered routes with `compatWrapper`.
diff --git a/packages/core-compat-api/src/collectLegacyRoutes.tsx b/packages/core-compat-api/src/collectLegacyRoutes.tsx
index b4af6ac01a..4d560b81d5 100644
--- a/packages/core-compat-api/src/collectLegacyRoutes.tsx
+++ b/packages/core-compat-api/src/collectLegacyRoutes.tsx
@@ -33,6 +33,7 @@ import {
 import React, { Children, ReactNode, isValidElement } from 'react';
 import { Route, Routes } from 'react-router-dom';
 import { convertLegacyRouteRef } from './convertLegacyRouteRef';
+import { compatWrapper } from './compatWrapper';
 
 /*
 
@@ -207,14 +208,16 @@ export function collectLegacyRoutes(
             }),
           },
           loader: async () =>
-            route.props.children ? (
-              <Routes>
-                <Route path="*" element={routeElement}>
-                  <Route path="*" element={route.props.children} />
-                </Route>
-              </Routes>
-            ) : (
-              routeElement
+            compatWrapper(
+              route.props.children ? (
+                <Routes>
+                  <Route path="*" element={routeElement}>
+                    <Route path="*" element={route.props.children} />
+                  </Route>
+                </Routes>
+              ) : (
+                routeElement
+              ),
             ),
         }),
       );

From 4ffb18a5074d0a514f5a17526e73b6dd03771148 Mon Sep 17 00:00:00 2001
From: Patrik Oldsberg <poldsberg@gmail.com>
Date: Mon, 8 Jan 2024 12:13:44 +0100
Subject: [PATCH 2/2] core-compat-api: add test for legacy API access

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
---
 packages/core-compat-api/package.json         |  1 +
 .../src/collectLegacyRoutes.test.tsx          | 38 +++++++++++++++++++
 yarn.lock                                     |  1 +
 3 files changed, 40 insertions(+)

diff --git a/packages/core-compat-api/package.json b/packages/core-compat-api/package.json
index 29f70aae68..f5de02c154 100644
--- a/packages/core-compat-api/package.json
+++ b/packages/core-compat-api/package.json
@@ -35,6 +35,7 @@
   },
   "devDependencies": {
     "@backstage/cli": "workspace:^",
+    "@backstage/frontend-app-api": "workspace:^",
     "@backstage/frontend-test-utils": "workspace:^",
     "@backstage/plugin-catalog": "workspace:^",
     "@backstage/plugin-puppetdb": "workspace:^",
diff --git a/packages/core-compat-api/src/collectLegacyRoutes.test.tsx b/packages/core-compat-api/src/collectLegacyRoutes.test.tsx
index ed6807514d..240aa33e2c 100644
--- a/packages/core-compat-api/src/collectLegacyRoutes.test.tsx
+++ b/packages/core-compat-api/src/collectLegacyRoutes.test.tsx
@@ -32,6 +32,14 @@ import { 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 {
+  createPlugin,
+  createRoutableExtension,
+  createRouteRef,
+  useApp,
+} from '@backstage/core-plugin-api';
+import { createSpecializedApp } from '@backstage/frontend-app-api';
+import { render, screen } from '@testing-library/react';
 
 describe('collectLegacyRoutes', () => {
   it('should collect legacy routes', () => {
@@ -241,4 +249,34 @@ describe('collectLegacyRoutes', () => {
       },
     ]);
   });
+
+  it('should make legacy APIs available', async () => {
+    const plugin = createPlugin({
+      id: 'test',
+    });
+    const routeRef = createRouteRef({ id: 'test' });
+    const Page = plugin.provide(
+      createRoutableExtension({
+        name: 'Test',
+        mountPoint: routeRef,
+        component: () =>
+          Promise.resolve(() => {
+            const app = useApp();
+            return <div>plugins: {app.getPlugins().map(p => p.getId())}</div>;
+          }),
+      }),
+    );
+
+    const features = collectLegacyRoutes(
+      <FlatRoutes>
+        <Route path="/" element={<Page />} />
+      </FlatRoutes>,
+    );
+
+    render(createSpecializedApp({ features }).createRoot());
+
+    await expect(
+      screen.findByText('plugins: test'),
+    ).resolves.toBeInTheDocument();
+  });
 });
diff --git a/yarn.lock b/yarn.lock
index 15212e967e..53d8974d6c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3797,6 +3797,7 @@ __metadata:
     "@backstage/cli": "workspace:^"
     "@backstage/core-app-api": "workspace:^"
     "@backstage/core-plugin-api": "workspace:^"
+    "@backstage/frontend-app-api": "workspace:^"
     "@backstage/frontend-plugin-api": "workspace:^"
     "@backstage/frontend-test-utils": "workspace:^"
     "@backstage/plugin-catalog": "workspace:^"