@backstage/frontend-defaults 0.5.0-next.1 → 0.5.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @backstage/frontend-defaults
 
+## 0.5.0
+
+### Minor Changes
+
+- 92af1ae: **BREAKING**: Removed the `allowUnknownExtensionConfig` option from `createApp`. This flag had no effect and was a no-op, so no behavioral changes are expected.
+- 33de79d: **BREAKING**: Removed the deprecated `createPublicSignInApp` function. Use `createApp` from `@backstage/frontend-defaults` with `appModulePublicSignIn` from `@backstage/plugin-app/alpha` instead.
+
+### Patch Changes
+
+- 5b160f9: Updated `createApp` to use the phased `prepareSpecializedApp` flow, allowing apps to render a bootstrap tree before the full app is finalized.
+- Updated dependencies
+  - @backstage/frontend-app-api@0.16.0
+  - @backstage/core-components@0.18.8
+  - @backstage/frontend-plugin-api@0.15.0
+  - @backstage/plugin-app@0.4.1
+
 ## 0.5.0-next.1
 
 ### Minor Changes

package/dist/createApp.esm.js

@@ -1,11 +1,10 @@
 import { jsx } from 'react/jsx-runtime';
-import { lazy, Suspense } from 'react';
-import { coreExtensionData } from '@backstage/frontend-plugin-api';
+import { lazy, Suspense, useState, useEffect } from 'react';
 import { Progress } from '@backstage/core-components';
 import { defaultConfigLoaderSync } from './core-app-api/src/app/defaultConfigLoader.esm.js';
 import { overrideBaseUrlConfigs } from './core-app-api/src/app/overrideBaseUrlConfigs.esm.js';
 import { ConfigReader } from '@backstage/config';
-import { createSpecializedApp } from '@backstage/frontend-app-api';
+import { prepareSpecializedApp } from '@backstage/frontend-app-api';
 import appPlugin from '@backstage/plugin-app';
 import { discoverAvailableFeatures } from './discovery.esm.js';
 import { resolveAsyncFeatures } from './resolution.esm.js';
@@ -25,20 +24,15 @@ function createApp(options) {
       config,
       features: [...discoveredFeaturesAndLoaders, ...options?.features ?? []]
     });
-    const app = createSpecializedApp({
+    const preparedApp = prepareSpecializedApp({
       features: [appPlugin, ...loadedFeatures],
       config,
       bindRoutes: options?.bindRoutes,
       advanced: options?.advanced
     });
-    const errorPage = maybeCreateErrorPage(app);
-    if (errorPage) {
-      return { default: () => errorPage };
-    }
-    const rootEl = app.tree.root.instance.getData(
-      coreExtensionData.reactElement
-    );
-    return { default: () => rootEl };
+    return {
+      default: () => /* @__PURE__ */ jsx(PreparedAppRoot, { preparedApp })
+    };
   }
   const LazyApp = lazy(appLoader);
   return {
@@ -47,6 +41,22 @@ function createApp(options) {
     }
   };
 }
+function PreparedAppRoot(props) {
+  const bootstrapApp = props.preparedApp.getBootstrapApp();
+  const [finalizedApp, setFinalizedApp] = useState();
+  useEffect(
+    () => props.preparedApp.onFinalized(setFinalizedApp),
+    [props.preparedApp]
+  );
+  if (!finalizedApp) {
+    return bootstrapApp.element;
+  }
+  const errorPage = maybeCreateErrorPage(finalizedApp);
+  if (errorPage) {
+    return errorPage;
+  }
+  return finalizedApp.element;
+}
 
 export { createApp };
 //# sourceMappingURL=createApp.esm.js.map

