import { DataTable } from "@/components/data-table";
import { SectionHeading } from "@/components/section-heading";
import type { EngineSummary } from "@/lib/api/types";

export function EnginesBoard({ engines }: { engines: EngineSummary[] }) {
  const rows = engines.map((engine) => ({
    name: engine.name,
    status: engine.status,
    detail: engine.detail,
  }));

  return (
    <div className="pageStack">
      <SectionHeading
        kicker="Engines"
        title="Engine surface"
        description="Rust runtime metrics, heartbeats, and strategy-level status."
      />
      <DataTable
        columns={["name", "status", "detail"]}
        rows={rows}
        statusColumn="status"
      />
    </div>
  );
}
