// Run history table — one row per fleet run, newest first (the API serves
// them in that order). summary.json carries rows for succeeded regions only;
// newer runs also stamp regionsTotal/regionsFailed (absent on legacy
// summaries, which fall back to the ok-only display).

import Link from "next/link";
import type { RunSummaryFile } from "@/lib/api-types";
import { money, utc8Stamp } from "@/lib/fmt";
import { runCostOf, runSavingsOf } from "@/lib/run-metrics";
import { DataTable, Td, Th } from "@/components/ui/DataTable";
import { Empty } from "@/components/ui/Empty";
import { RunStatusBadge, TriggerBadge } from "@/components/runs/RunBadges";

/** "ok/total" when the run stamped its totals; legacy partial runs only
 *  know their ok count (summary has succeeded regions only). */
function regionsCell(run: RunSummaryFile): string {
  const ok = run.regions.length;
  if (run.regionsTotal !== undefined) return `${ok}/${run.regionsTotal}`;
  if (run.status === "success") return `${ok}/${ok}`;
  if (run.status === "partial") return `${ok} ok`;
  return String(ok);
}

export function RunsTable({ runs }: { runs: RunSummaryFile[] }) {
  if (runs.length === 0) {
    return <Empty>No runs on record yet.</Empty>;
  }
  return (
    <DataTable>
      <thead>
        <tr>
          <Th>Run</Th>
          <Th>Trigger</Th>
          <Th>Status</Th>
          <Th>Started</Th>
          <Th>Finished</Th>
          <Th numeric>Regions</Th>
          <Th numeric>Fleet cost/mo</Th>
          <Th numeric>Savings/mo</Th>
        </tr>
      </thead>
      <tbody>
        {runs.map((run) => (
          <tr key={run.runId} className="hover:bg-surface-1">
            <Td>
              <Link
                href={`/runs/${run.runId}`}
                className="font-mono text-xs text-accent hover:underline"
              >
                {run.runId}
              </Link>
            </Td>
            <Td><TriggerBadge trigger={run.trigger} /></Td>
            <Td><RunStatusBadge status={run.status} /></Td>
            <Td><span className="text-text-secondary">{utc8Stamp(run.startedAt)}</span></Td>
            <Td><span className="text-text-secondary">{utc8Stamp(run.finishedAt)}</span></Td>
            <Td numeric>
              <span
                className="inline-flex items-center gap-1.5"
                title={
                  run.regionsTotal === undefined && run.status === "partial"
                    ? "rows for succeeded regions only"
                    : undefined
                }
              >
                {regionsCell(run)}
                {run.regionsTotal !== undefined &&
                run.regions.length < run.regionsTotal ? (
                  <span className="text-danger">
                    {run.regionsTotal - run.regions.length} failed
                  </span>
                ) : null}
              </span>
            </Td>
            <Td numeric>{money(runCostOf(run))}</Td>
            <Td numeric>{money(runSavingsOf(run))}</Td>
          </tr>
        ))}
      </tbody>
    </DataTable>
  );
}