import type { PiWebPlugin, WorkspacePanelContext } from "@jmfederico/pi-web/plugin-api";
import type { Job, JobDetail, JobView, Overview, Run, RunSummary } from "./protocol.js";

type Tab = "jobs" | "history";
interface Editor { mode: "create" | "update"; text: string; error?: string }
interface Rescheduler { id: string; kind: "cron" | "at" | "every"; value: string; tz: string; preview: string[]; error?: string }

interface PanelState {
  tab: Tab;
  scopeAll: boolean;
  overview?: Overview;
  detail?: JobDetail;
  run?: Run;
  editor?: Editor;
  resched?: Rescheduler;
  busy: boolean;
  status: string;
  error?: string;
  channel?: { close(reason?: string): void };
  loaded: boolean;
  refreshTimer?: ReturnType<typeof setTimeout>;
}

const STATUS_COLORS: Record<string, string> = {
  succeeded: "#2e7d32", failed: "#c62828", running: "#1565c0", unmet: "#ef6c00",
  skipped: "#757575", cancelled: "#6d4c41", interrupted: "#8e24aa",
};

const TEMPLATE = {
  name: "Esempio - controllo VM",
  description: "Verifica CPU VM alle 23:30 e analizza solo se in sofferenza",
  schedule: { cron: "30 23 * * *", tz: "Europe/Rome" },
  misfire: "skip",
  timeout: "20m",
  steps: [
    { id: "metrics", type: "command", argv: ["az", "monitor", "metrics", "list", "--resource", "<VM_RESOURCE_ID>", "--metric", "Percentage CPU", "--interval", "PT5M", "--offset", "1h", "-o", "json"], parseJson: true },
    { id: "gate", type: "condition", any: [{ path: "steps.metrics.json.value[*].timeseries[*].data[*].average", aggregate: "max", op: ">", value: 85 }] },
    { id: "analyze", type: "agent", when: "gate", prompt: "La VM è in sofferenza. Dati: {{steps.metrics.stdout}}. Analizza cause e proponi azioni.", tools: ["read", "bash"] },
    { id: "alert", type: "notify", when: "gate", severity: "warning", message: "VM in sofferenza: {{steps.analyze.text}}" },
  ],
};

function fmt(iso?: string | null): string {
  if (!iso) return "—";
  const d = new Date(iso);
  return Number.isNaN(d.getTime()) ? iso : d.toLocaleString("it-IT", { dateStyle: "short", timeStyle: "medium" });
}
function duration(a: string, b?: string): string {
  if (!b) return "…";
  const ms = Date.parse(b) - Date.parse(a);
  return ms < 1000 ? `${ms}ms` : ms < 60_000 ? `${(ms / 1000).toFixed(1)}s` : `${Math.round(ms / 60_000)}m`;
}
function errorText(e: unknown): string { return e instanceof Error ? e.message : String(e); }

