@backstage/core-compat-api 0.3.6 → 0.3.7-next.1

package/CHANGELOG.md

@@ -1,5 +1,71 @@
 # @backstage/core-compat-api
 
+## 0.3.7-next.1
+
+### Patch Changes
+
+- d34e0e5: Added a new `convertLegacyAppOptions` helper that converts many of the options passed to `createApp` in the old frontend system to a module with app overrides for the new system. The supported options are `apis`, `icons`, `plugins`, `components`, and `themes`.
+
+  For example, given the following options for the old `createApp`:
+
+  ```ts
+  import { createApp } from '@backstage/app-deafults';
+
+  const app = createApp({
+    apis,
+    plugins,
+    icons: {
+      custom: MyIcon,
+    },
+    components: {
+      SignInPage: MySignInPage,
+    },
+    themes: [myTheme],
+  });
+  ```
+
+  They can be converted to the new system like this:
+
+  ```ts
+  import { createApp } from '@backstage/frontend-deafults';
+  import { convertLegacyAppOptions } from '@backstage/core-compat-api';
+
+  const app = createApp({
+    features: [
+      convertLegacyAppOptions({
+        apis,
+        plugins,
+        icons: {
+          custom: MyIcon,
+        },
+        components: {
+          SignInPage: MySignInPage,
+        },
+        themes: [myTheme],
+      }),
+    ],
+  });
+  ```
+
+- 18faf65: The `convertLegacyApp` has received the following changes:
+
+  - `null` routes will now be ignored.
+  - Converted routes no longer need to belong to a plugin, falling back to a `converted-orphan-routes` plugin instead.
+  - The generate layout override extension is now properly attached to the `app/root` extension.
+  - Converted root elements are now automatically wrapped with `compatWrapper`.
+
+- Updated dependencies
+  - @backstage/core-plugin-api@1.10.4
+  - @backstage/frontend-plugin-api@0.9.6-next.1
+  - @backstage/version-bridge@1.0.11
+
+## 0.3.7-next.0
+
+### Patch Changes
+
+- Updated dependencies
+  - @backstage/frontend-plugin-api@0.9.6-next.0
+
 ## 0.3.6
 
 ### Patch Changes

package/dist/collectLegacyRoutes.esm.js

@@ -1,4 +1,4 @@
-import { getComponentData } from '@backstage/core-plugin-api';
+import { createPlugin, getComponentData } from '@backstage/core-plugin-api';
 import { PageBlueprint, createExtensionInput, coreExtensionData, createFrontendPlugin, ApiBlueprint, createExtension } from '@backstage/frontend-plugin-api';
 import React, { Children, isValidElement } from 'react';
 import { Route, Routes } from 'react-router-dom';
@@ -73,6 +73,7 @@ function collectLegacyRoutes(flatRoutesElement) {
     let currentIndex = 1;
     return () => String(currentIndex++);
   })();
