import React, { Component } from "react";
/**
 * A React Error Boundary component that catches JavaScript errors in its child component tree.
 *
 * @remarks
 * This component logs errors to the console and displays a fallback UI when an error occurs.
 * It is used to prevent the entire application from crashing due to an error in a specific route or component.
 */
export class ErrorBoundary extends Component {
    state = {
        hasError: false,
        error: null,
    };
    /**
     * Updates the state when an error is thrown in a descendant component.
     *
     * @param error - The error that was thrown.
     * @returns The new state object.
     */
    static getDerivedStateFromError(error) {
        // Update state so the next render will show the fallback UI.
        return { hasError: true, error: error };
    }
    /**
     * Logs error information when an error is caught.
     *
     * @param error - The error that was thrown.
     * @param errorInfo - Component stack trace information.
     */
    componentDidCatch(error, errorInfo) {
        console.error("Uncaught error:", error.message, errorInfo);
    }
    render() {
        if (this.state.hasError) {
            // TODO: Customisable
            return (<div>
					<h1>Sorry.. there was an error: {this.state.error?.name}</h1>
					<p>{this.state.error?.message}</p>
				</div>);
        }
        return this.props.children;
    }
}
export default ErrorBoundary;