"use client";

/**
 * TASK-0133 — Retention tab: per-scope policy editor + dry-run / execute-now.
 *
 * Four scopes (the worker's daily job + the admin trigger both run the SAME
 * core):
 *   trash       — permanently delete trashed pages past N days
 *   comments    — purge comments past N days
 *   audit_logs  — HOLD (legal hold, NEVER purged) or purge past N days
 *   files       — delete files past N days
 *
 * `Run dry` logs what WOULD be purged (no deletes); `Run now` executes
 * (gated by `WORKER_RETENTION_EXECUTE` on the worker side — a dev without the
 * flag dry-runs even an "execute" request). Both enqueue the same maintenance
 * job and return `202 {runId}`; this tab polls `GET …/retention/runs/:runId`
 * for the report the worker writes to Redis.
 */
import { useEffect, useState } from "react";
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { Loader2 } from "lucide-react";
import { orgAdminApi, type RetentionScope, type RetentionScopeRow, type RetentionType } from "@/lib/org-admin";
import { isApiError } from "@/lib/api";
import { toast } from "@/stores/ui-store";
import { Section, Field, inputCls } from "@/components/settings/settings-shell";
import { ConfirmDialog } from "@/components/ui/confirm-dialog";

const SCOPES: { id: RetentionScope; label: string; description: string }[] = [
  { id: "trash", label: "Trash", description: "Permanently delete trashed pages." },
  { id: "comments", label: "Comments", description: "Purge comments." },
  { id: "audit_logs", label: "Audit log", description: "Purge audit rows (HOLD = legal hold, never purged)." },
  { id: "files", label: "Files", description: "Delete uploaded files." },
];

function formatBytes(n: number): string {
  if (n < 1024) return `${n} B`;
  const units = ["KB", "MB", "GB", "TB"];
  let v = n / 1024;
  let i = 0;
  while (v >= 1024 && i < units.length - 1) {
    v /= 1024;
    i += 1;
  }
  return `${v.toFixed(1)} ${units[i]}`;
}

interface RunReport {
  orgId?: string;
  scope?: string;
  mode?: "dry" | "execute";
  status?: string;
  cutoff?: string;
  counts?: { pages: number; blocks: number; comments: number; files: number; bytesFreed: number } | null;
  reason?: string;
  durationMs?: number;
}

