"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Component, useState } from "react";
/**
 * Check if an error is a network-related error
 */
function isNetworkError(error) {
    return error.name === "NetworkError";
}
/**
 * Network error fallback UI with retry functionality
 * Shows a connection-specific message and allows retrying via page refresh
 */
function NetworkErrorFallback({ error, reset, }) {
    const [isRetrying, setIsRetrying] = useState(false);
    const handleRetry = () => {
        setIsRetrying(true);
        // Refresh the page to retry the request
        window.location.reload();
    };
    return (_jsxs("div", { style: {
            fontFamily: "system-ui, -apple-system, sans-serif",
            padding: "2rem",
            maxWidth: "600px",
            margin: "2rem auto",
            textAlign: "center",
        }, children: [_jsx("div", { style: {
                    fontSize: "3rem",
                    marginBottom: "1rem",
                }, children: _jsx("span", { style: { color: "#9ca3af" }, children: "\u2601" }) }), _jsx("h1", { style: {
                    color: "#374151",
                    fontSize: "1.5rem",
                    marginBottom: "0.5rem",
                }, children: "Connection Error" }), _jsx("p", { style: {
                    color: "#6b7280",
                    marginBottom: "1.5rem",
                }, children: error.message || "Unable to connect to the server. Please check your internet connection." }), _jsxs("div", { style: { display: "flex", gap: "1rem", justifyContent: "center" }, children: [_jsx("button", { type: "button", onClick: handleRetry, disabled: isRetrying, style: {
                            padding: "0.75rem 1.5rem",
                            backgroundColor: isRetrying ? "#9ca3af" : "#2563eb",
                            color: "white",
                            border: "none",
                            borderRadius: "0.375rem",
                            cursor: isRetrying ? "not-allowed" : "pointer",
                            fontSize: "1rem",
                            fontWeight: 500,
                        }, children: isRetrying ? "Retrying..." : "Retry" }), _jsx("button", { type: "button", onClick: () => window.history.back(), style: {
                            padding: "0.75rem 1.5rem",
                            backgroundColor: "transparent",
                            color: "#6b7280",
                            border: "1px solid #d1d5db",
                            borderRadius: "0.375rem",
                            cursor: "pointer",
                            fontSize: "1rem",
                        }, children: "Go Back" })] })] }));
}
/**
 * Default fallback UI for root error boundary
 * This is shown when an unhandled error bubbles up to the root
 */
function RootErrorFallback({ error, reset }) {
    return (_jsxs("div", { style: {
            fontFamily: "system-ui, -apple-system, sans-serif",
            padding: "2rem",
            maxWidth: "600px",
            margin: "2rem auto",
        }, children: [_jsx("h1", { style: {
                    color: "#dc2626",
                    fontSize: "1.5rem",
                    marginBottom: "1rem",
                }, children: "Internal Server Error" }), _jsx("p", { style: {
                    color: "#374151",
                    marginBottom: "1rem",
                }, children: "An unexpected error occurred while processing your request." }), _jsxs("div", { style: {
                    background: "#fef2f2",
                    border: "1px solid #fecaca",
                    borderRadius: "0.5rem",
                    padding: "1rem",
                    marginBottom: "1rem",
                }, children: [_jsxs("p", { style: {
                            fontWeight: 600,
                            color: "#991b1b",
                            marginBottom: "0.5rem",
                        }, children: [error.name, ": ", error.message] }), error.stack && (_jsx("pre", { style: {
                            fontSize: "0.75rem",
                            color: "#6b7280",
                            overflow: "auto",
                            whiteSpace: "pre-wrap",
                            wordBreak: "break-word",
                        }, children: error.stack }))] }), _jsxs("div", { style: { display: "flex", gap: "1rem" }, children: [_jsx("button", { type: "button", onClick: reset, style: {
                            padding: "0.5rem 1rem",
                            backgroundColor: "#2563eb",
                            color: "white",
                            border: "none",
                            borderRadius: "0.25rem",
                            cursor: "pointer",
                        }, children: "Try Again" }), _jsx("a", { href: "/", style: {
                            display: "inline-block",
                            padding: "0.5rem 1rem",
                            color: "#2563eb",
                            textDecoration: "underline",
                        }, children: "Go to homepage" })] })] }));
}
/**
 * Root error boundary component
 *
 * Wraps the entire segment tree to catch any unhandled errors that bubble up.
 * This prevents the entire app from crashing with a white screen.
 *
 * This is a client component with an inline fallback to avoid the
 * "Functions cannot be passed to Client Components" RSC error.
 */
export class RootErrorBoundary extends Component {
    constructor(props) {
        super(props);
        this.handlePopState = () => {
            // Reset error state on back/forward navigation
            if (this.state.hasError) {
                this.setState({ hasError: false, error: null });
            }
        };
        this.reset = () => {
            this.setState({ hasError: false, error: null });
        };
        this.state = { hasError: false, error: null };
    }
    static getDerivedStateFromError(error) {
        return { hasError: true, error };
    }
    componentDidMount() {
        // Listen for popstate (back/forward navigation) to reset error state
        window.addEventListener("popstate", this.handlePopState);
    }
    componentWillUnmount() {
        window.removeEventListener("popstate", this.handlePopState);
    }
    componentDidCatch(error, errorInfo) {
        console.error("[RootErrorBoundary] Unhandled error caught:", error, errorInfo);
    }
    componentDidUpdate(prevProps) {
        // Reset error state when children change (e.g., navigation)
        // This allows the app to recover after navigation away from an errored route
        if (this.state.hasError && prevProps.children !== this.props.children) {
            this.setState({ hasError: false, error: null });
        }
    }
    render() {
        if (this.state.hasError && this.state.error) {
            const errorInfo = {
                message: this.state.error.message,
                name: this.state.error.name,
                stack: this.state.error.stack,
                cause: this.state.error.cause,
                segmentId: "root",
                segmentType: "route",
            };
            // Use specialized fallback for network errors
            if (isNetworkError(this.state.error)) {
                return _jsx(NetworkErrorFallback, { error: errorInfo, reset: this.reset });
            }
            return _jsx(RootErrorFallback, { error: errorInfo, reset: this.reset });
        }
        return this.props.children;
    }
}
//# sourceMappingURL=root-error-boundary.js.map