import { formatBytes, listAudits } from "@/lib/store";

export default async function AuditsPage() {
  const audits = await listAudits();

  return (
    <main className="page-stack">
      <section className="hero-panel hero-panel--compact">
        <div className="hero-copy">
          <span className="eyebrow">AUDIT</span>
          <h2>鉴权审计</h2>
          <p className="page-lede">记录最近的 HTTP 鉴权回调结果、失败原因和请求来源。</p>
        </div>
        <div className="hero-aside">
          <div className="stat-tile">
            <span>最近记录</span>
            <strong>{audits.length}</strong>
          </div>
        </div>
      </section>

      <section className="panel-card">
        <div className="stack-md">
          {audits.map((audit) => (
            <div key={audit.id} className="list-row list-row--card">
              <div>
                <div className="badge-row">
                  <span className={`status-pill ${audit.ok ? "status-pill--ok" : "status-pill--danger"}`}>
                    {audit.ok ? "允许" : "拒绝"}
                  </span>
                </div>
                <p className="muted">
                  {audit.node_name ?? "未知节点"} / {audit.username ?? audit.auth_id ?? "-"}
                </p>
                <p className="muted mono">{audit.addr ?? "-"}</p>
              </div>
              <div className="align-right">
                <p>{audit.reason}</p>
                <p className="muted">
                  请求速率 {audit.requested_tx != null ? formatBytes(audit.requested_tx) : "-"}
                  /s
                </p>
                <p className="muted">{audit.created_at}</p>
              </div>
            </div>
          ))}
        </div>
      </section>
    </main>
  );
}