export function AdminRetentionTab({ orgId }: { orgId: string }) {
  const qc = useQueryClient();
  const retention = useQuery({
    queryKey: ["orgs", orgId, "admin", "retention"],
    queryFn: () => orgAdminApi.retention(orgId),
    retry: false,
  });

  const [drafts, setDrafts] = useState<Partial<Record<RetentionScope, { type: RetentionType; retainDays: number }>>>({});
  const [run, setRun] = useState<{ runId: string; scope: RetentionScope; mode: "dry" | "execute" } | null>(null);
  const [confirm, setConfirm] = useState<RetentionScope | null>(null);

  const rows = retention.data?.data ?? [];
  const row = (s: RetentionScope) => rows.find((r) => r.scope === s) as RetentionScopeRow | undefined;
  const draft = (s: RetentionScope) => drafts[s] ?? { type: row(s)?.type ?? "PURGE", retainDays: row(s)?.retainDays ?? 0 };

  const patch = useMutation({
    mutationFn: (body: Partial<Record<RetentionScope, { type: RetentionType; retainDays: number }>>) =>
      orgAdminApi.retentionPatch(orgId, body),
    onSuccess: () => {
      toast("success", "Retention policy updated");
      setDrafts({});
      qc.invalidateQueries({ queryKey: ["orgs", orgId, "admin", "retention"] });
    },
    onError: (e) => toast("error", "Could not update retention", isApiError(e) ? e.message : undefined),
  });

  const runMut = useMutation({
    mutationFn: (v: { scope: RetentionScope; mode: "dry" | "execute" }) => orgAdminApi.retentionRun(orgId, v.scope, v.mode),
    onSuccess: (res, v) => {
      setConfirm(null);
      setRun({ runId: res.runId, scope: v.scope, mode: v.mode });
    },
    onError: (e) => toast("error", "Could not start retention run", isApiError(e) ? e.message : undefined),
  });

  // Poll the run report while a run is in flight (worker writes it on finish).
  const runStatus = useQuery({
    queryKey: ["orgs", orgId, "admin", "retention", "run", run?.runId],
    queryFn: () => orgAdminApi.retentionRunStatus(orgId, run!.runId),
    enabled: Boolean(run),
    refetchInterval: (q) => {
      const status = (q.state.data as RunReport | undefined)?.status;
      return status === "processing" || !status ? 1500 : false; // stop when terminal
    },
    refetchIntervalInBackground: false,
    retry: false,
  });
  const report = runStatus.data as RunReport | undefined;

  // Re-read the retention rows after a run (lastRun updates).
  useEffect(() => {
    if (report && report.status !== "processing") {
      qc.invalidateQueries({ queryKey: ["orgs", orgId, "admin", "retention"] });
    }
  }, [report, qc, orgId]);

  if (retention.isLoading) return <p className="text-sm text-muted-foreground" role="status">Loading retention…</p>;
  if (retention.isError) return <p className="text-sm text-destructive" role="alert">Could not load retention.</p>;

  return (
    <div className="space-y-6">
      <Section
        title="Policies"
        description="The worker runs these daily (dry by default; `WORKER_RETENTION_EXECUTE` enables the daily execute). Audit rows on HOLD are never purged."
      >
        <div className="grid gap-4 sm:grid-cols-2">
          {SCOPES.map((s) => {
            const r = row(s.id);
            const d = draft(s.id);
            return (
              <div key={s.id} className="rounded-lg border border-border p-3">
                <div className="text-sm font-medium">{s.label}</div>
                <div className="mb-3 text-xs text-muted-foreground">{s.description}</div>
                <div className="flex items-end gap-2">
                  <Field label="Action">
                    <select
                      value={d.type}
                      onChange={(e) => setDrafts((p) => ({ ...p, [s.id]: { ...d, type: e.target.value as RetentionType } }))}
                      className={inputCls}
                      aria-label={`${s.label} action`}
                    >
                      <option value="PURGE">Purge</option>
                      <option value="HOLD">Hold</option>
                    </select>
                  </Field>
                  <Field label="After (days)">
                    <input
                      type="number"
                      min={0}
                      max={3650}
                      value={d.retainDays}
                      disabled={d.type === "HOLD"}
                      onChange={(e) =>
                        setDrafts((p) => ({ ...p, [s.id]: { ...d, retainDays: Math.max(0, Number(e.target.value) || 0) } }))
                      }
                      className={`${inputCls} disabled:opacity-50`}
                      aria-label={`${s.label} retain days`}
                    />
                  </Field>
                  <button
                    type="button"
                    onClick={() => patch.mutate({ [s.id]: d } as never)}
                    disabled={patch.isPending || JSON.stringify(d) === JSON.stringify({ type: r?.type, retainDays: r?.retainDays })}
                    className="rounded-md border border-input px-3 py-1.5 text-sm font-medium hover:bg-muted disabled:opacity-50"
                  >
                    Save
                  </button>
                </div>
                {r && (
                  <div className="mt-2 text-[11px] text-muted-foreground">
                    Default {r.default.type.toLowerCase()} {r.default.retainDays}d
                    {r.lastRun ? ` · last run ${new Date(r.lastRun).toLocaleString()}` : ""}
                    {r.lastDryRun ? ` · last dry ${new Date(r.lastDryRun).toLocaleString()}` : ""}
                  </div>
                )}
              </div>
            );
          })}
        </div>
      </Section>

      <Section title="Run now" description="Dry-run logs only; execute purges (the worker flag gates daily execute).">
        <div className="flex flex-wrap items-center gap-2">
          {SCOPES.map((s) => (
            <div key={s.id} data-testid={`retention-run-${s.id}`} className="flex items-center gap-1 rounded-md border border-border p-1">
              <span className="px-1.5 text-xs font-medium text-muted-foreground">{s.label}</span>
              <button
                type="button"
                onClick={() => runMut.mutate({ scope: s.id, mode: "dry" })}
                disabled={runMut.isPending}
                className="rounded px-2 py-1 text-xs font-medium hover:bg-muted disabled:opacity-50"
              >
                Dry
              </button>
              <button
                type="button"
                onClick={() => setConfirm(s.id)}
                disabled={runMut.isPending}
                className="rounded px-2 py-1 text-xs font-medium text-destructive hover:bg-muted disabled:opacity-50"
              >
                Execute
              </button>
            </div>
          ))}
        </div>

        {run && (
          <div data-testid="org-admin-retention-report" className="mt-4 rounded-md border border-border p-3 text-sm" aria-live="polite">
            {runStatus.isFetching && !report?.status ? (
              <span className="inline-flex items-center gap-2 text-muted-foreground">
                <Loader2 className="size-4 animate-spin" /> Running {run.scope} ({run.mode})…
              </span>
            ) : report ? (
              <ReportView report={report} onDone={() => setRun(null)} />
            ) : null}
          </div>
        )}
      </Section>

      <ConfirmDialog
        open={confirm !== null}
        title={`Execute retention on ${confirm ?? ""}?`}
        description="This PURGES data that exceeds the policy (irreversible). Audit rows on HOLD are never touched. Consider a dry-run first."
        confirmLabel="Execute"
        destructive
        busy={runMut.isPending}
        onConfirm={() => confirm && runMut.mutate({ scope: confirm, mode: "execute" })}
        onClose={() => setConfirm(null)}
      />
    </div>
  );
}

function ReportView({ report, onDone }: { report: RunReport; onDone: () => void }) {
  const c = report.counts;
  return (
    <div className="flex flex-wrap items-center gap-x-4 gap-y-1">
      <span
        className={
          "rounded px-1.5 py-0.5 text-xs font-medium " +
          (report.status === "dry_run" || report.status === "purged"
            ? "bg-primary/10 text-primary"
            : "bg-muted text-muted-foreground")
        }
      >
        {report.status === "dry_run" ? "Dry-run complete" : report.status === "purged" ? "Executed" : report.status}
      </span>
      {report.reason && <span className="text-xs text-muted-foreground">reason: {report.reason}</span>}
      {c && (
        <span className="text-xs">
          {c.pages} page{c.pages === 1 ? "" : "s"} · {c.blocks} blocks · {c.comments} comments · {c.files} files ·{" "}
          {formatBytes(c.bytesFreed)} freed
        </span>
      )}
      {c === null && <span className="text-xs text-muted-foreground">nothing to {report.mode === "dry" ? "purge" : "purge"} (held or empty)</span>}
      {report.durationMs !== undefined && <span className="text-[11px] text-muted-foreground">{report.durationMs} ms</span>}
      <button type="button" onClick={onDone} className="ml-auto text-xs text-muted-foreground hover:text-foreground hover:underline">
        Dismiss
      </button>
    </div>
  );
}