dhkatzandClaude Opus 5.5
64c552330b
apps/web: Next.js 16 (App Router), Tailwind 4 and shadcn/ui, light and dark from the system. Pages render on the server and call the API with Eden Treaty (typed by @t5de/api), forwarding the visitor's cookie; forms use server actions; sign-up, sign-in and sign-out use Better Auth's React client. /api is rewritten to the API so its cookies are first-party. Who's online follows the API's event stream (Next's gzip is off: it held the stream back). Standalone output with a Dockerfile; deploys to Vercel as is. Co-Authored-By: Claude Opus 5.5 <[email protected]>
69 lines
2.8 KiB
TypeScript
69 lines
2.8 KiB
TypeScript
import type { Metadata } from "next";
|
|
import Link from "next/link";
|
|
import { PageHeader, Tag } from "@/components/status";
|
|
import { DateTime } from "@/components/time";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardContent } from "@/components/ui/card";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
|
|
import { api, unwrap } from "@/lib/api";
|
|
import { ConsoleNav, requireModerator } from "../console-nav";
|
|
|
|
export const metadata: Metadata = { title: "People" };
|
|
|
|
export default async function People({ searchParams }: { searchParams: Promise<{ q?: string | string[] }> }) {
|
|
const raw = (await searchParams).q;
|
|
const q = typeof raw === "string" ? raw.slice(0, 64) : "";
|
|
await requireModerator(q ? `/console/people?q=${encodeURIComponent(q)}` : "/console/people");
|
|
const { people } = unwrap(await api.console.people.get({ query: q ? { q } : {} }));
|
|
|
|
return (
|
|
<>
|
|
<PageHeader title="People" />
|
|
<ConsoleNav />
|
|
<Card>
|
|
<CardContent className="space-y-6">
|
|
<form action="/console/people" className="flex max-w-md gap-2">
|
|
<Input type="search" name="q" defaultValue={q} placeholder="T5DE or IMVU username" aria-label="Search" />
|
|
<Button type="submit" variant="outline">
|
|
Search
|
|
</Button>
|
|
</form>
|
|
{people.length === 0 ? (
|
|
<p className="text-sm text-muted-foreground">Nobody found.</p>
|
|
) : (
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Username</TableHead>
|
|
<TableHead>Role</TableHead>
|
|
<TableHead>Link cap</TableHead>
|
|
<TableHead>Joined</TableHead>
|
|
<TableHead />
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{people.map((p) => (
|
|
<TableRow key={p.id}>
|
|
<TableCell>
|
|
<Link href={`/console/people/${p.id}`} className="font-medium underline-offset-4 hover:underline">
|
|
{p.username}
|
|
</Link>
|
|
</TableCell>
|
|
<TableCell className="capitalize">{p.role}</TableCell>
|
|
<TableCell className="tabular-nums">{p.linkCap}</TableCell>
|
|
<TableCell className="text-muted-foreground">
|
|
<DateTime iso={p.createdAt} dateOnly />
|
|
</TableCell>
|
|
<TableCell className="text-right">{p.banned && <Tag tone="danger">banned</Tag>}</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
</>
|
|
);
|
|
}
|