import { Code2, FileCog, Save, X } from "lucide-react";
import { useCallback, useEffect, useMemo, useState } from "react";

import { platformApiClient } from "../api/client";
import type { DeclaredFileReadSnapshotResponse, PluginConfigFieldResponse, PluginLogicalFileResponse, ServerFileWorkspaceResponse, ServerInstanceResponse } from "../api/types";
import type { OperationTracker } from "../stores/operations";
import { iniValue, updateIniValues } from "../utils/iniConfig";
import { ErrorState, LoadingState, ResultBadge } from "./StateViews";

interface ServerConfigEditorProps {
  instance: ServerInstanceResponse;
  operations: OperationTracker;
  requester: string;
  onClose: () => void;
}

type EditorMode = "friendly" | "source";

export function ServerConfigEditor({ instance, operations, requester, onClose }: ServerConfigEditorProps) {
  const [workspace, setWorkspace] = useState<ServerFileWorkspaceResponse | null>(null);
  const [selectedKey, setSelectedKey] = useState("");
  const [mode, setMode] = useState<EditorMode>("friendly");
  const [snapshot, setSnapshot] = useState<DeclaredFileReadSnapshotResponse | null>(null);
  const [raw, setRaw] = useState("");
  const [values, setValues] = useState<Record<string, string>>({});
  const [loading, setLoading] = useState(true);
  const [saving, setSaving] = useState(false);
  const [message, setMessage] = useState("");
  const [error, setError] = useState("");

  const configFiles = useMemo(() => (workspace?.files ?? []).filter((file) => file.kind === "config" && file.editable !== false), [workspace]);
  const selectedFile = configFiles.find((file) => file.key === selectedKey) ?? configFiles[0];
  const fields = useMemo(() => (workspace?.configFields ?? []).filter((field) => field.fileKey === selectedFile?.key), [selectedFile?.key, workspace?.configFields]);

  const readSelectedFile = useCallback(async (file: PluginLogicalFileResponse) => {
    setLoading(true);
    setError("");
    setMessage("正在通过 Run 读取配置文件…");
    try {
      let next = await platformApiClient.getServerFileReadSnapshot(instance.id, file.key);
      if (next.state !== "ready") {
        const operationId = operations.begin({ intent: "读取服务器配置", targetKind: "config", targetId: instance.id, requester });
        const dispatch = await platformApiClient.readServerFile(instance.id, { key: file.key, idempotencyKey: configOperationKey("read", instance.id, file.key) });
        operations.succeed(operationId, `配置读取任务 ${dispatch.job.id} 已派发`, dispatch.job);
        for (let attempt = 0; attempt < 60 && next.state !== "ready"; attempt += 1) {
          await new Promise((resolve) => window.setTimeout(resolve, 500));
          next = await platformApiClient.getServerFileReadSnapshot(instance.id, file.key);
        }
      }
      if (next.state !== "ready" || next.content === undefined) throw new Error(next.reason ?? "Run 尚未返回配置文件内容。");
      setSnapshot(next);
      setRaw(next.content);
      setValues(Object.fromEntries(fields.map((field) => [field.key, iniValue(next.content ?? "", field.configKey)])));
      setMessage(`已读取 ${file.label}${next.readAt ? ` · ${formatReadTime(next.readAt)}` : ""}`);
    } catch (readError) {
      setSnapshot(null);
      setRaw("");
      setError(readError instanceof Error ? readError.message : "配置文件读取失败");
      setMessage("");
    } finally {
      setLoading(false);
    }
  }, [fields, instance.id, operations, requester]);

  useEffect(() => {
    if (!workspace) {
      void platformApiClient.getServerFileWorkspace(instance.id).then((next) => {
        setWorkspace(next);
        setSelectedKey(next.files.find((file) => file.kind === "config" && file.editable !== false)?.key ?? "");
      }).catch((loadError) => setError(loadError instanceof Error ? loadError.message : "配置工作区加载失败")).finally(() => setLoading(false));
    }
  }, [instance.id, workspace]);

  useEffect(() => {
    if (selectedFile) void readSelectedFile(selectedFile);
  }, [readSelectedFile, selectedFile?.key]);

  async function save() {
    if (!selectedFile || !snapshot || saving) return;
    const content = mode === "source" ? raw : updateIniValues(raw, Object.fromEntries(fields.map((field) => [field.configKey, values[field.key] ?? ""])));
    const operationId = operations.begin({ intent: "保存服务器配置", targetKind: "config", targetId: instance.id, requester });
    setSaving(true);
    setError("");
    setMessage("正在向 Run 派发配置写入任务…");
    try {
      const dispatch = await platformApiClient.writeServerFile(instance.id, { key: selectedFile.key, content, expectedVersion: snapshot.version, expectedChecksum: snapshot.checksum, idempotencyKey: configOperationKey("write", instance.id, selectedFile.key) });
      operations.succeed(operationId, `配置写入任务 ${dispatch.job.id} 已派发`, dispatch.job);
      setRaw(content);
      setSnapshot({ ...snapshot, content });
      setMessage(`已派发 ${selectedFile.label} 写入任务；重启影响：${fields.some((field) => field.restartImpact === "restart-required") ? "需要重启服务器" : "无需重启"}。`);
    } catch (saveError) {
      operations.fail(operationId, saveError instanceof Error ? saveError.message : "配置写入失败", operationId);
      setError(saveError instanceof Error ? saveError.message : "配置写入失败");
    } finally {
      setSaving(false);
    }
  }

  return (
    <div className="server-file-editor-overlay" role="dialog" aria-modal="true" aria-label="修改服务器配置">
      <section className="server-file-editor" aria-label="server configuration workbench">
        <div className="panel-header"><h2><FileCog size={16} style={{ verticalAlign: "-2px" }} /> 修改配置</h2><span className="page-status">{instance.name}</span><button type="button" className="icon-command" onClick={onClose}><X size={14} /><span>关闭</span></button></div>
        {loading && !workspace && <LoadingState label="正在加载配置文件声明…" compact />}
        {error && !workspace && <ErrorState title="配置工作区不可用" reason={error} diagnosticId={`server-config:${instance.id}`} compact />}
        {workspace && configFiles.length === 0 && <ErrorState title="插件没有声明可编辑配置" reason="请先在 SCUM 插件中声明配置文件。" diagnosticId={`server-config:${instance.id}`} compact />}
        {workspace && configFiles.length > 0 && (
          <div className="file-workbench">
            <nav className="file-workbench-nav" aria-label="配置文件">
              <div className="file-workbench-directory-heading"><strong>配置文件</strong><span>由插件声明</span></div>
              {configFiles.map((file) => <button key={file.key} type="button" className="file-workbench-file" aria-current={file.key === selectedFile?.key ? "page" : undefined} onClick={() => { setSelectedKey(file.key); setMode("friendly"); }}>{<strong>{file.label}</strong>}<span>{file.key === "scum-server-settings" ? "可视化字段" : "源码"}</span></button>)}
            </nav>
            <div className="file-workbench-detail">
              <div className="panel-header"><div><h3>{selectedFile?.label}</h3><span className="page-status">配置内容由 Run 返回</span></div></div>
              <div className="file-workbench-mode"><span>{mode === "friendly" ? "人类可读模式：只修改插件声明的配置项" : "源码模式：编辑完整原始文件"}</span><button type="button" className={mode === "friendly" ? "file-workbench-mode-active" : undefined} onClick={() => setMode("friendly")}><FileCog size={13} /> 人类可读</button><button type="button" className={mode === "source" ? "file-workbench-mode-active" : undefined} onClick={() => setMode("source")}><Code2 size={13} /> 源码模式</button></div>
              {message && <ResultBadge status={error ? "failed" : "pending"} label={message} />}
              {error && workspace && <ErrorState title="配置操作失败" reason={error} diagnosticId={`server-config:${instance.id}:${selectedFile?.key ?? "unknown"}`} compact />}
              {loading && <LoadingState label="正在读取配置文件…" compact />}
              {!loading && mode === "friendly" && <div className="file-workbench-fields">{fields.length === 0 && <span className="provider-id">该配置文件没有声明可视化字段，请切换到源码模式。</span>}{fields.map((field) => <ConfigField key={field.key} field={field} value={values[field.key] ?? ""} onChange={(value) => setValues((current) => ({ ...current, [field.key]: value }))} />)}</div>}
              {!loading && mode === "source" && <div className="file-workbench-raw"><textarea className="file-workbench-raw-editor" value={raw} spellCheck={false} onChange={(event) => setRaw(event.target.value)} aria-label={`${selectedFile?.label ?? "配置文件"}源码`} /><small>保存会把完整原文交给 Run 写回服务器工作区。</small></div>}
              <div className="action-strip file-workbench-actions"><button type="button" className="primary-command" disabled={loading || saving || !snapshot} onClick={() => void save()}><Save size={14} /><span>{saving ? "保存中…" : "保存配置"}</span></button><button type="button" className="icon-command" onClick={onClose}>取消</button></div>
            </div>
          </div>
        )}
      </section>
    </div>
  );
}

function ConfigField({ field, value, onChange }: { field: PluginConfigFieldResponse; value: string; onChange: (value: string) => void }) {
  const inputType = field.control === "number" || field.control === "port" ? "number" : "text";
  return <label className="file-workbench-field"><span><strong>{field.label}</strong><small>{field.description}{field.restartImpact === "restart-required" ? " · 修改后需要重启" : ""}</small></span>{field.control === "boolean" ? <select value={value || field.defaultValue || "false"} onChange={(event) => onChange(event.target.value)}><option value="true">是</option><option value="false">否</option></select> : <input type={inputType} min={field.minimum} max={field.maximum} value={value} placeholder={field.defaultValue ?? ""} onChange={(event) => onChange(event.target.value)} />}</label>;
}

function configOperationKey(operation: string, serverId: string, fileKey: string): string { return `web:server-config:${operation}:${serverId}:${fileKey}`; }
function formatReadTime(value: string): string { const date = new Date(value); return Number.isNaN(date.getTime()) ? value : date.toLocaleString("zh-CN"); }