const plugin: PiWebPlugin = {
  apiVersion: 4,
  name: "Scheduler",
  activate({ html, svg, runtimePluginId }) {
    const states = new Map<string, PanelState>();
    let disposed = false;

    const key = (c: WorkspacePanelContext) => JSON.stringify([c.machine.id, c.workspace.projectId, c.workspace.id]);
    const stateFor = (c: WorkspacePanelContext): PanelState => {
      let s = states.get(key(c));
      if (!s) { s = { tab: "jobs", scopeAll: false, busy: false, status: "", loaded: false }; states.set(key(c), s); }
      return s;
    };
    const render = (c: WorkspacePanelContext) => { if (!disposed) c.host.requestRender(); };

    async function call<T>(c: WorkspacePanelContext, op: string, input: unknown): Promise<T> {
      if (!c.peer?.request) throw new Error("Backend Scheduler non disponibile su questa macchina (plugin server attivo? restart del session daemon?)");
      return (await c.peer.request(op, (input ?? null) as never)) as T;
    }

    async function refresh(c: WorkspacePanelContext, quiet = false): Promise<void> {
      const s = stateFor(c);
      if (!quiet) { s.busy = true; render(c); }
      try {
        s.overview = await call<Overview>(c, "overview", { scope: s.scopeAll ? "all" : "workspace" });
        if (s.detail) {
          const d = await call<JobDetail>(c, "job.get", { id: s.detail.view.job.id }).catch(() => undefined);
          if (d) s.detail = d; else delete s.detail;
        }
        delete s.error;
        s.loaded = true;
      } catch (e) { s.error = errorText(e); }
      finally { s.busy = false; render(c); }
      ensureChannel(c);
    }

    function scheduleRefresh(c: WorkspacePanelContext): void {
      const s = stateFor(c);
      if (s.refreshTimer) return;
      s.refreshTimer = setTimeout(() => { delete s.refreshTimer; void refresh(c, true); }, 400);
    }

    function ensureChannel(c: WorkspacePanelContext): void {
      const s = stateFor(c);
      if (s.channel || !c.peer?.openChannel) return;
      const placeholder = { close() { /* opening */ } };
      s.channel = placeholder;
      c.peer.openChannel("events", null, { onData: () => scheduleRefresh(c) }).then((ch) => {
        if (disposed) { ch.close(); return; }
        s.channel = ch;
        void ch.closed.then(() => { if (s.channel === ch) delete s.channel; });
      }, () => { if (s.channel === placeholder) delete s.channel; });
    }

    async function act(c: WorkspacePanelContext, label: string, fn: () => Promise<unknown>): Promise<void> {
      const s = stateFor(c);
      s.busy = true; s.status = `${label}…`; render(c);
      try { await fn(); s.status = `${label}: ok`; delete s.error; }
      catch (e) { s.error = `${label}: ${errorText(e)}`; s.status = ""; }
      finally { s.busy = false; }
      await refresh(c, true);
    }

    async function openDetail(c: WorkspacePanelContext, id: string): Promise<void> {
      const s = stateFor(c);
      delete s.run;
      await act(c, "Dettaglio", async () => { s.detail = await call<JobDetail>(c, "job.get", { id }); });
    }

    async function openRun(c: WorkspacePanelContext, r: RunSummary): Promise<void> {
      const s = stateFor(c);
      await act(c, "Run", async () => { s.run = await call<Run>(c, "run.get", { jobId: r.jobId, runId: r.id }); });
    }

    function startEdit(c: WorkspacePanelContext, job?: Job): void {
      const s = stateFor(c);
      if (job) {
        const { state: _state, version: _v, createdAt: _c, updatedAt: _u, createdBy: _b, ...rest } = job;
        const schedule = job.schedule.kind === "cron" ? { cron: job.schedule.expr, tz: job.schedule.tz }
          : job.schedule.kind === "at" ? { at: job.schedule.at } : { every: job.schedule.everyMs, anchor: job.schedule.anchor };
        s.editor = { mode: "update", text: JSON.stringify({ ...rest, schedule }, null, 2) };
      } else {
        s.editor = { mode: "create", text: JSON.stringify(TEMPLATE, null, 2) };
      }
      render(c);
    }

    async function saveEdit(c: WorkspacePanelContext): Promise<void> {
      const s = stateFor(c);
      const ed = s.editor;
      if (!ed) return;
      let job: unknown;
      try { job = JSON.parse(ed.text); } catch (e) { ed.error = `JSON non valido: ${errorText(e)}`; render(c); return; }
      try {
        const saved = await call<Job>(c, "job.upsert", { mode: ed.mode, job });
        delete s.editor;
        s.status = `Job '${saved.id}' salvato`;
        await openDetail(c, saved.id);
      } catch (e) { ed.error = errorText(e); render(c); }
    }

    function startResched(c: WorkspacePanelContext, job: Job): void {
      const s = stateFor(c);
      const sch = job.schedule;
      s.resched = {
        id: job.id,
        kind: sch.kind,
        value: sch.kind === "cron" ? sch.expr : sch.kind === "at" ? sch.at : `${Math.round(sch.everyMs / 60_000)}m`,
        tz: sch.kind === "cron" ? (sch.tz ?? "Europe/Rome") : "Europe/Rome",
        preview: [],
      };
      void previewResched(c);
    }

    function reschedInput(r: Rescheduler): unknown {
      return r.kind === "cron" ? { cron: r.value, tz: r.tz } : r.kind === "at" ? { at: r.value } : { every: r.value };
    }

    async function previewResched(c: WorkspacePanelContext): Promise<void> {
      const r = stateFor(c).resched;
      if (!r) return;
      try { r.preview = await call<string[]>(c, "schedule.preview", { schedule: reschedInput(r) }); delete r.error; }
      catch (e) { r.preview = []; r.error = errorText(e); }
      render(c);
    }

    // ---------------------------------------------------------------- views

    const badge = (status?: string) => status
      ? html`<span style="display:inline-block;padding:1px 6px;border-radius:8px;font-size:11px;color:#fff;background:${STATUS_COLORS[status] ?? "#555"}">${status}</span>`
      : html`<span style="opacity:.6">—</span>`;

    const btn = (label: string, onClick: () => void, opts: { disabled?: boolean; title?: string; danger?: boolean } = {}) =>
      html`<button title=${opts.title ?? label} ?disabled=${opts.disabled === true} style=${opts.danger ? "color:#c62828" : ""} @click=${onClick}>${label}</button>`;

    function jobRow(c: WorkspacePanelContext, s: PanelState, v: JobView) {
      const j = v.job;
      const running = v.running.length > 0;
      return html`<tr style=${s.detail?.view.job.id === j.id ? "background:rgba(127,127,127,.15)" : ""}>
        <td><a href="#" @click=${(e: Event) => { e.preventDefault(); void openDetail(c, j.id); }}><b>${j.name}</b></a><br><small style="opacity:.7">${j.id}${j.tags?.length ? ` · ${j.tags.join(", ")}` : ""}</small></td>
        <td><small>${v.scheduleText}</small></td>
        <td><small>${j.enabled ? fmt(j.state.retry?.at ?? j.state.nextRunAt) : "in pausa"}${j.state.retry ? html`<br><i>retry #${j.state.retry.attempt}</i>` : ""}</small></td>
        <td>${running ? badge("running") : badge(j.state.lastStatus)}<br><small style="opacity:.7">${fmt(j.state.lastRunAt)}</small></td>
        <td style="white-space:nowrap">
          ${btn("▶", () => void act(c, "Esegui ora", () => call(c, "job.runNow", { id: j.id })), { disabled: s.busy || running, title: "Esegui ora" })}
          ${btn(j.enabled ? "⏸" : "⏵", () => void act(c, j.enabled ? "Pausa" : "Riprendi", () => call(c, "job.setEnabled", { id: j.id, enabled: !j.enabled })), { disabled: s.busy, title: j.enabled ? "Metti in pausa" : "Riprendi" })}
          ${btn("🕑", () => startResched(c, j), { disabled: s.busy, title: "Riprogramma" })}
          ${btn("✎", () => startEdit(c, j), { disabled: s.busy, title: "Modifica" })}
        </td>
      </tr>
      ${j.state.pendingMisfire ? html`<tr><td colspan="5" style="background:rgba(239,108,0,.15)">
        ⚠ Run mancato del ${fmt(j.state.pendingMisfire.dueAt)} (misfire=ask).
        ${btn("Esegui ora", () => void act(c, "Misfire", () => call(c, "job.misfire", { id: j.id, decision: "run" })))}
        ${btn("Salta", () => void act(c, "Misfire", () => call(c, "job.misfire", { id: j.id, decision: "skip" })))}
      </td></tr>` : ""}`;
    }

    function runsTable(c: WorkspacePanelContext, s: PanelState, runs: RunSummary[], showJob: boolean) {
      if (runs.length === 0) return html`<p style="opacity:.7">Nessuna esecuzione.</p>`;
      return html`<table style="width:100%;border-collapse:collapse;font-size:12px">
        <thead><tr style="text-align:left">${showJob ? html`<th>Job</th>` : ""}<th>Avvio</th><th>Esito</th><th>Trigger</th><th>Durata</th><th></th></tr></thead>
        <tbody>${runs.map((r) => html`<tr style=${s.run?.id === r.id ? "background:rgba(127,127,127,.15)" : ""}>
          ${showJob ? html`<td>${r.jobId}</td>` : ""}
          <td>${fmt(r.startedAt)}</td>
          <td>${badge(r.status)}${r.error ? html`<br><small title=${r.error} style="opacity:.8">${r.error.slice(0, 80)}</small>` : ""}</td>
          <td>${r.trigger}${r.attempt > 1 ? ` #${r.attempt}` : ""}</td>
          <td>${duration(r.startedAt, r.endedAt)}</td>
          <td style="white-space:nowrap">${btn("Dettagli", () => void openRun(c, r))}
            ${r.status === "running" ? btn("Annulla", () => void act(c, "Annulla run", () => call(c, "run.cancel", { runId: r.id })), { danger: true }) : ""}</td>
        </tr>`)}</tbody></table>`;
    }

    function runView(c: WorkspacePanelContext, s: PanelState, run: Run) {
      const job = s.overview?.jobs.find((v) => v.job.id === run.jobId)?.job ?? s.detail?.view.job;
      const sameWorkspace = job?.cwd === c.workspace.path;
      return html`<section style="border:1px solid rgba(127,127,127,.4);border-radius:6px;padding:8px;margin-top:8px">
        <div style="display:flex;justify-content:space-between;align-items:center">
          <b>Run ${run.id}</b> ${badge(run.status)} ${btn("✕", () => { delete s.run; render(c); }, { title: "Chiudi" })}
        </div>
        <small>job ${run.jobId} · ${run.trigger} · tentativo ${run.attempt} · previsto ${fmt(run.scheduledFor)} · host ${run.host}</small>
        ${run.error ? html`<p style="color:#c62828">${run.error}</p>` : ""}
        ${run.steps.map((st) => html`<details ?open=${st.status === "failed" || st.type === "agent"} style="margin-top:6px">
          <summary>${st.id} <small>(${st.type})</small> ${badge(st.status)} <small>${duration(st.startedAt, st.endedAt)}</small>
            ${st.value !== undefined ? html` → <b>${String(st.value)}</b>` : ""}
            ${st.exitCode !== undefined ? html` <small>exit ${String(st.exitCode)}</small>` : ""}
            ${st.httpStatus !== undefined ? html` <small>HTTP ${st.httpStatus}</small>` : ""}</summary>
          ${st.sessionId ? html`<p>Sessione: <code>${st.sessionId}</code>
            ${sameWorkspace ? btn("Apri sessione", () => void c.navigate({ machineId: c.machine.id, projectId: c.workspace.projectId, workspaceId: c.workspace.id, sessionId: st.sessionId as string, view: "chat" })) : ""}</p>` : ""}
          ${st.error ? html`<pre style="white-space:pre-wrap;color:#c62828">${st.error}</pre>` : ""}
          ${st.text ? html`<pre style="white-space:pre-wrap;max-height:320px;overflow:auto">${st.text}</pre>` : ""}
          ${st.stdout ? html`<div><small>stdout</small><pre style="white-space:pre-wrap;max-height:240px;overflow:auto">${st.stdout}</pre></div>` : ""}
          ${st.stderr ? html`<div><small>stderr</small><pre style="white-space:pre-wrap;max-height:160px;overflow:auto">${st.stderr}</pre></div>` : ""}
        </details>`)}
      </section>`;
    }

    function detailView(c: WorkspacePanelContext, s: PanelState, d: JobDetail) {
      const j = d.view.job;
      return html`<section style="border:1px solid rgba(127,127,127,.4);border-radius:6px;padding:8px;margin-top:8px">
        <div style="display:flex;justify-content:space-between;align-items:center">
          <b>${j.name}</b>
          <span>${btn("Duplica", () => { startEdit(c, { ...j, id: `${j.id}-copy`, name: `${j.name} (copia)` }); const ed = stateFor(c).editor; if (ed) ed.mode = "create"; })}
            ${btn("Elimina", () => { if (confirm(`Eliminare il job '${j.id}'? Lo storico run resta su disco.`)) void act(c, "Elimina", async () => { await call(c, "job.delete", { id: j.id }); delete s.detail; delete s.run; }); }, { danger: true })}
            ${btn("✕", () => { delete s.detail; delete s.run; render(c); }, { title: "Chiudi" })}</span>
        </div>
        ${j.description ? html`<p>${j.description}</p>` : ""}
        <small>cwd <code>${j.cwd}</code> · misfire ${j.misfire} · ${j.retry ? `retry ${j.retry.maxAttempts}x` : "no retry"} · ${d.view.bound ? "workspace PI WEB associato" : "headless (workspace non associato)"}</small>
        <p><b>Prossime esecuzioni:</b> ${d.preview.length ? d.preview.map((p) => fmt(p)).join(" · ") : "nessuna"}</p>
        <p><b>Pipeline:</b> ${j.steps.map((st, i) => html`${i ? " → " : ""}<code>${st.id}:${st.type}${st.when ? `?${st.when}` : ""}</code>`)}</p>
        <h4 style="margin:8px 0 4px">Storico</h4>
        ${runsTable(c, s, d.runs, false)}
      </section>`;
    }

    function reschedView(c: WorkspacePanelContext, s: PanelState, r: Rescheduler) {
      return html`<section style="border:1px solid rgba(21,101,192,.6);border-radius:6px;padding:8px;margin-top:8px">
        <b>Riprogramma ${r.id}</b>
        <div style="display:flex;gap:6px;flex-wrap:wrap;margin-top:6px;align-items:center">
          <select @change=${(e: Event) => { r.kind = (e.target as HTMLSelectElement).value as Rescheduler["kind"]; void previewResched(c); }}>
            ${(["cron", "at", "every"] as const).map((k) => html`<option value=${k} ?selected=${r.kind === k}>${k}</option>`)}
          </select>
          <input style="flex:1;min-width:180px" .value=${r.value} placeholder=${r.kind === "cron" ? "30 23 * * *" : r.kind === "at" ? "2026-10-08T09:00:00+02:00" : "2h"}
            @change=${(e: Event) => { r.value = (e.target as HTMLInputElement).value; void previewResched(c); }}>
          ${r.kind === "cron" ? html`<input style="width:140px" .value=${r.tz} @change=${(e: Event) => { r.tz = (e.target as HTMLInputElement).value; void previewResched(c); }}>` : ""}
          ${btn("Salva", () => void act(c, "Riprogramma", async () => { await call(c, "job.reschedule", { id: r.id, schedule: reschedInput(r) }); delete s.resched; }), { disabled: !!r.error || s.busy })}
          ${btn("Annulla", () => { delete s.resched; render(c); })}
        </div>
        ${r.error ? html`<p style="color:#c62828">${r.error}</p>` : html`<small>Prossime: ${r.preview.map((p) => fmt(p)).join(" · ") || "nessuna"}</small>`}
      </section>`;
    }

    function editorView(c: WorkspacePanelContext, s: PanelState, ed: Editor) {
      return html`<section style="border:1px solid rgba(21,101,192,.6);border-radius:6px;padding:8px;margin-top:8px">
        <b>${ed.mode === "create" ? "Nuovo job" : "Modifica job"}</b> <small>(cwd di default: <code>${c.workspace.path}</code>)</small>
        <textarea style="width:100%;min-height:320px;font-family:monospace;font-size:12px;margin-top:6px" .value=${ed.text}
          @input=${(e: Event) => { ed.text = (e.target as HTMLTextAreaElement).value; }}></textarea>
        ${ed.error ? html`<pre style="white-space:pre-wrap;color:#c62828">${ed.error}</pre>` : ""}
        ${btn("Salva", () => void saveEdit(c), { disabled: s.busy })} ${btn("Annulla", () => { delete s.editor; render(c); })}
      </section>`;
    }

    return {
      contributions: {
        actions: [{
          id: "scheduler.open",
          title: "Open Scheduler",
          description: "Apri la console dei job pianificati",
          group: "Workspace",
          enabled: (context) => context.state.selectedWorkspace !== undefined,
          run: (context) => { context.selectWorkspaceTool(`${runtimePluginId}:scheduler`); },
        }],
        workspacePanels: [{
          id: "scheduler",
          title: "Scheduler",
          order: 45,
          icon: svg`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="13" r="8"></circle><path d="M12 9v4l2 2"></path><path d="M5 3 2 6"></path><path d="m22 6-3-3"></path></svg>`,
          badge: (c) => {
            const o = stateFor(c).overview;
            if (!o) return undefined;
            const attention = o.jobs.filter((v) => v.job.state.pendingMisfire || v.job.state.lastStatus === "failed").length;
            return attention || undefined;
          },
          onInvalidate: (c) => { void refresh(c, true); },
          render(c) {
            const s = stateFor(c);
            if (!s.loaded && !s.busy && !s.error) void refresh(c);
            const o = s.overview;
            return html`<div style="padding:8px;font-size:13px">
              <div style="display:flex;gap:6px;align-items:center;flex-wrap:wrap">
                ${btn("Job", () => { s.tab = "jobs"; render(c); }, { disabled: s.tab === "jobs" })}
                ${btn("Storico", () => { s.tab = "history"; render(c); }, { disabled: s.tab === "history" })}
                <label style="margin-left:8px"><input type="checkbox" .checked=${s.scopeAll} @change=${(e: Event) => { s.scopeAll = (e.target as HTMLInputElement).checked; void refresh(c); }}> tutti i workspace</label>
                <span style="flex:1"></span>
                ${btn("+ Nuovo", () => startEdit(c), { disabled: s.busy })}
                ${btn("⟳", () => void refresh(c), { disabled: s.busy, title: "Aggiorna" })}
              </div>
              ${s.error ? html`<p style="color:#c62828">${s.error}</p>` : ""}
              ${s.status ? html`<p role="status" style="opacity:.7;margin:4px 0">${s.status}</p>` : ""}
              ${s.editor ? editorView(c, s, s.editor) : ""}
              ${s.resched ? reschedView(c, s, s.resched) : ""}
              ${!o ? html`<p>${s.busy ? "Caricamento…" : ""}</p>` : s.tab === "jobs" ? html`
                ${o.jobs.length === 0 ? html`<p style="opacity:.7">Nessun job${s.scopeAll ? "" : " per questo workspace"}. Crea un job con "+ Nuovo" o chiedi all'agente (tool scheduler_create_job).</p>` : html`
                <table style="width:100%;border-collapse:collapse;margin-top:8px">
                  <thead><tr style="text-align:left"><th>Job</th><th>Schedule</th><th>Prossima</th><th>Ultimo</th><th></th></tr></thead>
                  <tbody>${o.jobs.map((v) => jobRow(c, s, v))}</tbody>
                </table>`}
                ${s.detail ? detailView(c, s, s.detail) : ""}`
              : html`<div style="margin-top:8px">${runsTable(c, s, o.recentRuns, true)}</div>`}
              ${s.run ? runView(c, s, s.run) : ""}
              ${o ? html`<p style="opacity:.5;font-size:11px;margin-top:12px">host ${o.host} · store ${o.storeRoot} · aggiornato ${fmt(o.now)}</p>` : ""}
            </div>`;
          },
        }],
      },
      dispose() {
        disposed = true;
        for (const s of states.values()) { s.channel?.close("dispose"); if (s.refreshTimer) clearTimeout(s.refreshTimer); }
        states.clear();
      },
    };
  },
};

export default plugin;