package/dist/createApp.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"createApp.esm.js","sources":["../src/createApp.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { JSX, lazy, ReactNode, Suspense } from 'react';\nimport {\n  ConfigApi,\n  coreExtensionData,\n  FrontendFeature,\n  FrontendFeatureLoader,\n} from '@backstage/frontend-plugin-api';\nimport { Progress } from '@backstage/core-components';\n// eslint-disable-next-line @backstage/no-relative-monorepo-imports\nimport { defaultConfigLoaderSync } from '../../core-app-api/src/app/defaultConfigLoader';\n// eslint-disable-next-line @backstage/no-relative-monorepo-imports\nimport { overrideBaseUrlConfigs } from '../../core-app-api/src/app/overrideBaseUrlConfigs';\nimport { ConfigReader } from '@backstage/config';\nimport {\n  CreateAppRouteBinder,\n  createSpecializedApp,\n  ExtensionFactoryMiddleware,\n  FrontendPluginInfoResolver,\n} from '@backstage/frontend-app-api';\nimport appPlugin from '@backstage/plugin-app';\nimport { discoverAvailableFeatures } from './discovery';\nimport { resolveAsyncFeatures } from './resolution';\nimport { maybeCreateErrorPage } from './maybeCreateErrorPage';\n\n/**\n * Options for {@link createApp}.\n *\n * @public\n */\nexport interface CreateAppOptions {\n  /**\n   * The list of features to load.\n   */\n  features?: (FrontendFeature | FrontendFeatureLoader)[];\n\n  /**\n   * Allows for the binding of plugins' external route refs within the app.\n   */\n  bindRoutes?(context: { bind: CreateAppRouteBinder }): void;\n\n  /**\n   * Advanced, more rarely used options.\n   */\n  advanced?: {\n    /**\n     * Sets a custom config loader, replacing the builtin one.\n     *\n     * This can be used e.g. if you have the need to source config out of custom\n     * storages.\n     */\n    configLoader?: () => Promise<{ config: ConfigApi }>;\n\n    /**\n     * Applies one or more middleware on every extension, as they are added to\n     * the application.\n     *\n     * This is an advanced use case for modifying extension data on the fly as\n     * it gets emitted by extensions being instantiated.\n     */\n    extensionFactoryMiddleware?:\n      | ExtensionFactoryMiddleware\n      | ExtensionFactoryMiddleware[];\n\n    /**\n     * The element to render while loading the app (waiting for config, features, etc).\n     *\n     * This is the `<Progress />` component from `@backstage/core-components` by default.\n     * If set to `null` then no loading fallback element is rendered at all.\n     */\n    loadingElement?: ReactNode;\n\n    /**\n     * Allows for customizing how plugin info is retrieved.\n     */\n    pluginInfoResolver?: FrontendPluginInfoResolver;\n  };\n}\n\n/**\n * Creates a new Backstage frontend app instance. See https://backstage.io/docs/frontend-system/building-apps/index\n *\n * @public\n */\nexport function createApp(options?: CreateAppOptions): {\n  createRoot(): JSX.Element;\n} {\n  let suspenseFallback = options?.advanced?.loadingElement;\n  if (suspenseFallback === undefined) {\n    suspenseFallback = <Progress />;\n  }\n\n  async function appLoader() {\n    const config =\n      (await options?.advanced?.configLoader?.().then(c => c.config)) ??\n      ConfigReader.fromConfigs(\n        overrideBaseUrlConfigs(defaultConfigLoaderSync()),\n      );\n\n    const { features: discoveredFeaturesAndLoaders } =\n      discoverAvailableFeatures(config);\n    const { features: loadedFeatures } = await resolveAsyncFeatures({\n      config,\n      features: [...discoveredFeaturesAndLoaders, ...(options?.features ?? [])],\n    });\n\n    const app = createSpecializedApp({\n      features: [appPlugin, ...loadedFeatures],\n      config,\n      bindRoutes: options?.bindRoutes,\n      advanced: options?.advanced,\n    });\n\n    const errorPage = maybeCreateErrorPage(app);\n    if (errorPage) {\n      return { default: () => errorPage };\n    }\n\n    const rootEl = app.tree.root.instance!.getData(\n      coreExtensionData.reactElement,\n    );\n\n    return { default: () => rootEl };\n  }\n\n  const LazyApp = lazy(appLoader);\n\n  return {\n    createRoot() {\n      return (\n        <Suspense fallback={suspenseFallback}>\n          <LazyApp />\n        </Suspense>\n      );\n    },\n  };\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAmGO,SAAS,UAAU,OAAA,EAExB;AACA,EAAA,IAAI,gBAAA,GAAmB,SAAS,QAAA,EAAU,cAAA;AAC1C,EAAA,IAAI,qBAAqB,MAAA,EAAW;AAClC,IAAA,gBAAA,uBAAoB,QAAA,EAAA,EAAS,CAAA;AAAA,EAC/B;AAEA,EAAA,eAAe,SAAA,GAAY;AACzB,IAAA,MAAM,MAAA,GACH,MAAM,OAAA,EAAS,QAAA,EAAU,YAAA,IAAe,CAAE,IAAA,CAAK,CAAA,CAAA,KAAK,CAAA,CAAE,MAAM,CAAA,IAC7D,YAAA,CAAa,WAAA;AAAA,MACX,sBAAA,CAAuB,yBAAyB;AAAA,KAClD;AAEF,IAAA,MAAM,EAAE,QAAA,EAAU,4BAAA,EAA6B,GAC7C,0BAA0B,MAAM,CAAA;AAClC,IAAA,MAAM,EAAE,QAAA,EAAU,cAAA,EAAe,GAAI,MAAM,oBAAA,CAAqB;AAAA,MAC9D,MAAA;AAAA,MACA,QAAA,EAAU,CAAC,GAAG,4BAAA,EAA8B,GAAI,OAAA,EAAS,QAAA,IAAY,EAAG;AAAA,KACzE,CAAA;AAED,IAAA,MAAM,MAAM,oBAAA,CAAqB;AAAA,MAC/B,QAAA,EAAU,CAAC,SAAA,EAAW,GAAG,cAAc,CAAA;AAAA,MACvC,MAAA;AAAA,MACA,YAAY,OAAA,EAAS,UAAA;AAAA,MACrB,UAAU,OAAA,EAAS;AAAA,KACpB,CAAA;AAED,IAAA,MAAM,SAAA,GAAY,qBAAqB,GAAG,CAAA;AAC1C,IAAA,IAAI,SAAA,EAAW;AACb,MAAA,OAAO,EAAE,OAAA,EAAS,MAAM,SAAA,EAAU;AAAA,IACpC;AAEA,IAAA,MAAM,MAAA,GAAS,GAAA,CAAI,IAAA,CAAK,IAAA,CAAK,QAAA,CAAU,OAAA;AAAA,MACrC,iBAAA,CAAkB;AAAA,KACpB;AAEA,IAAA,OAAO,EAAE,OAAA,EAAS,MAAM,MAAA,EAAO;AAAA,EACjC;AAEA,EAAA,MAAM,OAAA,GAAU,KAAK,SAAS,CAAA;AAE9B,EAAA,OAAO;AAAA,IACL,UAAA,GAAa;AACX,MAAA,2BACG,QAAA,EAAA,EAAS,QAAA,EAAU,gBAAA,EAClB,QAAA,kBAAA,GAAA,CAAC,WAAQ,CAAA,EACX,CAAA;AAAA,IAEJ;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"createApp.esm.js","sources":["../src/createApp.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { JSX, lazy, ReactNode, Suspense, useEffect, useState } from 'react';\nimport {\n  ConfigApi,\n  ExtensionFactoryMiddleware,\n  FrontendFeature,\n  FrontendFeatureLoader,\n} from '@backstage/frontend-plugin-api';\nimport { Progress } from '@backstage/core-components';\n// eslint-disable-next-line @backstage/no-relative-monorepo-imports\nimport { defaultConfigLoaderSync } from '../../core-app-api/src/app/defaultConfigLoader';\n// eslint-disable-next-line @backstage/no-relative-monorepo-imports\nimport { overrideBaseUrlConfigs } from '../../core-app-api/src/app/overrideBaseUrlConfigs';\nimport { ConfigReader } from '@backstage/config';\nimport {\n  CreateAppRouteBinder,\n  FinalizedSpecializedApp,\n  prepareSpecializedApp,\n  PreparedSpecializedApp,\n  FrontendPluginInfoResolver,\n} from '@backstage/frontend-app-api';\nimport appPlugin from '@backstage/plugin-app';\nimport { discoverAvailableFeatures } from './discovery';\nimport { resolveAsyncFeatures } from './resolution';\nimport { maybeCreateErrorPage } from './maybeCreateErrorPage';\n\n/**\n * Options for {@link createApp}.\n *\n * @public\n */\nexport interface CreateAppOptions {\n  /**\n   * The list of features to load.\n   */\n  features?: (FrontendFeature | FrontendFeatureLoader)[];\n\n  /**\n   * Allows for the binding of plugins' external route refs within the app.\n   */\n  bindRoutes?(context: { bind: CreateAppRouteBinder }): void;\n\n  /**\n   * Advanced, more rarely used options.\n   */\n  advanced?: {\n    /**\n     * Sets a custom config loader, replacing the builtin one.\n     *\n     * This can be used e.g. if you have the need to source config out of custom\n     * storages.\n     */\n    configLoader?: () => Promise<{ config: ConfigApi }>;\n\n    /**\n     * Applies one or more middleware on every extension, as they are added to\n     * the application.\n     *\n     * This is an advanced use case for modifying extension data on the fly as\n     * it gets emitted by extensions being instantiated.\n     */\n    extensionFactoryMiddleware?:\n      | ExtensionFactoryMiddleware\n      | ExtensionFactoryMiddleware[];\n\n    /**\n     * The element to render while loading the app (waiting for config, features, etc).\n     *\n     * This is the `<Progress />` component from `@backstage/core-components` by default.\n     * If set to `null` then no loading fallback element is rendered at all.\n     */\n    loadingElement?: ReactNode;\n\n    /**\n     * Allows for customizing how plugin info is retrieved.\n     */\n    pluginInfoResolver?: FrontendPluginInfoResolver;\n  };\n}\n\n/**\n * Creates a new Backstage frontend app instance. See https://backstage.io/docs/frontend-system/building-apps/index\n *\n * @public\n */\nexport function createApp(options?: CreateAppOptions): {\n  createRoot(): JSX.Element;\n} {\n  let suspenseFallback = options?.advanced?.loadingElement;\n  if (suspenseFallback === undefined) {\n    suspenseFallback = <Progress />;\n  }\n\n  async function appLoader() {\n    const config =\n      (await options?.advanced?.configLoader?.().then(c => c.config)) ??\n      ConfigReader.fromConfigs(\n        overrideBaseUrlConfigs(defaultConfigLoaderSync()),\n      );\n\n    const { features: discoveredFeaturesAndLoaders } =\n      discoverAvailableFeatures(config);\n    const { features: loadedFeatures } = await resolveAsyncFeatures({\n      config,\n      features: [...discoveredFeaturesAndLoaders, ...(options?.features ?? [])],\n    });\n\n    const preparedApp = prepareSpecializedApp({\n      features: [appPlugin, ...loadedFeatures],\n      config,\n      bindRoutes: options?.bindRoutes,\n      advanced: options?.advanced,\n    });\n\n    return {\n      default: () => <PreparedAppRoot preparedApp={preparedApp} />,\n    };\n  }\n\n  const LazyApp = lazy(appLoader);\n\n  return {\n    createRoot() {\n      return (\n        <Suspense fallback={suspenseFallback}>\n          <LazyApp />\n        </Suspense>\n      );\n    },\n  };\n}\n\nfunction PreparedAppRoot(props: {\n  preparedApp: PreparedSpecializedApp;\n}): JSX.Element {\n  const bootstrapApp = props.preparedApp.getBootstrapApp();\n  const [finalizedApp, setFinalizedApp] = useState<\n    FinalizedSpecializedApp | undefined\n  >();\n\n  useEffect(\n    () => props.preparedApp.onFinalized(setFinalizedApp),\n    [props.preparedApp],\n  );\n\n  if (!finalizedApp) {\n    return bootstrapApp.element;\n  }\n\n  const errorPage = maybeCreateErrorPage(finalizedApp);\n  if (errorPage) {\n    return errorPage;\n  }\n\n  return finalizedApp.element;\n}\n"],"names":[],"mappings":";;;;;;;;;;;;AAoGO,SAAS,UAAU,OAAA,EAExB;AACA,EAAA,IAAI,gBAAA,GAAmB,SAAS,QAAA,EAAU,cAAA;AAC1C,EAAA,IAAI,qBAAqB,MAAA,EAAW;AAClC,IAAA,gBAAA,uBAAoB,QAAA,EAAA,EAAS,CAAA;AAAA,EAC/B;AAEA,EAAA,eAAe,SAAA,GAAY;AACzB,IAAA,MAAM,MAAA,GACH,MAAM,OAAA,EAAS,QAAA,EAAU,YAAA,IAAe,CAAE,IAAA,CAAK,CAAA,CAAA,KAAK,CAAA,CAAE,MAAM,CAAA,IAC7D,YAAA,CAAa,WAAA;AAAA,MACX,sBAAA,CAAuB,yBAAyB;AAAA,KAClD;AAEF,IAAA,MAAM,EAAE,QAAA,EAAU,4BAAA,EAA6B,GAC7C,0BAA0B,MAAM,CAAA;AAClC,IAAA,MAAM,EAAE,QAAA,EAAU,cAAA,EAAe,GAAI,MAAM,oBAAA,CAAqB;AAAA,MAC9D,MAAA;AAAA,MACA,QAAA,EAAU,CAAC,GAAG,4BAAA,EAA8B,GAAI,OAAA,EAAS,QAAA,IAAY,EAAG;AAAA,KACzE,CAAA;AAED,IAAA,MAAM,cAAc,qBAAA,CAAsB;AAAA,MACxC,QAAA,EAAU,CAAC,SAAA,EAAW,GAAG,cAAc,CAAA;AAAA,MACvC,MAAA;AAAA,MACA,YAAY,OAAA,EAAS,UAAA;AAAA,MACrB,UAAU,OAAA,EAAS;AAAA,KACpB,CAAA;AAED,IAAA,OAAO;AAAA,MACL,OAAA,EAAS,sBAAM,GAAA,CAAC,eAAA,EAAA,EAAgB,WAAA,EAA0B;AAAA,KAC5D;AAAA,EACF;AAEA,EAAA,MAAM,OAAA,GAAU,KAAK,SAAS,CAAA;AAE9B,EAAA,OAAO;AAAA,IACL,UAAA,GAAa;AACX,MAAA,2BACG,QAAA,EAAA,EAAS,QAAA,EAAU,gBAAA,EAClB,QAAA,kBAAA,GAAA,CAAC,WAAQ,CAAA,EACX,CAAA;AAAA,IAEJ;AAAA,GACF;AACF;AAEA,SAAS,gBAAgB,KAAA,EAET;AACd,EAAA,MAAM,YAAA,GAAe,KAAA,CAAM,WAAA,CAAY,eAAA,EAAgB;AACvD,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,QAAA,EAEtC;AAEF,EAAA,SAAA;AAAA,IACE,MAAM,KAAA,CAAM,WAAA,CAAY,WAAA,CAAY,eAAe,CAAA;AAAA,IACnD,CAAC,MAAM,WAAW;AAAA,GACpB;AAEA,EAAA,IAAI,CAAC,YAAA,EAAc;AACjB,IAAA,OAAO,YAAA,CAAa,OAAA;AAAA,EACtB;AAEA,EAAA,MAAM,SAAA,GAAY,qBAAqB,YAAY,CAAA;AACnD,EAAA,IAAI,SAAA,EAAW;AACb,IAAA,OAAO,SAAA;AAAA,EACT;AAEA,EAAA,OAAO,YAAA,CAAa,OAAA;AACtB;;;;"}

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode, JSX } from 'react';
-import { FrontendFeature, FrontendFeatureLoader, ConfigApi } from '@backstage/frontend-plugin-api';
-import { CreateAppRouteBinder, ExtensionFactoryMiddleware, FrontendPluginInfoResolver, AppError, AppErrorTypes } from '@backstage/frontend-app-api';
+import { FrontendFeature, FrontendFeatureLoader, ConfigApi, ExtensionFactoryMiddleware } from '@backstage/frontend-plugin-api';
+import { CreateAppRouteBinder, FrontendPluginInfoResolver, AppError, AppErrorTypes } from '@backstage/frontend-app-api';
 import { Config } from '@backstage/config';
 
 /**

package/dist/maybeCreateErrorPage.esm.js

@@ -6,7 +6,9 @@ const DEFAULT_WARNING_CODES = [
   "INVALID_EXTENSION_CONFIG_KEY",
   "EXTENSION_INPUT_DATA_IGNORED",
   "EXTENSION_INPUT_INTERNAL_IGNORED",
-  "EXTENSION_OUTPUT_IGNORED"
+  "EXTENSION_OUTPUT_IGNORED",
+  "EXTENSION_BOOTSTRAP_PREDICATE_IGNORED",
+  "EXTENSION_BOOTSTRAP_API_UNAVAILABLE"
 ];
 function AppErrorItem(props) {
   const { context } = props.error;

package/dist/maybeCreateErrorPage.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"maybeCreateErrorPage.esm.js","sources":["../src/maybeCreateErrorPage.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { FrontendPluginInfo } from '@backstage/frontend-plugin-api';\nimport { JSX, useEffect, useState } from 'react';\nimport { AppError, AppErrorTypes } from '@backstage/frontend-app-api';\n\nconst DEFAULT_WARNING_CODES: Array<keyof AppErrorTypes> = [\n  'EXTENSION_IGNORED',\n  'INVALID_EXTENSION_CONFIG_KEY',\n  'EXTENSION_INPUT_DATA_IGNORED',\n  'EXTENSION_INPUT_INTERNAL_IGNORED',\n  'EXTENSION_OUTPUT_IGNORED',\n];\n\nfunction AppErrorItem(props: { error: AppError }): JSX.Element {\n  const { context } = props.error;\n\n  const node = 'node' in context ? context.node : undefined;\n  const extensionId =\n    'extensionId' in context ? context.extensionId : node?.spec.id;\n  const routeId = 'routeId' in context ? context.routeId : undefined;\n  const plugin = 'plugin' in context ? context.plugin : node?.spec.plugin;\n  const pluginId = plugin?.pluginId ?? 'N/A';\n\n  const [info, setInfo] = useState<FrontendPluginInfo | undefined>(undefined);\n  useEffect(() => {\n    plugin?.info().then(setInfo, error => {\n      // eslint-disable-next-line no-console\n      console.error(\n        `Failed to load info for plugin ${plugin.pluginId}: ${error}`,\n      );\n    });\n  }, [plugin]);\n\n  return (\n    <div>\n      <b>{props.error.code}</b>: {props.error.message}\n      <pre style={{ marginLeft: '1rem' }}>\n        {extensionId && <div>extensionId: {extensionId}</div>}\n        {routeId && <div>routeId: {routeId}</div>}\n        {pluginId && <div>pluginId: {pluginId}</div>}\n        {info && (\n          <div>\n            package: {info.packageName}@{info.version}\n          </div>\n        )}\n      </pre>\n    </div>\n  );\n}\n\nfunction AppErrorPage(props: { errors: AppError[] }): JSX.Element {\n  return (\n    <div style={{ margin: '1rem' }}>\n      <h2>App startup failed</h2>\n      {props.errors.map((error, index) => (\n        <AppErrorItem error={error} key={index} />\n      ))}\n    </div>\n  );\n}\n\n/**\n * If there are any unrecoverable errors in the app, this will return an error page in the form of a JSX element.\n *\n * If there are any recoverable errors, they will always be logged as warnings in the console.\n * @public\n */\nexport function maybeCreateErrorPage(\n  app: { errors?: AppError[] },\n  options?: {\n    warningCodes?: Array<keyof AppErrorTypes>;\n  },\n): JSX.Element | undefined {\n  if (!app.errors) {\n    return undefined;\n  }\n\n  const errors = new Array<AppError>();\n  const warnings = new Array<AppError>();\n\n  const warningCodes = new Set(options?.warningCodes ?? DEFAULT_WARNING_CODES);\n  for (const error of app.errors) {\n    if (warningCodes.has(error.code)) {\n      warnings.push(error);\n    } else {\n      errors.push(error);\n    }\n  }\n\n  if (warnings.length > 0) {\n    // eslint-disable-next-line no-console\n    console.warn('App startup encountered warnings:');\n    for (const warning of warnings) {\n      // eslint-disable-next-line no-console\n      console.warn(`${warning.code}: ${warning.message}`);\n    }\n  }\n\n  if (errors.length === 0) {\n    return undefined;\n  }\n\n  return <AppErrorPage errors={errors} />;\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"maybeCreateErrorPage.esm.js","sources":["../src/maybeCreateErrorPage.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { FrontendPluginInfo } from '@backstage/frontend-plugin-api';\nimport { JSX, useEffect, useState } from 'react';\nimport { AppError, AppErrorTypes } from '@backstage/frontend-app-api';\n\nconst DEFAULT_WARNING_CODES: Array<keyof AppErrorTypes> = [\n  'EXTENSION_IGNORED',\n  'INVALID_EXTENSION_CONFIG_KEY',\n  'EXTENSION_INPUT_DATA_IGNORED',\n  'EXTENSION_INPUT_INTERNAL_IGNORED',\n  'EXTENSION_OUTPUT_IGNORED',\n  'EXTENSION_BOOTSTRAP_PREDICATE_IGNORED',\n  'EXTENSION_BOOTSTRAP_API_UNAVAILABLE',\n];\n\nfunction AppErrorItem(props: { error: AppError }): JSX.Element {\n  const { context } = props.error;\n\n  const node = 'node' in context ? context.node : undefined;\n  const extensionId =\n    'extensionId' in context ? context.extensionId : node?.spec.id;\n  const routeId = 'routeId' in context ? context.routeId : undefined;\n  const plugin = 'plugin' in context ? context.plugin : node?.spec.plugin;\n  const pluginId = plugin?.pluginId ?? 'N/A';\n\n  const [info, setInfo] = useState<FrontendPluginInfo | undefined>(undefined);\n  useEffect(() => {\n    plugin?.info().then(setInfo, error => {\n      // eslint-disable-next-line no-console\n      console.error(\n        `Failed to load info for plugin ${plugin.pluginId}: ${error}`,\n      );\n    });\n  }, [plugin]);\n\n  return (\n    <div>\n      <b>{props.error.code}</b>: {props.error.message}\n      <pre style={{ marginLeft: '1rem' }}>\n        {extensionId && <div>extensionId: {extensionId}</div>}\n        {routeId && <div>routeId: {routeId}</div>}\n        {pluginId && <div>pluginId: {pluginId}</div>}\n        {info && (\n          <div>\n            package: {info.packageName}@{info.version}\n          </div>\n        )}\n      </pre>\n    </div>\n  );\n}\n\nfunction AppErrorPage(props: { errors: AppError[] }): JSX.Element {\n  return (\n    <div style={{ margin: '1rem' }}>\n      <h2>App startup failed</h2>\n      {props.errors.map((error, index) => (\n        <AppErrorItem error={error} key={index} />\n      ))}\n    </div>\n  );\n}\n\n/**\n * If there are any unrecoverable errors in the app, this will return an error page in the form of a JSX element.\n *\n * If there are any recoverable errors, they will always be logged as warnings in the console.\n * @public\n */\nexport function maybeCreateErrorPage(\n  app: { errors?: AppError[] },\n  options?: {\n    warningCodes?: Array<keyof AppErrorTypes>;\n  },\n): JSX.Element | undefined {\n  if (!app.errors) {\n    return undefined;\n  }\n\n  const errors = new Array<AppError>();\n  const warnings = new Array<AppError>();\n\n  const warningCodes = new Set(options?.warningCodes ?? DEFAULT_WARNING_CODES);\n  for (const error of app.errors) {\n    if (warningCodes.has(error.code)) {\n      warnings.push(error);\n    } else {\n      errors.push(error);\n    }\n  }\n\n  if (warnings.length > 0) {\n    // eslint-disable-next-line no-console\n    console.warn('App startup encountered warnings:');\n    for (const warning of warnings) {\n      // eslint-disable-next-line no-console\n      console.warn(`${warning.code}: ${warning.message}`);\n    }\n  }\n\n  if (errors.length === 0) {\n    return undefined;\n  }\n\n  return <AppErrorPage errors={errors} />;\n}\n"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/frontend-defaults",
-  "version": "0.5.0-next.1",
+  "version": "0.5.0",
   "backstage": {
     "role": "web-library"
   },
@@ -31,19 +31,21 @@
     "test": "backstage-cli package test"
   },
   "dependencies": {
-    "@backstage/config": "1.3.6",
-    "@backstage/core-components": "0.18.8-next.1",
-    "@backstage/errors": "1.2.7",
-    "@backstage/frontend-app-api": "0.16.0-next.1",
-    "@backstage/frontend-plugin-api": "0.15.0-next.1",
-    "@backstage/plugin-app": "0.4.1-next.2",
+    "@backstage/config": "^1.3.6",
+    "@backstage/core-components": "^0.18.8",
+    "@backstage/errors": "^1.2.7",
+    "@backstage/frontend-app-api": "^0.16.0",
+    "@backstage/frontend-plugin-api": "^0.15.0",
+    "@backstage/plugin-app": "^0.4.1",
     "@react-hookz/web": "^24.0.0"
   },
   "devDependencies": {
-    "@backstage/cli": "0.36.0-next.2",
-    "@backstage/core-plugin-api": "1.12.4-next.1",
-    "@backstage/plugin-app-react": "0.2.1-next.1",
-    "@backstage/test-utils": "1.7.16-next.0",
+    "@backstage/cli": "^0.36.0",
+    "@backstage/core-plugin-api": "^1.12.4",
+    "@backstage/plugin-app-react": "^0.2.1",
+    "@backstage/plugin-permission-common": "^0.9.7",
+    "@backstage/plugin-permission-react": "^0.4.41",
+    "@backstage/test-utils": "^1.7.16",
     "@testing-library/jest-dom": "^6.0.0",
     "@testing-library/react": "^16.0.0",
     "@types/react": "^18.0.0",