// Fleet totals side by side: cost/savings/region count for both dates plus
// the B−A deltas. Cost is good-when-negative, savings good-when-positive.

import type { OverviewDiff } from "@/lib/api-types";
import { deltaTone, money, moneyDelta, num } from "@/lib/fmt";
import { DataTable, Td, Th } from "@/components/ui/DataTable";

export function CompareTotals({ diff }: { diff: OverviewDiff }) {
  const { a, b, delta } = diff.totals;
  const regionDelta = b.regions - a.regions;
  const signed = (v: number) => `${v > 0 ? "+" : ""}${v}`;
  return (
    <DataTable>
      <thead>
        <tr>
          <Th>Metric</Th>
          <Th numeric>A — {diff.dateA}</Th>
          <Th numeric>B — {diff.dateB}</Th>
          <Th numeric>Δ B−A</Th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <Td>Monthly cost</Td>
          <Td numeric>{money(a.monthlyCostUsd)}</Td>
          <Td numeric>{money(b.monthlyCostUsd)}</Td>
          <Td numeric className={deltaTone(delta.monthlyCostUsd, true)}>
            {moneyDelta(delta.monthlyCostUsd)}
          </Td>
        </tr>
        <tr>
          <Td>Potential savings</Td>
          <Td numeric>{money(a.potentialMonthlySavingsUsd)}</Td>
          <Td numeric>{money(b.potentialMonthlySavingsUsd)}</Td>
          <Td numeric className={deltaTone(delta.potentialMonthlySavingsUsd, false)}>
            {moneyDelta(delta.potentialMonthlySavingsUsd)}
          </Td>
        </tr>
        <tr>
          <Td>Regions</Td>
          <Td numeric>{num(a.regions)}</Td>
          <Td numeric>{num(b.regions)}</Td>
          <Td numeric>{signed(regionDelta)}</Td>
        </tr>
      </tbody>
    </DataTable>
  );
}