// @refresh skip
import { ErrorBoundary, Show, createEffect, createSignal, onCleanup, resetErrorBoundaries } from "solid-js";
import { HttpStatusCode } from "../HttpStatusCode";
import clientOnly from "../clientOnly";
const DevOverlayDialog = 
/* #__PURE__ */ process.env.NODE_ENV === "production"
    ? () => {
        return <></>;
    }
    : /* #__PURE__ */ clientOnly(() => import("./DevOverlayDialog"), { lazy: true });
export function DevOverlay(props) {
    const [errors, setErrors] = createSignal([]);
    function resetError() {
        setErrors([]);
        resetErrorBoundaries();
    }
    function pushError(error) {
        console.error(error);
        setErrors(current => [error, ...current]);
    }
    createEffect(() => {
        const onErrorEvent = (error) => {
            pushError(error.error ?? error);
        };
        window.addEventListener("error", onErrorEvent);
        onCleanup(() => {
            window.removeEventListener("error", onErrorEvent);
        });
    });
    return (<>
      <ErrorBoundary fallback={error => {
            pushError(error);
            return <HttpStatusCode code={500}/>;
        }}>
        {props.children}
      </ErrorBoundary>
      <Show when={errors().length}>
        <HttpStatusCode code={500}/>
        <DevOverlayDialog errors={errors()} resetError={resetError}/>
      </Show>
    </>);
}
