import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Popover, PopoverContent, PopoverTrigger, } from "../../components/ui/popover";
import { useEditContext } from "../client/editContext";
import { useState } from "react";
import { getSites } from "../services/contentService";
import { Loader2, Globe } from "lucide-react";
export function SiteInfo() {
    const editContext = useEditContext();
    const [isOpen, setIsOpen] = useState(false);
    const [sites, setSites] = useState();
    if (!editContext)
        return null;
    const pageViewContext = editContext.getActiveSlotContext()?.primaryPageViewContext;
    if (!pageViewContext)
        return null;
    const loadSites = async () => {
        const sites = await getSites();
        if (sites.data)
            setSites(sites.data);
    };
    return (_jsxs(Popover, { open: isOpen, onOpenChange: setIsOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("div", { className: "my-2 flex cursor-pointer items-center gap-2 text-gray-200", title: pageViewContext.site?.name, onClick: async () => {
                        setSites(undefined);
                        setIsOpen(true);
                        await loadSites();
                    }, children: _jsx(Globe, { className: "h-4 w-4" }) }) }), _jsx(PopoverContent, { className: "w-80", children: _jsx("div", { className: "flex max-h-[45vh] min-w-20 flex-col overflow-hidden text-xs", children: _jsxs("div", { className: "p-4", children: ["This page is part of the site:", " ", _jsx("span", { className: "font-bold", children: pageViewContext.site?.name }), !sites && _jsx(Loader2, { className: "h-5 w-5 animate-spin" }), sites && (_jsxs("div", { children: [_jsx("div", { className: "my-2 border-b", children: "Sites registered:" }), _jsx("ul", { children: sites.map((site) => (_jsx("li", { children: site.name }, site.name))) })] }))] }) }) })] }));
}
//# sourceMappingURL=SiteInfo.js.map