import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { childLogger } from "document-drive";
import { ErrorBoundary as ReactErrorBoundary, } from "react-error-boundary";
const logger = childLogger(["Connect"]);
function hasCustomFallback(props) {
    return "fallbackRender" in props;
}
function SilentFallback() {
    return null;
}
/**
 * Simple text-based fallback component.
 * Displays a centered message when an error occurs.
 */
function TextFallback({ message = "Something went wrong", }) {
    return _jsx("div", { className: "text-center", children: message });
}
/**
 * Detailed fallback component showing full error information.
 * Displays error message and JSON representation of the error object.
 * Useful for development and debugging purposes.
 */
function DetailedFallback({ error }) {
    const errorMessage = error instanceof Error ? error.message : String(error);
    return (_jsxs("div", { className: "mx-auto flex max-w-[80%] flex-1 flex-col items-center justify-center", children: [_jsx("h1", { className: "mb-2 text-xl font-semibold", children: "Error" }), _jsx("i", { children: errorMessage }), _jsx("pre", { children: JSON.stringify(error, null, 2) })] }));
}
/**
 * Centered error message fallback component.
 * Displays the error message in a centered, full-size container.
 * Suitable for use as a custom fallbackRender when you need simple error display.
 */
function CenteredErrorMessage({ error }) {
    const errorMessage = error instanceof Error ? error.message : String(error);
    return (_jsx("div", { className: "flex size-full items-center justify-center", children: _jsx("h3", { className: "text-lg font-semibold", children: errorMessage }) }));
}
function getFallbackComponent(variant, fallbackMessage) {
    switch (variant) {
        case "silent":
            return SilentFallback;
        case "text":
            return () => _jsx(TextFallback, { message: fallbackMessage });
        case "detailed":
            return DetailedFallback;
        default:
            return CenteredErrorMessage;
    }
}
/**
 * Unified error boundary component for catching and handling React errors.
 *
 * Built on top of `react-error-boundary`, this component provides:
 * - Automatic error logging with configurable context
 * - Multiple fallback UI variants (silent, text, detailed)
 * - Support for custom fallback render functions
 * - Reset capability via `resetKeys`
 *
 * @example
 * // Using a predefined variant
 * <ErrorBoundary variant="detailed" loggerContext={["Connect", "Editor"]}>
 *   <EditorComponent />
 * </ErrorBoundary>
 *
 * @example
 * // Using a custom message with the text variant
 * <ErrorBoundary variant="text" fallbackMessage="Failed to load drives">
 *   <DrivesList />
 * </ErrorBoundary>
 *
 * @example
 * // Using a custom fallback render
 * <ErrorBoundary
 *   fallbackRender={CenteredErrorMessage}
 *   onError={(error) => trackError(error)}
 * >
 *   <MyComponent />
 * </ErrorBoundary>
 *
 * @example
 * // Silent mode for modals (renders null on error)
 * <ErrorBoundary variant="silent" loggerContext={["Connect", "Modals"]}>
 *   <ModalContent />
 * </ErrorBoundary>
 */
export function ErrorBoundary(props) {
    const { children, onError, resetKeys, loggerContext } = props;
    const handleError = (error, info) => {
        if (error.message.includes("Failed to fetch dynamically imported module") &&
            error.message.includes("node_modules/.vite")) {
            console.error(error);
            console.log("Outdated chunk detected, reloading page...");
            window.location.reload();
            return;
        }
        const contextLogger = loggerContext ? childLogger(loggerContext) : logger;
        contextLogger.error(error, info);
        onError?.(error, info);
    };
    const fallbackRender = hasCustomFallback(props)
        ? props.fallbackRender
        : getFallbackComponent(props.variant, props.fallbackMessage);
    return (_jsx(ReactErrorBoundary, { fallbackRender: fallbackRender, onError: handleError, resetKeys: resetKeys, children: children }));
}
export { CenteredErrorMessage, DetailedFallback, TextFallback };
//# sourceMappingURL=error-boundary.js.map