import type { Metadata } from "next";
import { FilterBar } from "@/components/features";
import { NewUser, UserActions } from "@/components/features/accounts";
import { Badge, Card, EmptyState, PageHeader, Pagination, StatusBadge, Table, Td, Th } from "@/components/ui";
import { requireDashboard } from "@/lib/authz/guard";
import { buildHref, parseListParams } from "@/lib/list-params";
import { listUsers } from "@/lib/services/platform";
import { formatDateTime } from "@/lib/utils";

export const metadata: Metadata = { title: "Users" };
export const dynamic = "force-dynamic";

const STATUSES = ["ACTIVE", "SUSPENDED"] as const;
const PATH = "/dashboard/users";

export default async function UsersPage({ searchParams }: { searchParams: Promise<Record<string, string | string[] | undefined>> }) {
  const ctx = await requireDashboard("super-admin");
  const { q, status, page } = parseListParams(await searchParams, STATUSES);
  const { rows, total } = await listUsers({ q, status, page });
  return (
    <>
      <PageHeader title="Users" description="Every account on the platform." />
      <NewUser />
      <Card>
        <FilterBar action={PATH} q={q} status={status} statuses={STATUSES} placeholder="Search name or email" />
        {rows.length === 0 ? <EmptyState title="No users match" /> : (
          <Table>
            <thead><tr><Th>User</Th><Th>Access</Th><Th>Status</Th><Th>Last sign-in</Th><Th>Actions</Th></tr></thead>
            <tbody>
              {rows.map((u) => {
                const locked = u.locked;
                const access = [
                  ...u.organizationMemberships.map((m) => `${m.role.name} · ${m.organization.name}`),
                  ...u.siteMemberships.map((m) => `${m.role.name} · ${m.site.name}`),
                ];
                return (
                  <tr key={u.id}>
                    <Td><div className="font-medium">{u.name} {u.isSuperAdmin ? <Badge tone="info">super admin</Badge> : null}</div><div className="text-xs text-muted-foreground">{u.email}</div></Td>
                    <Td className="max-w-xs text-xs">{access.length ? access.join("; ") : <span className="text-muted-foreground">No organization or website access</span>}</Td>
                    <Td><StatusBadge value={u.status} /> {locked ? <Badge tone="warning">locked</Badge> : null}</Td>
                    <Td className="whitespace-nowrap">{u.lastLoginAt ? formatDateTime(u.lastLoginAt) : "never"}</Td>
                    <Td><UserActions userId={u.id} name={u.name} status={u.status} locked={locked} self={u.id === ctx.userId} /></Td>
                  </tr>
                );
              })}
            </tbody>
          </Table>
        )}
        <Pagination page={page} total={total} buildHref={(p) => buildHref(PATH, { q, status, page: p })} />
      </Card>
    </>
  );
}