this repo has no description
notnite.com
1import React from "@moonlight-mod/wp/react";
2import { ErrorBoundaryProps, ErrorBoundaryState } from "@moonlight-mod/types/coreExtensions/common";
3
4const logger = moonlight.getLogger("ErrorBoundary");
5
6class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
7 constructor(props: ErrorBoundaryProps) {
8 super(props);
9 this.state = {
10 errored: false,
11 error: undefined,
12 componentStack: undefined
13 };
14 }
15
16 static getDerivedStateFromError(error: Error) {
17 return {
18 errored: true,
19 error
20 };
21 }
22
23 componentDidCatch(error: Error, { componentStack }: { componentStack: string }) {
24 logger.error(`${error}\n\nComponent stack:\n${componentStack}`);
25 this.setState({ error, componentStack });
26 }
27
28 render() {
29 const { noop, fallback: FallbackComponent, children, message } = this.props;
30 const { errored, error, componentStack } = this.state;
31
32 if (noop) return null;
33 if (FallbackComponent) return <FallbackComponent children={children} {...this.state} />;
34
35 if (errored) {
36 return (
37 <div className={`moonlight-error-boundary`}>
38 <h3>{message ?? "An error occurred rendering this component:"}</h3>
39 <code className="hljs">{`${error}\n\nComponent stack:\n${componentStack}`}</code>
40 </div>
41 );
42 }
43
44 return children;
45 }
46}
47
48export default ErrorBoundary;