wp-optimize / vendor / team-updraft / lib-onboarding-wizard / Wizard / Onboarding / src / components / ErrorBoundary.tsx

ErrorBoundary.tsx in WP-Optimize – Cache, Compress images, Minify & Clean database to boost page speed & performance trunk, at vendor/team-updraft/lib-onboarding-wizard/Wizard/Onboarding/src/components/ErrorBoundary.tsx

45 lines 1.3 KB

Raw Download Zip

1	import { Component } from '@wordpress/element';
2	import type { ErrorInfo, ReactNode } from 'react';
3	import { __ } from '@wordpress/i18n';
4
5	interface Props {
6	children: ReactNode;
7	}
8
9	interface State {
10	hasError: boolean;
11	error?: Error;
12	}
13
14	class ErrorBoundary extends Component<Props, State> {
15	public state: State = {
16	hasError: false
17	};
18
19	public static getDerivedStateFromError(error: Error): State {
20	return { hasError: true, error };
21	}
22
23	public componentDidCatch(error: Error, errorInfo: ErrorInfo) {
24	console.error('Uncaught error:', error, errorInfo);
25	}
26
27	public render() {
28	if (this.state.hasError) {
29	return (
30	<div className="p-4 bg-red-50 border border-red-200 rounded-md">
31	<h2 className="text-red-800 font-semibold mb-2">
32	{__('Something went wrong', 'ONBOARDING_WIZARD_TEXT_DOMAIN')}
33	</h2>
34	<p className="text-red-600">
35	{__('Please try refreshing the page or contact support if the problem persists.', 'ONBOARDING_WIZARD_TEXT_DOMAIN')}
36	</p>
37	</div>
38	);
39	}
40
41	return this.props.children;
42	}
43	}
44
45	export { ErrorBoundary };