+  const orphanRoutesPlugin = createPlugin({ id: "converted-orphan-routes" });
   const getPluginExtensions = (plugin) => {
     let extensions = pluginExtensions.get(plugin);
     if (!extensions) {
@@ -84,6 +85,9 @@ function collectLegacyRoutes(flatRoutesElement) {
   React.Children.forEach(
     flatRoutesElement.props.children,
     (route) => {
+      if (route === null) {
+        return;
+      }
       if (!React.isValidElement(route)) {
         throw new Error(
           `Invalid element inside FlatRoutes, expected Route but found element of type ${typeof route}.`
@@ -96,20 +100,11 @@ function collectLegacyRoutes(flatRoutesElement) {
       }
       const routeElement = route.props.element;
       const path = route.props.path;
-      const plugin = getComponentData(
-        routeElement,
-        "core.plugin"
-      );
+      const plugin = getComponentData(routeElement, "core.plugin") ?? orphanRoutesPlugin;
       const routeRef = getComponentData(
         routeElement,
         "core.mountPoint"
       );
-      if (!plugin) {
-        throw new Error(
-          // TODO(vinzscam): add See <link-to-app-migration-docs> for more info
-          `Route with path ${path} has en element that can not be converted as it does not belong to a plugin. Make sure that the top-level React element of the element prop is an extension from a Backstage plugin, or remove the Route completely.`
-        );
-      }
       if (path === void 0) {
         throw new Error(
           `Route element inside FlatRoutes had no path prop value given`

package/dist/collectLegacyRoutes.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"collectLegacyRoutes.esm.js","sources":["../src/collectLegacyRoutes.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  AnyRouteRefParams,\n  BackstagePlugin as LegacyBackstagePlugin,\n  RouteRef,\n  getComponentData,\n} from '@backstage/core-plugin-api';\nimport {\n  FrontendPlugin,\n  ExtensionDefinition,\n  coreExtensionData,\n  createExtension,\n  createExtensionInput,\n  createFrontendPlugin,\n  ApiBlueprint,\n  PageBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport React, { Children, ReactNode, isValidElement } from 'react';\nimport { Route, Routes } from 'react-router-dom';\nimport {\n  convertLegacyRouteRef,\n  convertLegacyRouteRefs,\n} from './convertLegacyRouteRef';\nimport { compatWrapper } from './compatWrapper';\n\n/*\n\n# Legacy interoperability\n\nUse-cases (prioritized):\n 1. Slowly migrate over an existing app to DI, piece by piece\n 2. Use a legacy plugin in a new DI app\n 3. Use DI in an existing legacy app\n\nStarting point: use-case #1\n\nPotential solutions:\n 1. Codemods (we're not considering this for now)\n 2. Legacy apps are migrated bottom-up, i.e. keep legacy root, replace pages with DI\n 3. Legacy apps are migrated top-down i.e. switch out base to DI, legacy adapter allows for usage of existing app structure\n\nChosen path: #3\n\nExisting tasks:\n  - Adopters can migrate their existing app gradually (~4)\n    - Example-app uses legacy base with DI adapters\n    - Create an API that lets you inject DI into existing apps - working assumption is that this is enough\n  - Adopters can use legacy plugins in DI through adapters (~8)\n    - App-next uses DI base with legacy adapters\n    - Create a legacy adapter that is able to take an existing extension tree\n\n*/\n\n// Creates a shim extension whose purpose is to build up the tree (anchored at\n// the root page) of paths/routeRefs so that the app can bind them properly.\nfunction makeRoutingShimExtension(options: {\n  name: string;\n  parentExtensionId: string;\n  routePath?: string;\n  routeRef?: RouteRef;\n}) {\n  const { name, parentExtensionId, routePath, routeRef } = options;\n  return createExtension({\n    kind: 'routing-shim',\n    name,\n    attachTo: { id: parentExtensionId, input: 'childRoutingShims' },\n    inputs: {\n      childRoutingShims: createExtensionInput([\n        coreExtensionData.routePath.optional(),\n        coreExtensionData.routeRef.optional(),\n      ]),\n    },\n    output: [\n      coreExtensionData.routePath.optional(),\n      coreExtensionData.routeRef.optional(),\n    ],\n    *factory() {\n      if (routePath !== undefined) {\n        yield coreExtensionData.routePath(routePath);\n      }\n\n      if (routeRef) {\n        yield coreExtensionData.routeRef(convertLegacyRouteRef(routeRef));\n      }\n    },\n  });\n}\n\nfunction visitRouteChildren(options: {\n  children: ReactNode;\n  parentExtensionId: string;\n  context: {\n    pluginId: string;\n    extensions: ExtensionDefinition[];\n    getUniqueName: () => string;\n    discoverPlugin: (plugin: LegacyBackstagePlugin) => void;\n  };\n}): void {\n  const { children, parentExtensionId, context } = options;\n  const { pluginId, extensions, getUniqueName, discoverPlugin } = context;\n\n  Children.forEach(children, node => {\n    if (!isValidElement(node)) {\n      return;\n    }\n\n    const plugin = getComponentData<LegacyBackstagePlugin>(node, 'core.plugin');\n    const routeRef = getComponentData<RouteRef<AnyRouteRefParams>>(\n      node,\n      'core.mountPoint',\n    );\n    const routePath: string | undefined = node.props?.path;\n\n    if (plugin) {\n      // We just mark the plugin as discovered, but don't change the context\n      discoverPlugin(plugin);\n    }\n\n    let nextParentExtensionId = parentExtensionId;\n    if (routeRef || routePath) {\n      const nextParentExtensionName = getUniqueName();\n      nextParentExtensionId = `routing-shim:${pluginId}/${nextParentExtensionName}`;\n      extensions.push(\n        makeRoutingShimExtension({\n          name: nextParentExtensionName,\n          parentExtensionId,\n          routePath,\n          routeRef,\n        }),\n      );\n    }\n\n    visitRouteChildren({\n      children: node.props.children,\n      parentExtensionId: nextParentExtensionId,\n      context,\n    });\n  });\n}\n\n/** @internal */\nexport function collectLegacyRoutes(\n  flatRoutesElement: JSX.Element,\n): FrontendPlugin[] {\n  const pluginExtensions = new Map<\n    LegacyBackstagePlugin,\n    ExtensionDefinition[]\n  >();\n\n  const getUniqueName = (() => {\n    let currentIndex = 1;\n    return () => String(currentIndex++);\n  })();\n\n  const getPluginExtensions = (plugin: LegacyBackstagePlugin) => {\n    let extensions = pluginExtensions.get(plugin);\n    if (!extensions) {\n      extensions = [];\n      pluginExtensions.set(plugin, extensions);\n    }\n    return extensions;\n  };\n\n  React.Children.forEach(\n    flatRoutesElement.props.children,\n    (route: ReactNode) => {\n      // TODO(freben): Handle feature flag and permissions framework wrapper elements\n      if (!React.isValidElement(route)) {\n        throw new Error(\n          `Invalid element inside FlatRoutes, expected Route but found element of type ${typeof route}.`,\n        );\n      }\n      if (route.type !== Route) {\n        throw new Error(\n          `Invalid element inside FlatRoutes, expected Route but found ${route.type}.`,\n        );\n      }\n      const routeElement = route.props.element;\n      const path: string | undefined = route.props.path;\n      const plugin = getComponentData<LegacyBackstagePlugin>(\n        routeElement,\n        'core.plugin',\n      );\n      const routeRef = getComponentData<RouteRef>(\n        routeElement,\n        'core.mountPoint',\n      );\n      if (!plugin) {\n        throw new Error(\n          // TODO(vinzscam): add See <link-to-app-migration-docs> for more info\n          `Route with path ${path} has en element that can not be converted as it does not belong to a plugin. Make sure that the top-level React element of the element prop is an extension from a Backstage plugin, or remove the Route completely.`,\n        );\n      }\n      if (path === undefined) {\n        throw new Error(\n          `Route element inside FlatRoutes had no path prop value given`,\n        );\n      }\n\n      const extensions = getPluginExtensions(plugin);\n      const pageExtensionName = extensions.length ? getUniqueName() : undefined;\n      const pageExtensionId = `page:${plugin.getId()}${\n        pageExtensionName ? `/${pageExtensionName}` : pageExtensionName\n      }`;\n\n      extensions.push(\n        PageBlueprint.makeWithOverrides({\n          name: pageExtensionName,\n          inputs: {\n            childRoutingShims: createExtensionInput([\n              coreExtensionData.routePath.optional(),\n              coreExtensionData.routeRef.optional(),\n            ]),\n          },\n          factory(originalFactory, { inputs: _inputs }) {\n            // todo(blam): why do we not use the inputs here?\n            return originalFactory({\n              defaultPath: path[0] === '/' ? path.slice(1) : path,\n              routeRef: routeRef ? convertLegacyRouteRef(routeRef) : undefined,\n              loader: async () =>\n                compatWrapper(\n                  route.props.children ? (\n                    <Routes>\n                      <Route path=\"*\" element={routeElement}>\n                        <Route path=\"*\" element={route.props.children} />\n                      </Route>\n                    </Routes>\n                  ) : (\n                    routeElement\n                  ),\n                ),\n            });\n          },\n        }),\n      );\n\n      visitRouteChildren({\n        children: route.props.children,\n        parentExtensionId: pageExtensionId,\n        context: {\n          pluginId: plugin.getId(),\n          extensions,\n          getUniqueName,\n          discoverPlugin: getPluginExtensions,\n        },\n      });\n    },\n  );\n\n  return Array.from(pluginExtensions).map(([plugin, extensions]) =>\n    createFrontendPlugin({\n      id: plugin.getId(),\n      extensions: [\n        ...extensions,\n        ...Array.from(plugin.getApis()).map(factory =>\n          ApiBlueprint.make({\n            name: factory.api.id,\n            params: { factory },\n          }),\n        ),\n      ],\n      routes: convertLegacyRouteRefs(plugin.routes ?? {}),\n      externalRoutes: convertLegacyRouteRefs(plugin.externalRoutes ?? {}),\n    }),\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAsEA,SAAS,yBAAyB,OAK/B,EAAA;AACD,EAAA,MAAM,EAAE,IAAA,EAAM,iBAAmB,EAAA,SAAA,EAAW,UAAa,GAAA,OAAA;AACzD,EAAA,OAAO,eAAgB,CAAA;AAAA,IACrB,IAAM,EAAA,cAAA;AAAA,IACN,IAAA;AAAA,IACA,QAAU,EAAA,EAAE,EAAI,EAAA,iBAAA,EAAmB,OAAO,mBAAoB,EAAA;AAAA,IAC9D,MAAQ,EAAA;AAAA,MACN,mBAAmB,oBAAqB,CAAA;AAAA,QACtC,iBAAA,CAAkB,UAAU,QAAS,EAAA;AAAA,QACrC,iBAAA,CAAkB,SAAS,QAAS;AAAA,OACrC;AAAA,KACH;AAAA,IACA,MAAQ,EAAA;AAAA,MACN,iBAAA,CAAkB,UAAU,QAAS,EAAA;AAAA,MACrC,iBAAA,CAAkB,SAAS,QAAS;AAAA,KACtC;AAAA,IACA,CAAC,OAAU,GAAA;AACT,MAAA,IAAI,cAAc,KAAW,CAAA,EAAA;AAC3B,QAAM,MAAA,iBAAA,CAAkB,UAAU,SAAS,CAAA;AAAA;AAG7C,MAAA,IAAI,QAAU,EAAA;AACZ,QAAA,MAAM,iBAAkB,CAAA,QAAA,CAAS,qBAAsB,CAAA,QAAQ,CAAC,CAAA;AAAA;AAClE;AACF,GACD,CAAA;AACH;AAEA,SAAS,mBAAmB,OASnB,EAAA;AACP,EAAA,MAAM,EAAE,QAAA,EAAU,iBAAmB,EAAA,OAAA,EAAY,GAAA,OAAA;AACjD,EAAA,MAAM,EAAE,QAAA,EAAU,UAAY,EAAA,aAAA,EAAe,gBAAmB,GAAA,OAAA;AAEhE,EAAS,QAAA,CAAA,OAAA,CAAQ,UAAU,CAAQ,IAAA,KAAA;AACjC,IAAI,IAAA,CAAC,cAAe,CAAA,IAAI,CAAG,EAAA;AACzB,MAAA;AAAA;AAGF,IAAM,MAAA,MAAA,GAAS,gBAAwC,CAAA,IAAA,EAAM,aAAa,CAAA;AAC1E,IAAA,MAAM,QAAW,GAAA,gBAAA;AAAA,MACf,IAAA;AAAA,MACA;AAAA,KACF;AACA,IAAM,MAAA,SAAA,GAAgC,KAAK,KAAO,EAAA,IAAA;AAElD,IAAA,IAAI,MAAQ,EAAA;AAEV,MAAA,cAAA,CAAe,MAAM,CAAA;AAAA;AAGvB,IAAA,IAAI,qBAAwB,GAAA,iBAAA;AAC5B,IAAA,IAAI,YAAY,SAAW,EAAA;AACzB,MAAA,MAAM,0BAA0B,aAAc,EAAA;AAC9C,MAAwB,qBAAA,GAAA,CAAA,aAAA,EAAgB,QAAQ,CAAA,CAAA,EAAI,uBAAuB,CAAA,CAAA;AAC3E,MAAW,UAAA,CAAA,IAAA;AAAA,QACT,wBAAyB,CAAA;AAAA,UACvB,IAAM,EAAA,uBAAA;AAAA,UACN,iBAAA;AAAA,UACA,SAAA;AAAA,UACA;AAAA,SACD;AAAA,OACH;AAAA;AAGF,IAAmB,kBAAA,CAAA;AAAA,MACjB,QAAA,EAAU,KAAK,KAAM,CAAA,QAAA;AAAA,MACrB,iBAAmB,EAAA,qBAAA;AAAA,MACnB;AAAA,KACD,CAAA;AAAA,GACF,CAAA;AACH;AAGO,SAAS,oBACd,iBACkB,EAAA;AAClB,EAAM,MAAA,gBAAA,uBAAuB,GAG3B,EAAA;AAEF,EAAA,MAAM,gCAAuB,CAAA,MAAA;AAC3B,IAAA,IAAI,YAAe,GAAA,CAAA;AACnB,IAAO,OAAA,MAAM,OAAO,YAAc,EAAA,CAAA;AAAA,GACjC,GAAA;AAEH,EAAM,MAAA,mBAAA,GAAsB,CAAC,MAAkC,KAAA;AAC7D,IAAI,IAAA,UAAA,GAAa,gBAAiB,CAAA,GAAA,CAAI,MAAM,CAAA;AAC5C,IAAA,IAAI,CAAC,UAAY,EAAA;AACf,MAAA,UAAA,GAAa,EAAC;AACd,MAAiB,gBAAA,CAAA,GAAA,CAAI,QAAQ,UAAU,CAAA;AAAA;AAEzC,IAAO,OAAA,UAAA;AAAA,GACT;AAEA,EAAA,KAAA,CAAM,QAAS,CAAA,OAAA;AAAA,IACb,kBAAkB,KAAM,CAAA,QAAA;AAAA,IACxB,CAAC,KAAqB,KAAA;AAEpB,MAAA,IAAI,CAAC,KAAA,CAAM,cAAe,CAAA,KAAK,CAAG,EAAA;AAChC,QAAA,MAAM,IAAI,KAAA;AAAA,UACR,CAAA,4EAAA,EAA+E,OAAO,KAAK,CAAA,CAAA;AAAA,SAC7F;AAAA;AAEF,MAAI,IAAA,KAAA,CAAM,SAAS,KAAO,EAAA;AACxB,QAAA,MAAM,IAAI,KAAA;AAAA,UACR,CAAA,4DAAA,EAA+D,MAAM,IAAI,CAAA,CAAA;AAAA,SAC3E;AAAA;AAEF,MAAM,MAAA,YAAA,GAAe,MAAM,KAAM,CAAA,OAAA;AACjC,MAAM,MAAA,IAAA,GAA2B,MAAM,KAAM,CAAA,IAAA;AAC7C,MAAA,MAAM,MAAS,GAAA,gBAAA;AAAA,QACb,YAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,MAAM,QAAW,GAAA,gBAAA;AAAA,QACf,YAAA;AAAA,QACA;AAAA,OACF;AACA,MAAA,IAAI,CAAC,MAAQ,EAAA;AACX,QAAA,MAAM,IAAI,KAAA;AAAA;AAAA,UAER,mBAAmB,IAAI,CAAA,oNAAA;AAAA,SACzB;AAAA;AAEF,MAAA,IAAI,SAAS,KAAW,CAAA,EAAA;AACtB,QAAA,MAAM,IAAI,KAAA;AAAA,UACR,CAAA,4DAAA;AAAA,SACF;AAAA;AAGF,MAAM,MAAA,UAAA,GAAa,oBAAoB,MAAM,CAAA;AAC7C,MAAA,MAAM,iBAAoB,GAAA,UAAA,CAAW,MAAS,GAAA,aAAA,EAAkB,GAAA,KAAA,CAAA;AAChE,MAAM,MAAA,eAAA,GAAkB,CAAQ,KAAA,EAAA,MAAA,CAAO,KAAM,EAAC,GAC5C,iBAAoB,GAAA,CAAA,CAAA,EAAI,iBAAiB,CAAA,CAAA,GAAK,iBAChD,CAAA,CAAA;AAEA,MAAW,UAAA,CAAA,IAAA;AAAA,QACT,cAAc,iBAAkB,CAAA;AAAA,UAC9B,IAAM,EAAA,iBAAA;AAAA,UACN,MAAQ,EAAA;AAAA,YACN,mBAAmB,oBAAqB,CAAA;AAAA,cACtC,iBAAA,CAAkB,UAAU,QAAS,EAAA;AAAA,cACrC,iBAAA,CAAkB,SAAS,QAAS;AAAA,aACrC;AAAA,WACH;AAAA,UACA,OAAQ,CAAA,eAAA,EAAiB,EAAE,MAAA,EAAQ,SAAW,EAAA;AAE5C,YAAA,OAAO,eAAgB,CAAA;AAAA,cACrB,WAAA,EAAa,KAAK,CAAC,CAAA,KAAM,MAAM,IAAK,CAAA,KAAA,CAAM,CAAC,CAAI,GAAA,IAAA;AAAA,cAC/C,QAAU,EAAA,QAAA,GAAW,qBAAsB,CAAA,QAAQ,CAAI,GAAA,KAAA,CAAA;AAAA,cACvD,QAAQ,YACN,aAAA;AAAA,gBACE,KAAA,CAAM,MAAM,QACV,mBAAA,KAAA,CAAA,aAAA,CAAC,8BACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAM,MAAK,GAAI,EAAA,OAAA,EAAS,gCACtB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAM,MAAK,GAAI,EAAA,OAAA,EAAS,MAAM,KAAM,CAAA,QAAA,EAAU,CACjD,CACF,CAEA,GAAA;AAAA;AAEJ,aACH,CAAA;AAAA;AACH,SACD;AAAA,OACH;AAEA,MAAmB,kBAAA,CAAA;AAAA,QACjB,QAAA,EAAU,MAAM,KAAM,CAAA,QAAA;AAAA,QACtB,iBAAmB,EAAA,eAAA;AAAA,QACnB,OAAS,EAAA;AAAA,UACP,QAAA,EAAU,OAAO,KAAM,EAAA;AAAA,UACvB,UAAA;AAAA,UACA,aAAA;AAAA,UACA,cAAgB,EAAA;AAAA;AAClB,OACD,CAAA;AAAA;AACH,GACF;AAEA,EAAO,OAAA,KAAA,CAAM,IAAK,CAAA,gBAAgB,CAAE,CAAA,GAAA;AAAA,IAAI,CAAC,CAAC,MAAQ,EAAA,UAAU,MAC1D,oBAAqB,CAAA;AAAA,MACnB,EAAA,EAAI,OAAO,KAAM,EAAA;AAAA,MACjB,UAAY,EAAA;AAAA,QACV,GAAG,UAAA;AAAA,QACH,GAAG,KAAM,CAAA,IAAA,CAAK,MAAO,CAAA,OAAA,EAAS,CAAE,CAAA,GAAA;AAAA,UAAI,CAAA,OAAA,KAClC,aAAa,IAAK,CAAA;AAAA,YAChB,IAAA,EAAM,QAAQ,GAAI,CAAA,EAAA;AAAA,YAClB,MAAA,EAAQ,EAAE,OAAQ;AAAA,WACnB;AAAA;AACH,OACF;AAAA,MACA,MAAQ,EAAA,sBAAA,CAAuB,MAAO,CAAA,MAAA,IAAU,EAAE,CAAA;AAAA,MAClD,cAAgB,EAAA,sBAAA,CAAuB,MAAO,CAAA,cAAA,IAAkB,EAAE;AAAA,KACnE;AAAA,GACH;AACF;;;;"}
+{"version":3,"file":"collectLegacyRoutes.esm.js","sources":["../src/collectLegacyRoutes.tsx"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  AnyRouteRefParams,\n  BackstagePlugin as LegacyBackstagePlugin,\n  RouteRef,\n  createPlugin,\n  getComponentData,\n} from '@backstage/core-plugin-api';\nimport {\n  FrontendPlugin,\n  ExtensionDefinition,\n  coreExtensionData,\n  createExtension,\n  createExtensionInput,\n  createFrontendPlugin,\n  ApiBlueprint,\n  PageBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport React, { Children, ReactNode, isValidElement } from 'react';\nimport { Route, Routes } from 'react-router-dom';\nimport {\n  convertLegacyRouteRef,\n  convertLegacyRouteRefs,\n} from './convertLegacyRouteRef';\nimport { compatWrapper } from './compatWrapper';\n\n/*\n\n# Legacy interoperability\n\nUse-cases (prioritized):\n 1. Slowly migrate over an existing app to DI, piece by piece\n 2. Use a legacy plugin in a new DI app\n 3. Use DI in an existing legacy app\n\nStarting point: use-case #1\n\nPotential solutions:\n 1. Codemods (we're not considering this for now)\n 2. Legacy apps are migrated bottom-up, i.e. keep legacy root, replace pages with DI\n 3. Legacy apps are migrated top-down i.e. switch out base to DI, legacy adapter allows for usage of existing app structure\n\nChosen path: #3\n\nExisting tasks:\n  - Adopters can migrate their existing app gradually (~4)\n    - Example-app uses legacy base with DI adapters\n    - Create an API that lets you inject DI into existing apps - working assumption is that this is enough\n  - Adopters can use legacy plugins in DI through adapters (~8)\n    - App-next uses DI base with legacy adapters\n    - Create a legacy adapter that is able to take an existing extension tree\n\n*/\n\n// Creates a shim extension whose purpose is to build up the tree (anchored at\n// the root page) of paths/routeRefs so that the app can bind them properly.\nfunction makeRoutingShimExtension(options: {\n  name: string;\n  parentExtensionId: string;\n  routePath?: string;\n  routeRef?: RouteRef;\n}) {\n  const { name, parentExtensionId, routePath, routeRef } = options;\n  return createExtension({\n    kind: 'routing-shim',\n    name,\n    attachTo: { id: parentExtensionId, input: 'childRoutingShims' },\n    inputs: {\n      childRoutingShims: createExtensionInput([\n        coreExtensionData.routePath.optional(),\n        coreExtensionData.routeRef.optional(),\n      ]),\n    },\n    output: [\n      coreExtensionData.routePath.optional(),\n      coreExtensionData.routeRef.optional(),\n    ],\n    *factory() {\n      if (routePath !== undefined) {\n        yield coreExtensionData.routePath(routePath);\n      }\n\n      if (routeRef) {\n        yield coreExtensionData.routeRef(convertLegacyRouteRef(routeRef));\n      }\n    },\n  });\n}\n\nfunction visitRouteChildren(options: {\n  children: ReactNode;\n  parentExtensionId: string;\n  context: {\n    pluginId: string;\n    extensions: ExtensionDefinition[];\n    getUniqueName: () => string;\n    discoverPlugin: (plugin: LegacyBackstagePlugin) => void;\n  };\n}): void {\n  const { children, parentExtensionId, context } = options;\n  const { pluginId, extensions, getUniqueName, discoverPlugin } = context;\n\n  Children.forEach(children, node => {\n    if (!isValidElement(node)) {\n      return;\n    }\n\n    const plugin = getComponentData<LegacyBackstagePlugin>(node, 'core.plugin');\n    const routeRef = getComponentData<RouteRef<AnyRouteRefParams>>(\n      node,\n      'core.mountPoint',\n    );\n    const routePath: string | undefined = node.props?.path;\n\n    if (plugin) {\n      // We just mark the plugin as discovered, but don't change the context\n      discoverPlugin(plugin);\n    }\n\n    let nextParentExtensionId = parentExtensionId;\n    if (routeRef || routePath) {\n      const nextParentExtensionName = getUniqueName();\n      nextParentExtensionId = `routing-shim:${pluginId}/${nextParentExtensionName}`;\n      extensions.push(\n        makeRoutingShimExtension({\n          name: nextParentExtensionName,\n          parentExtensionId,\n          routePath,\n          routeRef,\n        }),\n      );\n    }\n\n    visitRouteChildren({\n      children: node.props.children,\n      parentExtensionId: nextParentExtensionId,\n      context,\n    });\n  });\n}\n\n/** @internal */\nexport function collectLegacyRoutes(\n  flatRoutesElement: JSX.Element,\n): FrontendPlugin[] {\n  const pluginExtensions = new Map<\n    LegacyBackstagePlugin,\n    ExtensionDefinition[]\n  >();\n\n  const getUniqueName = (() => {\n    let currentIndex = 1;\n    return () => String(currentIndex++);\n  })();\n\n  // Placeholder plugin for any routes that don't belong to a plugin\n  const orphanRoutesPlugin = createPlugin({ id: 'converted-orphan-routes' });\n\n  const getPluginExtensions = (plugin: LegacyBackstagePlugin) => {\n    let extensions = pluginExtensions.get(plugin);\n    if (!extensions) {\n      extensions = [];\n      pluginExtensions.set(plugin, extensions);\n    }\n    return extensions;\n  };\n\n  React.Children.forEach(\n    flatRoutesElement.props.children,\n    (route: ReactNode) => {\n      if (route === null) {\n        return;\n      }\n      // TODO(freben): Handle feature flag and permissions framework wrapper elements\n      if (!React.isValidElement(route)) {\n        throw new Error(\n          `Invalid element inside FlatRoutes, expected Route but found element of type ${typeof route}.`,\n        );\n      }\n      if (route.type !== Route) {\n        throw new Error(\n          `Invalid element inside FlatRoutes, expected Route but found ${route.type}.`,\n        );\n      }\n      const routeElement = route.props.element;\n      const path: string | undefined = route.props.path;\n      const plugin =\n        getComponentData<LegacyBackstagePlugin>(routeElement, 'core.plugin') ??\n        orphanRoutesPlugin;\n      const routeRef = getComponentData<RouteRef>(\n        routeElement,\n        'core.mountPoint',\n      );\n      if (path === undefined) {\n        throw new Error(\n          `Route element inside FlatRoutes had no path prop value given`,\n        );\n      }\n\n      const extensions = getPluginExtensions(plugin);\n      const pageExtensionName = extensions.length ? getUniqueName() : undefined;\n      const pageExtensionId = `page:${plugin.getId()}${\n        pageExtensionName ? `/${pageExtensionName}` : pageExtensionName\n      }`;\n\n      extensions.push(\n        PageBlueprint.makeWithOverrides({\n          name: pageExtensionName,\n          inputs: {\n            childRoutingShims: createExtensionInput([\n              coreExtensionData.routePath.optional(),\n              coreExtensionData.routeRef.optional(),\n            ]),\n          },\n          factory(originalFactory, { inputs: _inputs }) {\n            // todo(blam): why do we not use the inputs here?\n            return originalFactory({\n              defaultPath: path[0] === '/' ? path.slice(1) : path,\n              routeRef: routeRef ? convertLegacyRouteRef(routeRef) : undefined,\n              loader: async () =>\n                compatWrapper(\n                  route.props.children ? (\n                    <Routes>\n                      <Route path=\"*\" element={routeElement}>\n                        <Route path=\"*\" element={route.props.children} />\n                      </Route>\n                    </Routes>\n                  ) : (\n                    routeElement\n                  ),\n                ),\n            });\n          },\n        }),\n      );\n\n      visitRouteChildren({\n        children: route.props.children,\n        parentExtensionId: pageExtensionId,\n        context: {\n          pluginId: plugin.getId(),\n          extensions,\n          getUniqueName,\n          discoverPlugin: getPluginExtensions,\n        },\n      });\n    },\n  );\n\n  return Array.from(pluginExtensions).map(([plugin, extensions]) =>\n    createFrontendPlugin({\n      id: plugin.getId(),\n      extensions: [\n        ...extensions,\n        ...Array.from(plugin.getApis()).map(factory =>\n          ApiBlueprint.make({\n            name: factory.api.id,\n            params: { factory },\n          }),\n        ),\n      ],\n      routes: convertLegacyRouteRefs(plugin.routes ?? {}),\n      externalRoutes: convertLegacyRouteRefs(plugin.externalRoutes ?? {}),\n    }),\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/convertLegacyApp.esm.js

@@ -2,6 +2,7 @@ import React, { Children, isValidElement, Fragment } from 'react';
 import { createExtension, createExtensionInput, coreExtensionData, createFrontendModule } from '@backstage/frontend-plugin-api';
 import { getComponentData } from '@backstage/core-plugin-api';
 import { collectLegacyRoutes } from './collectLegacyRoutes.esm.js';
+import { compatWrapper } from './compatWrapper/compatWrapper.esm.js';
 
 function selectChildren(rootNode, selector, strictError) {
   return Children.toArray(rootNode).flatMap((node) => {
@@ -55,7 +56,7 @@ function convertLegacyApp(rootElement) {
   const [routesEl] = routesEls;
   const CoreLayoutOverride = createExtension({
     name: "layout",
-    attachTo: { id: "app", input: "root" },
+    attachTo: { id: "app/root", input: "children" },
     inputs: {
       content: createExtensionInput([coreExtensionData.reactElement], {
         singleton: true
@@ -65,10 +66,12 @@ function convertLegacyApp(rootElement) {
     factory({ inputs }) {
       return [
         coreExtensionData.reactElement(
-          React.cloneElement(
-            rootEl,
-            void 0,
-            inputs.content.get(coreExtensionData.reactElement)
+          compatWrapper(
+            React.cloneElement(
+              rootEl,
+              void 0,
+              inputs.content.get(coreExtensionData.reactElement)
+            )
           )
         )
       ];

package/dist/convertLegacyApp.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"convertLegacyApp.esm.js","sources":["../src/convertLegacyApp.ts"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, {\n  Children,\n  Fragment,\n  ReactElement,\n  ReactNode,\n  isValidElement,\n} from 'react';\nimport {\n  FrontendModule,\n  FrontendPlugin,\n  coreExtensionData,\n  createExtension,\n  ExtensionOverrides,\n  createExtensionInput,\n  createFrontendModule,\n} from '@backstage/frontend-plugin-api';\nimport { getComponentData } from '@backstage/core-plugin-api';\nimport { collectLegacyRoutes } from './collectLegacyRoutes';\n\nfunction selectChildren(\n  rootNode: ReactNode,\n  selector?: (element: ReactElement<{ children?: ReactNode }>) => boolean,\n  strictError?: string,\n): Array<ReactElement<{ children?: ReactNode }>> {\n  return Children.toArray(rootNode).flatMap(node => {\n    if (!isValidElement<{ children?: ReactNode }>(node)) {\n      return [];\n    }\n\n    if (node.type === Fragment) {\n      return selectChildren(node.props.children, selector, strictError);\n    }\n\n    if (selector === undefined || selector(node)) {\n      return [node];\n    }\n\n    if (strictError) {\n      throw new Error(strictError);\n    }\n\n    return selectChildren(node.props.children, selector, strictError);\n  });\n}\n\n/** @public */\nexport function convertLegacyApp(\n  rootElement: React.JSX.Element,\n): (FrontendPlugin | FrontendModule | ExtensionOverrides)[] {\n  if (getComponentData(rootElement, 'core.type') === 'FlatRoutes') {\n    return collectLegacyRoutes(rootElement);\n  }\n\n  const appRouterEls = selectChildren(\n    rootElement,\n    el => getComponentData(el, 'core.type') === 'AppRouter',\n  );\n  if (appRouterEls.length !== 1) {\n    throw new Error(\n      \"Failed to convert legacy app, AppRouter element could not been found. Make sure it's at the top level of the App element tree\",\n    );\n  }\n\n  const rootEls = selectChildren(\n    appRouterEls[0].props.children,\n    el =>\n      Boolean(el.props.children) &&\n      selectChildren(\n        el.props.children,\n        innerEl => getComponentData(innerEl, 'core.type') === 'FlatRoutes',\n      ).length === 1,\n  );\n  if (rootEls.length !== 1) {\n    throw new Error(\n      \"Failed to convert legacy app, Root element containing FlatRoutes could not been found. Make sure it's within the AppRouter element of the App element tree\",\n    );\n  }\n  const [rootEl] = rootEls;\n\n  const routesEls = selectChildren(\n    rootEls[0].props.children,\n    el => getComponentData(el, 'core.type') === 'FlatRoutes',\n  );\n  if (routesEls.length !== 1) {\n    throw new Error(\n      'Unexpectedly failed to find FlatRoutes in app element tree',\n    );\n  }\n  const [routesEl] = routesEls;\n\n  const CoreLayoutOverride = createExtension({\n    name: 'layout',\n    attachTo: { id: 'app', input: 'root' },\n    inputs: {\n      content: createExtensionInput([coreExtensionData.reactElement], {\n        singleton: true,\n      }),\n    },\n    output: [coreExtensionData.reactElement],\n    factory({ inputs }) {\n      // Clone the root element, this replaces the FlatRoutes declared in the app with out content input\n      return [\n        coreExtensionData.reactElement(\n          React.cloneElement(\n            rootEl,\n            undefined,\n            inputs.content.get(coreExtensionData.reactElement),\n          ),\n        ),\n      ];\n    },\n  });\n  const CoreNavOverride = createExtension({\n    name: 'nav',\n    attachTo: { id: 'app/layout', input: 'nav' },\n    output: [],\n    factory: () => [],\n    disabled: true,\n  });\n\n  const collectedRoutes = collectLegacyRoutes(routesEl);\n\n  return [\n    ...collectedRoutes,\n    createFrontendModule({\n      pluginId: 'app',\n      extensions: [CoreLayoutOverride, CoreNavOverride],\n    }),\n  ];\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"convertLegacyApp.esm.js","sources":["../src/convertLegacyApp.ts"],"sourcesContent":["/*\n * Copyright 2023 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, {\n  Children,\n  Fragment,\n  ReactElement,\n  ReactNode,\n  isValidElement,\n} from 'react';\nimport {\n  FrontendModule,\n  FrontendPlugin,\n  coreExtensionData,\n  createExtension,\n  ExtensionOverrides,\n  createExtensionInput,\n  createFrontendModule,\n} from '@backstage/frontend-plugin-api';\nimport { getComponentData } from '@backstage/core-plugin-api';\nimport { collectLegacyRoutes } from './collectLegacyRoutes';\nimport { compatWrapper } from './compatWrapper';\n\nfunction selectChildren(\n  rootNode: ReactNode,\n  selector?: (element: ReactElement<{ children?: ReactNode }>) => boolean,\n  strictError?: string,\n): Array<ReactElement<{ children?: ReactNode }>> {\n  return Children.toArray(rootNode).flatMap(node => {\n    if (!isValidElement<{ children?: ReactNode }>(node)) {\n      return [];\n    }\n\n    if (node.type === Fragment) {\n      return selectChildren(node.props.children, selector, strictError);\n    }\n\n    if (selector === undefined || selector(node)) {\n      return [node];\n    }\n\n    if (strictError) {\n      throw new Error(strictError);\n    }\n\n    return selectChildren(node.props.children, selector, strictError);\n  });\n}\n\n/** @public */\nexport function convertLegacyApp(\n  rootElement: React.JSX.Element,\n): (FrontendPlugin | FrontendModule | ExtensionOverrides)[] {\n  if (getComponentData(rootElement, 'core.type') === 'FlatRoutes') {\n    return collectLegacyRoutes(rootElement);\n  }\n\n  const appRouterEls = selectChildren(\n    rootElement,\n    el => getComponentData(el, 'core.type') === 'AppRouter',\n  );\n  if (appRouterEls.length !== 1) {\n    throw new Error(\n      \"Failed to convert legacy app, AppRouter element could not been found. Make sure it's at the top level of the App element tree\",\n    );\n  }\n\n  const rootEls = selectChildren(\n    appRouterEls[0].props.children,\n    el =>\n      Boolean(el.props.children) &&\n      selectChildren(\n        el.props.children,\n        innerEl => getComponentData(innerEl, 'core.type') === 'FlatRoutes',\n      ).length === 1,\n  );\n  if (rootEls.length !== 1) {\n    throw new Error(\n      \"Failed to convert legacy app, Root element containing FlatRoutes could not been found. Make sure it's within the AppRouter element of the App element tree\",\n    );\n  }\n  const [rootEl] = rootEls;\n\n  const routesEls = selectChildren(\n    rootEls[0].props.children,\n    el => getComponentData(el, 'core.type') === 'FlatRoutes',\n  );\n  if (routesEls.length !== 1) {\n    throw new Error(\n      'Unexpectedly failed to find FlatRoutes in app element tree',\n    );\n  }\n  const [routesEl] = routesEls;\n\n  const CoreLayoutOverride = createExtension({\n    name: 'layout',\n    attachTo: { id: 'app/root', input: 'children' },\n    inputs: {\n      content: createExtensionInput([coreExtensionData.reactElement], {\n        singleton: true,\n      }),\n    },\n    output: [coreExtensionData.reactElement],\n    factory({ inputs }) {\n      // Clone the root element, this replaces the FlatRoutes declared in the app with out content input\n      return [\n        coreExtensionData.reactElement(\n          compatWrapper(\n            React.cloneElement(\n              rootEl,\n              undefined,\n              inputs.content.get(coreExtensionData.reactElement),\n            ),\n          ),\n        ),\n      ];\n    },\n  });\n  const CoreNavOverride = createExtension({\n    name: 'nav',\n    attachTo: { id: 'app/layout', input: 'nav' },\n    output: [],\n    factory: () => [],\n    disabled: true,\n  });\n\n  const collectedRoutes = collectLegacyRoutes(routesEl);\n\n  return [\n    ...collectedRoutes,\n    createFrontendModule({\n      pluginId: 'app',\n      extensions: [CoreLayoutOverride, CoreNavOverride],\n    }),\n  ];\n}\n"],"names":[],"mappings":"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"}

package/dist/convertLegacyAppOptions.esm.js

@@ -0,0 +1,133 @@
+import React from 'react';
+import { ApiBlueprint, IconBundleBlueprint, createExtension, ThemeBlueprint, RouterBlueprint, SignInPageBlueprint, createComponentExtension, coreComponentRefs, createFrontendModule } from '@backstage/frontend-plugin-api';
+import { toLegacyPlugin } from './compatWrapper/BackwardsCompatProvider.esm.js';
+import { compatWrapper } from './compatWrapper/compatWrapper.esm.js';
+
+function componentCompatWrapper(Component) {
+  return (props) => compatWrapper(/* @__PURE__ */ React.createElement(Component, { ...props }));
+}
+function convertLegacyAppOptions(options = {}) {
+  const { apis, icons, plugins, components, themes, featureFlags } = options;
+  const allApis = [
+    ...plugins?.flatMap((plugin) => [...plugin.getApis()]) ?? [],
+    ...apis ?? []
+  ];
+  const deduplicatedApis = Array.from(
+    new Map(allApis.map((api) => [api.api.id, api])).values()
+  );
+  const extensions = deduplicatedApis.map(
+    (factory) => ApiBlueprint.make({ name: factory.api.id, params: { factory } })
+  );
+  if (icons) {
+    extensions.push(
+      IconBundleBlueprint.make({
+        name: "app-options",
+        params: { icons }
+      })
+    );
+  }
+  if (themes) {
+    for (const id of ["light", "dark"]) {
+      if (!themes.some((theme) => theme.id === id)) {
+        extensions.push(
+          createExtension({
+            kind: "theme",
+            name: id,
+            attachTo: { id: "api:app/app-theme", input: "themes" },
+            disabled: true,
+            output: [],
+            factory: () => []
+          })
+        );
+      }
+    }
+    extensions.push(
+      ...themes.map(
+        (theme) => ThemeBlueprint.make({
+          name: theme.id,
+          params: { theme }
+        })
+      )
+    );
+  }
+  if (components) {
+    const {
+      BootErrorPage,
+      ErrorBoundaryFallback,
+      NotFoundErrorPage,
+      Progress,
+      Router,
+      SignInPage,
+      ThemeProvider
+    } = components;
+    if (BootErrorPage) {
+      throw new Error(
+        "components.BootErrorPage is not supported by convertLegacyAppOptions"
+      );
+    }
+    if (ThemeProvider) {
+      throw new Error(
+        "components.ThemeProvider is not supported by convertLegacyAppOptions"
+      );
+    }
+    if (Router) {
+      extensions.push(
+        RouterBlueprint.make({
+          params: { Component: componentCompatWrapper(Router) }
+        })
+      );
+    }
+    if (SignInPage) {
+      extensions.push(
+        SignInPageBlueprint.make({
+          params: {
+            loader: () => Promise.resolve(componentCompatWrapper(SignInPage))
+          }
+        })
+      );
+    }
+    if (Progress) {
+      extensions.push(
+        createComponentExtension({
+          ref: coreComponentRefs.progress,
+          loader: { sync: () => componentCompatWrapper(Progress) }
+        })
+      );
+    }
+    if (NotFoundErrorPage) {
+      extensions.push(
+        createComponentExtension({
+          ref: coreComponentRefs.notFoundErrorPage,
+          loader: { sync: () => componentCompatWrapper(NotFoundErrorPage) }
+        })
+      );
+    }
+    if (ErrorBoundaryFallback) {
+      const WrappedErrorBoundaryFallback = (props) => compatWrapper(
+        /* @__PURE__ */ React.createElement(
+          ErrorBoundaryFallback,
+          {
+            ...props,
+            plugin: props.plugin && toLegacyPlugin(props.plugin)
+          }
+        )
+      );
+      extensions.push(
+        createComponentExtension({
+          ref: coreComponentRefs.errorBoundaryFallback,
+          loader: {
+            sync: () => componentCompatWrapper(WrappedErrorBoundaryFallback)
+          }
+        })
+      );
+    }
+  }
+  return createFrontendModule({
+    pluginId: "app",
+    extensions,
+    featureFlags
+  });
+}
+
+export { convertLegacyAppOptions };
+//# sourceMappingURL=convertLegacyAppOptions.esm.js.map

package/dist/convertLegacyAppOptions.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"convertLegacyAppOptions.esm.js","sources":["../src/convertLegacyAppOptions.tsx"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n  ApiBlueprint,\n  coreComponentRefs,\n  CoreErrorBoundaryFallbackProps,\n  createComponentExtension,\n  createExtension,\n  createFrontendModule,\n  ExtensionDefinition,\n  FrontendModule,\n  IconBundleBlueprint,\n  RouterBlueprint,\n  SignInPageBlueprint,\n  ThemeBlueprint,\n} from '@backstage/frontend-plugin-api';\nimport {\n  AnyApiFactory,\n  AppComponents,\n  AppTheme,\n  BackstagePlugin,\n  FeatureFlag,\n  IconComponent,\n} from '@backstage/core-plugin-api';\nimport { toLegacyPlugin } from './compatWrapper/BackwardsCompatProvider';\nimport { compatWrapper } from './compatWrapper';\n\nfunction componentCompatWrapper<TProps extends {}>(\n  Component: React.ComponentType<TProps>,\n) {\n  return (props: TProps) => compatWrapper(<Component {...props} />);\n}\n\n/**\n * @public\n */\nexport function convertLegacyAppOptions(\n  options: {\n    apis?: Iterable<AnyApiFactory>;\n\n    icons?: { [key in string]: IconComponent };\n\n    plugins?: Array<BackstagePlugin>;\n\n    components?: Partial<AppComponents>;\n\n    themes?: AppTheme[];\n\n    featureFlags?: (FeatureFlag & Omit<FeatureFlag, 'pluginId'>)[];\n  } = {},\n): FrontendModule {\n  const { apis, icons, plugins, components, themes, featureFlags } = options;\n\n  const allApis = [\n    ...(plugins?.flatMap(plugin => [...plugin.getApis()]) ?? []),\n    ...(apis ?? []),\n  ];\n  const deduplicatedApis = Array.from(\n    new Map(allApis.map(api => [api.api.id, api])).values(),\n  );\n  const extensions: ExtensionDefinition[] = deduplicatedApis.map(factory =>\n    ApiBlueprint.make({ name: factory.api.id, params: { factory } }),\n  );\n\n  if (icons) {\n    extensions.push(\n      IconBundleBlueprint.make({\n        name: 'app-options',\n        params: { icons },\n      }),\n    );\n  }\n\n  if (themes) {\n    // IF any themes are provided we need to disable the default ones, unless they are overridden\n    for (const id of ['light', 'dark']) {\n      if (!themes.some(theme => theme.id === id)) {\n        extensions.push(\n          createExtension({\n            kind: 'theme',\n            name: id,\n            attachTo: { id: 'api:app/app-theme', input: 'themes' },\n            disabled: true,\n            output: [],\n            factory: () => [],\n          }),\n        );\n      }\n    }\n    extensions.push(\n      ...themes.map(theme =>\n        ThemeBlueprint.make({\n          name: theme.id,\n          params: { theme },\n        }),\n      ),\n    );\n  }\n\n  if (components) {\n    const {\n      BootErrorPage,\n      ErrorBoundaryFallback,\n      NotFoundErrorPage,\n      Progress,\n      Router,\n      SignInPage,\n      ThemeProvider,\n    } = components;\n\n    if (BootErrorPage) {\n      throw new Error(\n        'components.BootErrorPage is not supported by convertLegacyAppOptions',\n      );\n    }\n    if (ThemeProvider) {\n      throw new Error(\n        'components.ThemeProvider is not supported by convertLegacyAppOptions',\n      );\n    }\n    if (Router) {\n      extensions.push(\n        RouterBlueprint.make({\n          params: { Component: componentCompatWrapper(Router) },\n        }),\n      );\n    }\n    if (SignInPage) {\n      extensions.push(\n        SignInPageBlueprint.make({\n          params: {\n            loader: () => Promise.resolve(componentCompatWrapper(SignInPage)),\n          },\n        }),\n      );\n    }\n    if (Progress) {\n      extensions.push(\n        createComponentExtension({\n          ref: coreComponentRefs.progress,\n          loader: { sync: () => componentCompatWrapper(Progress) },\n        }),\n      );\n    }\n    if (NotFoundErrorPage) {\n      extensions.push(\n        createComponentExtension({\n          ref: coreComponentRefs.notFoundErrorPage,\n          loader: { sync: () => componentCompatWrapper(NotFoundErrorPage) },\n        }),\n      );\n    }\n    if (ErrorBoundaryFallback) {\n      const WrappedErrorBoundaryFallback = (\n        props: CoreErrorBoundaryFallbackProps,\n      ) =>\n        compatWrapper(\n          <ErrorBoundaryFallback\n            {...props}\n            plugin={props.plugin && toLegacyPlugin(props.plugin)}\n          />,\n        );\n      extensions.push(\n        createComponentExtension({\n          ref: coreComponentRefs.errorBoundaryFallback,\n          loader: {\n            sync: () => componentCompatWrapper(WrappedErrorBoundaryFallback),\n          },\n        }),\n      );\n    }\n  }\n\n  return createFrontendModule({\n    pluginId: 'app',\n    extensions,\n    featureFlags,\n  });\n}\n"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactNode, ComponentType } from 'react';
-import { AnalyticsApi, AnalyticsEvent, BackstagePlugin, RouteRef, SubRouteRef, ExternalRouteRef, AnyRouteRefParams } from '@backstage/core-plugin-api';
+import { AnalyticsApi, AnalyticsEvent, AnyApiFactory, IconComponent, BackstagePlugin, AppComponents, AppTheme, FeatureFlag, RouteRef, SubRouteRef, ExternalRouteRef, AnyRouteRefParams } from '@backstage/core-plugin-api';
 import { AnalyticsApi as AnalyticsApi$1, AnalyticsEvent as AnalyticsEvent$1, FrontendPlugin, FrontendModule, ExtensionOverrides, ExtensionDefinition, RouteRef as RouteRef$1, SubRouteRef as SubRouteRef$1, ExternalRouteRef as ExternalRouteRef$1 } from '@backstage/frontend-plugin-api';
 
 /**
@@ -66,6 +66,20 @@ declare class NoOpAnalyticsApi implements AnalyticsApi, AnalyticsApi$1 {
 /** @public */
 declare function convertLegacyApp(rootElement: React.JSX.Element): (FrontendPlugin | FrontendModule | ExtensionOverrides)[];
 
+/**
+ * @public
+ */
+declare function convertLegacyAppOptions(options?: {
+    apis?: Iterable<AnyApiFactory>;
+    icons?: {
+        [key in string]: IconComponent;
+    };
+    plugins?: Array<BackstagePlugin>;
+    components?: Partial<AppComponents>;
+    themes?: AppTheme[];
+    featureFlags?: (FeatureFlag & Omit<FeatureFlag, 'pluginId'>)[];
+}): FrontendModule;
+
 /** @public */
 declare function convertLegacyPlugin(legacyPlugin: BackstagePlugin, options: {
     extensions: ExtensionDefinition[];
@@ -149,4 +163,4 @@ declare function convertLegacyRouteRef<TParams extends AnyRouteRefParams>(ref: S
  */
 declare function convertLegacyRouteRef<TParams extends AnyRouteRefParams>(ref: ExternalRouteRef$1<TParams>): ExternalRouteRef<TParams, true>;
 
-export { MultipleAnalyticsApi, NoOpAnalyticsApi, type ToNewRouteRef, compatWrapper, convertLegacyApp, convertLegacyPageExtension, convertLegacyPlugin, convertLegacyRouteRef, convertLegacyRouteRefs };
+export { MultipleAnalyticsApi, NoOpAnalyticsApi, type ToNewRouteRef, compatWrapper, convertLegacyApp, convertLegacyAppOptions, convertLegacyPageExtension, convertLegacyPlugin, convertLegacyRouteRef, convertLegacyRouteRefs };

package/dist/index.esm.js

@@ -2,6 +2,7 @@ export { compatWrapper } from './compatWrapper/compatWrapper.esm.js';
 export { MultipleAnalyticsApi } from './apis/implementations/AnalyticsApi/MultipleAnalyticsApi.esm.js';
 export { NoOpAnalyticsApi } from './apis/implementations/AnalyticsApi/NoOpAnalyticsApi.esm.js';
 export { convertLegacyApp } from './convertLegacyApp.esm.js';
+export { convertLegacyAppOptions } from './convertLegacyAppOptions.esm.js';
 export { convertLegacyPlugin } from './convertLegacyPlugin.esm.js';
 export { convertLegacyPageExtension } from './convertLegacyPageExtension.esm.js';
 export { convertLegacyRouteRef, convertLegacyRouteRefs } from './convertLegacyRouteRef.esm.js';

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/core-compat-api",
-  "version": "0.3.6",
+  "version": "0.3.7-next.1",
   "backstage": {
     "role": "web-library"
   },
@@ -31,21 +31,21 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/core-plugin-api": "^1.10.4",
-    "@backstage/frontend-plugin-api": "^0.9.5",
-    "@backstage/version-bridge": "^1.0.11",
+    "@backstage/core-plugin-api": "1.10.4",
+    "@backstage/frontend-plugin-api": "0.9.6-next.1",
+    "@backstage/version-bridge": "1.0.11",
     "lodash": "^4.17.21"
   },
   "devDependencies": {
     "@backstage-community/plugin-puppetdb": "^0.1.18",
     "@backstage-community/plugin-stackstorm": "^0.1.16",
-    "@backstage/cli": "^0.30.0",
-    "@backstage/core-app-api": "^1.15.5",
-    "@backstage/frontend-app-api": "^0.10.5",
-    "@backstage/frontend-test-utils": "^0.2.6",
-    "@backstage/plugin-catalog": "^1.27.0",
-    "@backstage/test-utils": "^1.7.5",
-    "@backstage/types": "^1.2.1",
+    "@backstage/cli": "0.30.1-next.0",
+    "@backstage/core-app-api": "1.15.5",
+    "@backstage/frontend-app-api": "0.10.6-next.1",
+    "@backstage/frontend-test-utils": "0.2.7-next.1",
+    "@backstage/plugin-catalog": "1.28.0-next.1",
+    "@backstage/test-utils": "1.7.5",
+    "@backstage/types": "1.2.1",
     "@oriflame/backstage-plugin-score-card": "^0.9.0",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^16.0.0",