import type { Metadata } from 'next';
import { AdminTitle, Bool, JsonPre, Mono } from '@/components/admin/ui';
import { HBars } from '@/components/charts/charts';
import { DataTable, EmptyRow, Td, Th } from '@/components/ui/data-table';
import { KeyValue } from '@/components/ui/key-value';
import { Unavailable } from '@/components/ui/unavailable';
import { adminApi, load, requireAdmin } from '@/lib/admin/admin-api';
import { fmtBytes, fmtDuration, fmtInt, num } from '@/lib/format';

export const metadata: Metadata = { title: 'Infrastructure', robots: { index: false, follow: false } };
export const dynamic = 'force-dynamic';

export default async function AdminInfrastructurePage() {
  await requireAdmin();
  const res = await load(adminApi.infrastructure());
  if (!res.ok) {
    return (
      <>
        <AdminTitle title="Infrastructure" />
        <Unavailable what="Infrastructure" reason={res.error} />
      </>
    );
  }
  const i = res.data;
  const db = i.database;
  const tables = [...(db?.tables ?? [])].sort((a, b) => (num(b.total_bytes) ?? 0) - (num(a.total_bytes) ?? 0));
  const hb = Object.entries(i.heartbeats ?? {});
  return (
    <>
      <AdminTitle title="Infrastructure" lede={i.hostname ? <Mono>{i.hostname}</Mono> : undefined} />
      <div className="grid gap-8 lg:grid-cols-2">
        <section>
          <p className="eyebrow mb-2">API process</p>
          <KeyValue
            dense
            rows={[
              { key: 'hostname', label: 'Host', value: <Mono>{i.hostname ?? '—'}</Mono> },
              { key: 'env', label: 'Environment', raw: i.env },
              { key: 'python', label: 'Python', raw: i.python },
              { key: 'platform', label: 'Platform', raw: i.platform },
              { key: 'uptime', label: 'API uptime', raw: num(i.api_uptime_s) === null ? null : fmtDuration(i.api_uptime_s) },
              { key: 'data_dir', label: 'Data dir', value: <Bool v={i.data_dir_exists} /> },
            ]}
          />
          <p className="eyebrow mt-6 mb-2">Archive</p>
          {i.archive ? (
            <KeyValue
              dense
              rows={[
                { key: 'raw', label: 'Raw', value: <span className="tnum">{fmtBytes(i.archive.raw_bytes)} · {fmtInt(i.archive.raw_files)} files</span> },
                { key: 'text', label: 'Text', value: <span className="tnum">{fmtBytes(i.archive.text_bytes)} · {fmtInt(i.archive.text_files)} files</span> },
              ]}
            />
          ) : (
            <p className="text-sm text-ink-3">Archive size unavailable.</p>
          )}
          <p className="eyebrow mt-6 mb-2">Heartbeats</p>
          {hb.length === 0 ? <p className="text-sm text-ink-3">None reported.</p> : <JsonPre value={i.heartbeats} maxHeight="14rem" />}
        </section>
        <section>
          <p className="eyebrow mb-2">Database</p>
          {db ? (
            <KeyValue
              dense
              rows={[
                { key: 'database', label: 'Database', value: <Mono>{db.database ?? '—'}</Mono> },
                { key: 'size', label: 'Size', raw: fmtBytes(db.db_bytes) },
                { key: 'pg', label: 'Server', raw: db.pg_version?.split(',')[0] ?? db.pg_version },
                { key: 'conn', label: 'Connections', value: <span className="tnum">{fmtInt(db.connections)} / {fmtInt(db.max_connections)}</span> },
              ]}
            />
          ) : (
            <p className="text-sm text-ink-3">Database metrics unavailable.</p>
          )}
          <p className="eyebrow mt-6 mb-2">Table sizes</p>
          <HBars data={tables.slice(0, 12).map((t) => ({ label: t.table, value: num(t.total_bytes) ?? 0, sub: `${fmtInt(t.rows_estimate)} rows` }))} format={(v) => fmtBytes(v)} />
        </section>
      </div>
      <section className="mt-8">
        <DataTable compact caption="Table sizes">
          <thead>
            <tr>
              <Th>Table</Th>
              <Th num>Total</Th>
              <Th num>Data</Th>
              <Th num>Rows (est.)</Th>
            </tr>
          </thead>
          <tbody>
            {tables.length === 0 && <EmptyRow cols={4}>No table statistics.</EmptyRow>}
            {tables.map((t) => (
              <tr key={t.table}>
                <Td primary><Mono className="text-ink">{t.table}</Mono></Td>
                <Td num label="Total" className="tnum text-xs">{fmtBytes(t.total_bytes)}</Td>
                <Td num label="Data" className="tnum text-xs text-ink-2">{fmtBytes(t.data_bytes)}</Td>
                <Td num label="Rows" className="tnum text-xs">{fmtInt(t.rows_estimate)}</Td>
              </tr>
            ))}
          </tbody>
        </DataTable>
      </section>
    </>
  );
}