"use client";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { FileText, Loader2 } from "lucide-react";
import { useEffect, useRef, useState } from "react";
import { useEditContext } from "../editor/client/editContext";
import { getAbsoluteIconUrl } from "../editor/utils";
import { HomeListBadge, HomeListIcon, homeListContainerClass, homeListRowClass, } from "../editor/ui/HomeListRow";
import { cn } from "../lib/utils";
export function RecentPages({ onClose, bare = false, compact = false, }) {
    const editContext = useEditContext();
    const [history, setHistory] = useState();
    const [isLoading, setIsLoading] = useState(false);
    const getItemsStubsRef = useRef(editContext?.itemsRepository?.getItemsStubs);
    useEffect(() => {
        if (editContext?.itemsRepository?.getItemsStubs) {
            getItemsStubsRef.current = editContext.itemsRepository.getItemsStubs;
        }
    }, [editContext?.itemsRepository?.getItemsStubs]);
    const recentPages = editContext?.browseHistory || [];
    useEffect(() => {
        const fetchItems = async () => {
            if (recentPages.length === 0) {
                setHistory([]);
                return;
            }
            const getItemsStubs = getItemsStubsRef.current;
            if (!getItemsStubs) {
                setHistory([]);
                return;
            }
            setIsLoading(true);
            try {
                const pages = await getItemsStubs(recentPages);
                setHistory(pages);
            }
            finally {
                setIsLoading(false);
            }
        };
        fetchItems();
    }, [recentPages]);
    const handlePageLoad = (item) => {
        if (editContext) {
            if (onClose) {
                onClose();
            }
            editContext
                .loadItem({
                id: item.id,
                language: item.language ?? "en",
                version: item.version,
            })
                .then(() => {
                editContext.switchWorkspace("editor");
            });
        }
    };
    const body = isLoading ? (_jsxs("div", { className: "flex flex-col items-center justify-center p-12 text-center", children: [_jsx(Loader2, { className: "text-highlight-100 h-6 w-6 animate-spin" }), _jsx("div", { className: "text-neutral-grey-50 mt-4 text-xs", children: "Loading recent items..." })] })) : !history || history.length === 0 ? (_jsx("div", { className: "text-neutral-grey-50 p-12 text-center text-xs", children: "No recent items yet" })) : (_jsx("div", { className: homeListContainerClass, children: history.slice(0, 12).map((page, index) => (_jsxs("button", { onClick: () => handlePageLoad(page), className: cn(homeListRowClass, !compact && "items-center gap-4 px-5"), children: [_jsx(HomeListIcon, { children: page.icon ? (_jsx("img", { src: getAbsoluteIconUrl(page.icon), alt: page.name || "", className: "h-5 w-5 object-contain" })) : (_jsx(FileText, { className: "h-4 w-4", strokeWidth: 1.5 })) }), compact ? (_jsx("div", { className: "min-w-0 flex-1", children: _jsxs("div", { className: "flex min-w-0 items-start gap-2", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "text-neutral-grey-100 truncate text-xs font-medium", children: page.name }), _jsx("div", { className: "text-neutral-grey-50 line-clamp-2 text-[11px] break-all", children: page.path })] }), _jsx(HomeListBadge, { className: cn("max-w-[45%] min-w-0 shrink truncate", !page.workflowState || page.workflowState === "Draft"
                                    ? "bg-neutral-grey-5 text-neutral-grey-100"
                                    : page.isFinalState
                                        ? "bg-feedback-green-light text-feedback-green"
                                        : /approval/i.test(page.workflowState)
                                            ? "bg-feedback-orange-light text-feedback-orange"
                                            : "bg-highlight-10 text-highlight-100"), children: page.workflowState || "Draft" })] }) })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "text-neutral-grey-100 truncate text-xs font-medium", children: page.name }), _jsx("div", { className: "text-neutral-grey-50 mt-0.5 truncate text-[11px]", children: page.path })] }), _jsxs("div", { className: "text-neutral-grey-50 hidden min-w-0 shrink-0 items-center gap-3 text-[11px] md:flex", children: [page.templateName && (_jsx("span", { className: "max-w-[140px] truncate", children: page.templateName })), page.language && (_jsx("span", { className: "text-neutral-grey-50 text-[10px] font-medium tracking-wide", children: page.language }))] }), _jsx(HomeListBadge, { className: cn(!page.workflowState || page.workflowState === "Draft"
                                ? "bg-neutral-grey-5 text-neutral-grey-100"
                                : page.isFinalState
                                    ? "bg-[var(--color-feedback-green-light)] text-[var(--color-feedback-green)]"
                                    : /approval/i.test(page.workflowState)
                                        ? "bg-feedback-orange-light text-feedback-orange"
                                        : "bg-highlight-10 text-highlight-100"), children: page.workflowState || "Draft" })] }))] }, `${page.id ?? "unknown"}-${page.language ?? "en"}-${page.version ?? "latest"}-${index}`))) }));
    if (bare)
        return body;
    return (_jsxs("div", { className: "w-full", children: [_jsx("div", { className: "mb-5 flex items-center justify-start", children: _jsx("h2", { className: "text-neutral-grey-50 text-xs font-medium tracking-widest", children: "Recent Items" }) }), _jsx("div", { className: "border-border-default/60 overflow-hidden rounded-xl border bg-white/80 shadow-sm backdrop-blur-2xl", children: body })] }));
}
//# sourceMappingURL=RecentPages.js.map