import { useEffect, useState } from "react";
import SectionCard from "../components/SectionCard";
import { api } from "../lib/api";

export default function AuditPage() {
  const [rows, setRows] = useState([]);
  useEffect(() => { api.get("/audit").then(setRows).catch(() => setRows([])); }, []);
  return (
    <SectionCard title="Audit" subtitle="Unveränderbarer Prüfpfad für sicherheitsrelevante Aktionen">
      <div className="table-wrap">
        <table className="table">
          <thead><tr><th>ID</th><th>Aktion</th><th>Objekt</th><th>Objekt-ID</th><th>Zeitpunkt</th></tr></thead>
          <tbody>
            {rows.map((row) => (
              <tr key={row.id}>
                <td>{String(row.id ?? "")}</td><td>{String(row.action ?? "")}</td><td>{String(row.entity_type ?? "")}</td><td>{String(row.entity_id ?? "")}</td><td>{String(row.created_at ?? "")}</td>
              </tr>
            ))}
          </tbody>
        </table>
      </div>
    </SectionCard>
  );
}
