import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect, useState } from "react";
import { AlertTriangle, Network, RadioTower, Rss } from "lucide-react";
import { SettingsCard as Card } from "../SettingsCard";
import { SettingsPanelLayout } from "../SettingsPanelLayout";
import { Switch } from "../../../components/ui/switch";
import { useEditContext } from "../../client/editContext";
import { getEditorSettings, updateSystemSettings, } from "../../services/systemService";
function SettingToggle({ checked, description, disabled, icon, label, testId, onCheckedChange, }) {
    return (_jsxs("div", { className: "border-border-default flex items-center justify-between gap-4 border-b py-4 last:border-b-0", children: [_jsxs("div", { className: "flex min-w-0 items-start gap-3", children: [_jsx("div", { className: "border-border-default bg-neutral-grey-5 text-neutral-grey-50 mt-0.5 flex h-8 w-8 shrink-0 items-center justify-center rounded border", children: icon }), _jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-neutral-grey-100 text-sm font-medium", children: label }), _jsx("div", { className: "text-neutral-grey-50 mt-1 text-xs leading-5", children: description })] })] }), _jsx(Switch, { checked: checked, disabled: disabled, onCheckedChange: onCheckedChange, "aria-label": label, "data-testid": testId })] }));
}
export function SystemSettingsPanel() {
    const editContext = useEditContext();
    const isAdmin = editContext?.userInfo?.user?.isAdministrator ?? false;
    const [loaded, setLoaded] = useState(false);
    const [saving, setSaving] = useState(false);
    const [error, setError] = useState(null);
    const [wsEnabled, setWsEnabled] = useState(true);
    const [sseEnabled, setSseEnabled] = useState(true);
    // Always read the canonical values from the server on mount so the panel is
    // correct even if the cached global settings are stale.
    useEffect(() => {
        let cancelled = false;
        getEditorSettings().then((result) => {
            if (cancelled)
                return;
            if (result.type === "success" && result.data) {
                setWsEnabled(result.data.enableWebSocketTransport ?? true);
                setSseEnabled(result.data.enableSseFallback ?? true);
            }
            else {
                setError(result.summary || result.details || "Failed to load system settings");
            }
            setLoaded(true);
        });
        return () => {
            cancelled = true;
        };
    }, []);
    const persist = async (update, revert) => {
        setSaving(true);
        setError(null);
        const result = await updateSystemSettings(update);
        setSaving(false);
        if (result.type === "success" && result.data) {
            setWsEnabled(result.data.enableWebSocketTransport ?? true);
            setSseEnabled(result.data.enableSseFallback ?? true);
        }
        else {
            revert();
            setError(result.summary || result.details || "Failed to save system settings");
        }
    };
    const handleWsChange = (value) => {
        const previous = wsEnabled;
        setWsEnabled(value);
        void persist({ enableWebSocketTransport: value }, () => setWsEnabled(previous));
    };
    const handleSseChange = (value) => {
        const previous = sseEnabled;
        setSseEnabled(value);
        void persist({ enableSseFallback: value }, () => setSseEnabled(previous));
    };
    const togglesDisabled = !isAdmin || saving || !loaded;
    const noTransport = !wsEnabled && !sseEnabled;
    return (_jsx(SettingsPanelLayout, { testId: "system-settings-panel", contentClassName: "flex flex-col gap-4", children: _jsxs(Card, { icon: _jsx(Network, { strokeWidth: 1, className: "h-5 w-5" }), title: "Realtime Transport", description: "Choose how the editor delivers live updates (collaboration, agent streams, notifications). Changes apply to new or reloaded editor sessions.", children: [!isAdmin && (_jsx("div", { className: "text-neutral-grey-50 mb-2 text-xs", children: "Administrator access is required to change these settings." })), !loaded ? (_jsx("div", { className: "text-neutral-grey-50 py-4 text-xs", children: "Loading transport settings\u2026" })) : (_jsxs("div", { className: "divide-y-0", children: [_jsx(SettingToggle, { checked: wsEnabled, disabled: togglesDisabled, description: "Use WebSockets for realtime editor updates (the preferred transport). Requires the IIS WebSocket Protocol feature and a proxy that forwards the Upgrade header.", icon: _jsx(RadioTower, { strokeWidth: 1, className: "h-4 w-4" }), label: "Enable WebSocket transport", testId: "system-settings-enable-websocket", onCheckedChange: handleWsChange }), _jsx(SettingToggle, { checked: sseEnabled, disabled: togglesDisabled, description: "Fall back to Server-Sent Events when a WebSocket cannot be established (e.g. IIS without the WebSocket feature, or a proxy that strips the Upgrade header).", icon: _jsx(Rss, { strokeWidth: 1, className: "h-4 w-4" }), label: "Enable SSE fallback transport", testId: "system-settings-enable-sse", onCheckedChange: handleSseChange })] })), loaded && noTransport && (_jsxs("div", { className: "text-feedback-orange mt-3 flex items-start gap-2 text-xs", children: [_jsx(AlertTriangle, { strokeWidth: 1, className: "mt-0.5 h-4 w-4 shrink-0" }), _jsx("span", { children: "Both realtime transports are disabled. The editor will not receive live updates (collaboration, agent streaming, notifications) until one is re-enabled." })] })), error && (_jsx("div", { className: "text-feedback-red mt-3 text-xs", role: "alert", children: error }))] }) }));
}
export default SystemSettingsPanel;
//# sourceMappingURL=SystemSettingsPanel.js.map