import type { Metadata } from 'next';
import Link from 'next/link';
import { AdminFilters, AdminTitle, KindChip, Mono, Trunc } from '@/components/admin/ui';
import { DataTable, EmptyRow, Td, Th } from '@/components/ui/data-table';
import { LiveAgo } from '@/components/ui/live';
import { Unavailable } from '@/components/ui/unavailable';
import { adminApi, load, requireAdmin } from '@/lib/admin/admin-api';
import { fmtDateTime, fmtInt } from '@/lib/format';

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

export default async function AdminErrorsPage({ searchParams }: { searchParams: Promise<Record<string, string | undefined>> }) {
  await requireAdmin();
  const sp = await searchParams;
  const limit = Math.min(500, Math.max(10, Number(sp.limit) || 100));
  const [errs, connectors] = await Promise.all([load(adminApi.errors({ connector: sp.connector, limit })), load(adminApi.connectors())]);
  const names = connectors.ok ? connectors.data.items.map((c) => c.name).sort() : [];
  return (
    <>
      <AdminTitle title="Errors" count={errs.ok ? fmtInt(errs.data.total) : undefined} />
      <AdminFilters
        action="/admin/errors"
        className="mb-4"
        fields={[
          { kind: 'select', name: 'connector', label: 'Connector', value: sp.connector, options: names.map((n) => ({ value: n, label: n })) },
          { kind: 'select', name: 'limit', label: 'Rows', value: String(limit), any: '100', options: ['50', '100', '250', '500'].map((v) => ({ value: v, label: v })) },
        ]}
      />
      {!errs.ok ? (
        <Unavailable what="Errors" reason={errs.error} />
      ) : (
        <DataTable compact scroll caption="Fetch and parse errors">
          <thead>
            <tr>
              <Th>Time</Th>
              <Th>Connector</Th>
              <Th>Type</Th>
              <Th>Message</Th>
              <Th>URL</Th>
              <Th>Run</Th>
            </tr>
          </thead>
          <tbody>
            {errs.data.items.length === 0 && <EmptyRow cols={6}>No errors recorded.</EmptyRow>}
            {errs.data.items.map((e) => (
              <tr key={String(e.id)}>
                <Td className="text-xs" title={fmtDateTime(e.created_at)}><LiveAgo at={e.created_at} /></Td>
                <Td>{e.connector_name ? <Link href={`/admin/errors?connector=${encodeURIComponent(e.connector_name)}`} className="mono text-xs text-ink hover:text-accent">{e.connector_name}</Link> : <span className="text-ink-3">—</span>}</Td>
                <Td>{e.error_type ? <KindChip value={e.error_type} /> : <span className="text-ink-3">—</span>}</Td>
                <Td className="text-xs text-ink-2"><Trunc text={e.message} max={120} /></Td>
                <Td className="text-xs">
                  {e.url ? (
                    <a href={e.url} target="_blank" rel="noopener noreferrer" className="text-ink-2 hover:text-accent" title={e.url}>
                      {e.url.replace(/^https?:\/\/(www\.)?/, '').slice(0, 60)}
                    </a>
                  ) : (
                    <span className="text-ink-3">—</span>
                  )}
                </Td>
                <Td>{e.run_id ? <Mono>{e.run_id}</Mono> : <span className="text-ink-3">—</span>}</Td>
              </tr>
            ))}
          </tbody>
        </DataTable>
      )}
    </>
  );
}