o2o-infinith-demo/src/components/report/ui/SectionErrorBoundary.tsx

34 lines
796 B
TypeScript

import { Component, type ReactNode } from 'react';
interface Props {
children: ReactNode;
fallback?: ReactNode;
}
interface State {
hasError: boolean;
}
export class SectionErrorBoundary extends Component<Props, State> {
state: State = { hasError: false };
static getDerivedStateFromError() {
return { hasError: true };
}
componentDidCatch(error: Error) {
console.error('[SectionErrorBoundary]', error.message, error.stack);
}
render() {
if (this.state.hasError) {
return this.props.fallback ?? (
<div className="px-6 py-4 bg-red-50 border border-red-200 rounded-xl my-4 mx-4">
<p className="text-xs font-mono text-red-600"> ( )</p>
</div>
);
}
return this.props.children;
}
}