28 lines
669 B
TypeScript
28 lines
669 B
TypeScript
import { ReactNode } from "react";
|
|
import { ErrorBoundary, FallbackProps } from "react-error-boundary";
|
|
|
|
function ErrorFallback({ error }: FallbackProps) {
|
|
return (
|
|
<div role="alert" style={{ padding: 16, height: "100%", overflow: "auto" }}>
|
|
<h4>Something went wrong:(</h4>
|
|
|
|
<pre>{error.message}</pre>
|
|
|
|
<details title="Error Stack">
|
|
<summary>Error Stack</summary>
|
|
<pre>{error.stack}</pre>
|
|
</details>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
interface Props {
|
|
children?: ReactNode;
|
|
}
|
|
|
|
export const BaseErrorBoundary = ({ children }: Props) => {
|
|
return (
|
|
<ErrorBoundary FallbackComponent={ErrorFallback}>{children}</ErrorBoundary>
|
|
);
|
|
};
|