import type { Metadata } from 'next';
import Link from 'next/link';
import { EnabledToggle, RunNowButton } from '@/components/admin/actions';
import { AdminError, AdminHeader, JsonInline, RunsTable, SectionTitle, Tile, fmtBytes } from '@/components/admin/ui';
import { RunStatusPill, fmtDuration, fmtInterval, fmtUntil } from '@/components/meta/connectors-table';
import { adminApi, safeAdmin } from '@/lib/admin-api';
import { fmtAgo, fmtDateTime, fmtInt, num } from '@/lib/format';

export const metadata: Metadata = { title: 'Overview' };

export default async function AdminOverviewPage() {
  const res = await safeAdmin(adminApi.overview());
  if (res.error !== null) {
    return (
      <>
        <AdminHeader title="Overview" />
        <AdminError message={res.error} />
      </>
    );
  }
  const d = res.data.data;
  const now = Date.now();
  const db = d.database;
  const openFlags = d.quality.reduce((acc, q) => acc + (num(q.open) ?? 0), 0);
  return (
    <>
      <AdminHeader title="Overview" lede={`Generated ${fmtDateTime(res.data.meta.generated_at)} · request ${res.data.meta.request_id}`} action={<Link href="/status" className="text-sm text-accent hover:underline">Public status →</Link>} />

      <div className="grid grid-cols-2 gap-3 md:grid-cols-4 xl:grid-cols-8">
        <Tile label="Satellites" value={fmtInt(db.satellites)} />
        <Tile label="Element sets" value={fmtInt(db.elements)} hint="orbital_state rows" />
        <Tile label="Events" value={fmtInt(db.events)} />
        <Tile label="Raw snapshots" value={fmtInt(db.raw)} hint={`${fmtBytes(db.raw_bytes)} uncompressed`} href="/admin/raw" />
        <Tile label="Database" value={fmtBytes(db.db_bytes)} hint={`${fmtInt(db.db_connections)} connections`} />
        <Tile label="Redis" value={d.redis ? 'ok' : 'down'} tone={d.redis ? 'ok' : 'danger'} hint={`queue depth ${fmtInt(d.queue_depth)}`} />
        <Tile label="Open quality flags" value={fmtInt(openFlags)} tone={openFlags > 0 ? 'warn' : undefined} href="/admin/data-quality" />
        <Tile label="Review queue" value={fmtInt(d.review_open)} tone={d.review_open > 0 ? 'warn' : undefined} href="/admin/entity-resolution" />
      </div>

      <SectionTitle>Connectors</SectionTitle>
      <div className="overflow-x-auto">
        <table className="data-table stack md:min-w-[1100px]">
          <thead>
            <tr>
              <th>Connector</th>
              <th>Status</th>
              <th>Last success</th>
              <th>Next run</th>
              <th className="num">Duration</th>
              <th className="num">Failures</th>
              <th className="num">Errors 7 d</th>
              <th>Circuit</th>
              <th>Actions</th>
            </tr>
          </thead>
          <tbody>
            {d.connectors.map((c) => {
              const circuitOpen = !!c.circuit_open_until && new Date(c.circuit_open_until).getTime() > now;
              return (
                <tr key={c.name}>
                  <td className="primary">
                    <Link href={`/admin/connectors/${encodeURIComponent(c.name)}`} className="mono text-sm text-ink hover:text-accent">
                      {c.name}
                    </Link>
                    <div className="text-xs text-ink-3">
                      {c.source_name} · every {fmtInterval(c.interval_seconds)} · priority {c.priority}
                      {!c.enabled && <span className="ml-2 text-warn">disabled</span>}
                    </div>
                    {c.description && <div className="mt-0.5 max-w-md text-xs text-ink-3">{c.description}</div>}
                  </td>
                  <td data-label="Status">
                    <RunStatusPill status={c.last_status} />
                  </td>
                  <td data-label="Last success" title={fmtDateTime(c.last_success_at)} className="text-sm">
                    {fmtAgo(c.last_success_at, now)}
                  </td>
                  <td data-label="Next run" title={fmtDateTime(c.next_run_at)} className="text-sm text-ink-2">
                    {c.enabled ? fmtUntil(c.next_run_at, now) : '—'}
                  </td>
                  <td data-label="Duration" className="num tnum text-sm text-ink-2">
                    {fmtDuration(c.last_duration_ms)}
                  </td>
                  <td data-label="Failures" className={`num tnum text-sm ${c.consecutive_failures > 0 ? 'text-warn' : 'text-ink-2'}`}>
                    {fmtInt(c.consecutive_failures)}
                  </td>
                  <td data-label="Errors 7 d" className={`num tnum text-sm ${(num(c.errors_7d) ?? 0) > 0 ? 'text-warn' : 'text-ink-2'}`}>
                    {fmtInt(c.errors_7d)}
                  </td>
                  <td data-label="Circuit">{circuitOpen ? <span className="text-xs text-danger">open · resets {fmtUntil(c.circuit_open_until, now)}</span> : <span className="text-xs text-ink-3">closed</span>}</td>
                  <td data-label="Actions" className="primary md:[grid-column:auto]">
                    <div className="flex flex-wrap items-center gap-2">
                      <RunNowButton name={c.name} />
                      <EnabledToggle name={c.name} enabled={c.enabled} />
                    </div>
                  </td>
                </tr>
              );
            })}
          </tbody>
        </table>
      </div>
      <p className="mt-2 text-xs text-ink-3">
        &ldquo;Run now&rdquo; pushes a job to the Redis queue consumed by the scheduler (<code className="mono">si schedule</code>). If Redis is down the job is not visible to the scheduler and the button says so. Enabling a connector also resets its circuit breaker.
      </p>

      {d.failed_jobs.length > 0 && (
        <>
          <SectionTitle>Failed jobs</SectionTitle>
          <RunsTable runs={d.failed_jobs} now={now} />
        </>
      )}

      <SectionTitle>Recent runs</SectionTitle>
      <RunsTable runs={d.recent_runs} now={now} />
      {d.recent_runs.some((r) => r.meta) && (
        <details className="mt-3 text-xs text-ink-3">
          <summary className="cursor-pointer py-1 hover:text-ink">Run metadata (latest 5)</summary>
          <ul className="mt-2 space-y-1">
            {d.recent_runs.slice(0, 5).map((r) => (
              <li key={r.id} className="grid gap-1 sm:grid-cols-[220px_minmax(0,1fr)]">
                <span className="mono">{r.connector_name}</span>
                <JsonInline value={r.meta} />
              </li>
            ))}
          </ul>
        </details>
      )}
    </>
  );
}