diff --git a/packages/frontend-app-api/src/extensions/components.tsx b/packages/frontend-app-api/src/extensions/components.tsx
index fa9187a831..e13c1b2f3b 100644
--- a/packages/frontend-app-api/src/extensions/components.tsx
+++ b/packages/frontend-app-api/src/extensions/components.tsx
@@ -14,10 +14,15 @@
* limitations under the License.
*/
+import React from 'react';
+// TODO: Dependency on MUI should be removed from core packages
+import { Button } from '@material-ui/core';
+
import {
createComponentExtension,
coreComponentsRefs,
} from '@backstage/frontend-plugin-api';
+import { ErrorPanel } from '@backstage/core-components';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
import { components as defaultComponents } from '../../../app-defaults/src/defaults';
// eslint-disable-next-line @backstage/no-relative-monorepo-imports
@@ -39,5 +44,18 @@ export const DefaultNotFoundErrorPageComponent = createComponentExtension({
export const DefaultErrorBoundaryComponent = createComponentExtension({
ref: coreComponentsRefs.errorBoundaryFallback,
- component: { sync: () => defaultComponents.ErrorBoundaryFallback },
+ component: {
+ sync: () => props => {
+ const { plugin, error, resetError } = props;
+ const title = `Error in ${plugin?.id}`;
+
+ return (
+
+
+
+ );
+ },
+ },
});
diff --git a/packages/frontend-plugin-api/api-report.md b/packages/frontend-plugin-api/api-report.md
index e8f4f16e97..e578c181fb 100644
--- a/packages/frontend-plugin-api/api-report.md
+++ b/packages/frontend-plugin-api/api-report.md
@@ -22,7 +22,6 @@ import { AuthProviderInfo } from '@backstage/core-plugin-api';
import { AuthRequestOptions } from '@backstage/core-plugin-api';
import { BackstageIdentityApi } from '@backstage/core-plugin-api';
import { BackstageIdentityResponse } from '@backstage/core-plugin-api';
-import { BackstagePlugin as BackstagePlugin_2 } from '@backstage/core-plugin-api';
import { BackstageUserIdentity } from '@backstage/core-plugin-api';
import { bitbucketAuthApiRef } from '@backstage/core-plugin-api';
import { bitbucketServerAuthApiRef } from '@backstage/core-plugin-api';
@@ -340,7 +339,7 @@ export const coreComponentsRefs: {
// @public (undocumented)
export type CoreErrorBoundaryFallbackComponent = ComponentType<
PropsWithChildren<{
- plugin?: BackstagePlugin_2;
+ plugin?: BackstagePlugin;
error: Error;
resetError: () => void;
}>
diff --git a/packages/frontend-plugin-api/src/components/ErrorBoundary.tsx b/packages/frontend-plugin-api/src/components/ErrorBoundary.tsx
index 1191b75a1d..e3765be386 100644
--- a/packages/frontend-plugin-api/src/components/ErrorBoundary.tsx
+++ b/packages/frontend-plugin-api/src/components/ErrorBoundary.tsx
@@ -15,34 +15,13 @@
*/
import React, { Component, PropsWithChildren } from 'react';
-// TODO: Dependency on MUI should be removed from core packages
-import { Button } from '@material-ui/core';
-import { ErrorPanel } from '@backstage/core-components';
import { BackstagePlugin } from '../wiring';
+import { CoreErrorBoundaryFallbackComponent } from '../types';
-type DefaultErrorBoundaryFallbackProps = PropsWithChildren<{
+type ErrorBoundaryProps = PropsWithChildren<{
plugin?: BackstagePlugin;
- error: Error;
- resetError: () => void;
+ fallback: CoreErrorBoundaryFallbackComponent;
}>;
-
-const DefaultErrorBoundaryFallback = ({
- plugin,
- error,
- resetError,
-}: DefaultErrorBoundaryFallbackProps) => {
- const title = `Error in ${plugin?.id}`;
-
- return (
-
-
-
- );
-};
-
-type ErrorBoundaryProps = PropsWithChildren<{ plugin?: BackstagePlugin }>;
type ErrorBoundaryState = { error?: Error };
/** @internal */
@@ -62,12 +41,11 @@ export class ErrorBoundary extends Component<
render() {
const { error } = this.state;
- const { plugin, children } = this.props;
+ const { plugin, children, fallback: Fallback } = this.props;
if (error) {
- // TODO: use a configurable error boundary fallback
return (
-
-
+
{children}
diff --git a/packages/frontend-plugin-api/src/types.ts b/packages/frontend-plugin-api/src/types.ts
index f3f68c362c..3c79bcdf35 100644
--- a/packages/frontend-plugin-api/src/types.ts
+++ b/packages/frontend-plugin-api/src/types.ts
@@ -14,8 +14,8 @@
* limitations under the License.
*/
-import { BackstagePlugin } from '@backstage/core-plugin-api';
import { ComponentType, PropsWithChildren } from 'react';
+import { BackstagePlugin } from './wiring';
// TODO(Rugvip): This might be a quite useful utility type, maybe add to @backstage/types?
/**