dhkatzandClaude Opus 5.5
51d5bb5ff3
/products (search), product pages with revisions, getting and staying on a revision, retracting; /products/:id/edit; /create and new revisions upload from the browser straight to the catalog with a token from the hub; /library; /catalogs (directory, registering with a once-shown key); /console/catalogs to approve or reject. Every page now sends a nonce-based CSP (proxy.ts), so product descriptions can't run scripts. buttonVariants now merges classes, so outline links get their border. Co-Authored-By: Claude Opus 5.5 <[email protected]>
89 lines
2.9 KiB
TypeScript
89 lines
2.9 KiB
TypeScript
import type { Metadata } from "next";
|
|
import { CatalogStatus, membership } from "@/components/catalogs";
|
|
import { PageHeader } from "@/components/status";
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
|
|
import { api, getMe, unwrap, type Catalog } from "@/lib/api";
|
|
import { RegisterForm } from "./register-form";
|
|
|
|
export const metadata: Metadata = { title: "Catalogs" };
|
|
|
|
export default async function Catalogs() {
|
|
const [me, { catalogs }] = await Promise.all([getMe(), api.catalogs.get().then(unwrap)]);
|
|
const mine = catalogs.filter((c) => c.mine);
|
|
const directory = catalogs.filter((c) => !c.mine && c.status === "approved");
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<PageHeader title="Catalogs">Servers that host community products.</PageHeader>
|
|
|
|
{mine.length > 0 && (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>Yours</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<CatalogTable catalogs={mine} showStatus />
|
|
</CardContent>
|
|
</Card>
|
|
)}
|
|
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>Directory</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
{directory.length === 0 ? (
|
|
<p className="text-sm text-muted-foreground">No catalogs yet.</p>
|
|
) : (
|
|
<CatalogTable catalogs={directory} />
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{me && (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>Register a catalog</CardTitle>
|
|
<CardDescription>Run t5de-catalog, then register its address here.</CardDescription>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<RegisterForm />
|
|
</CardContent>
|
|
</Card>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function CatalogTable({ catalogs, showStatus = false }: { catalogs: Catalog[]; showStatus?: boolean }) {
|
|
return (
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Name</TableHead>
|
|
<TableHead>Address</TableHead>
|
|
<TableHead>Membership</TableHead>
|
|
{showStatus && <TableHead>Visibility</TableHead>}
|
|
{showStatus && <TableHead>Status</TableHead>}
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{catalogs.map((c) => (
|
|
<TableRow key={c.id}>
|
|
<TableCell className="font-medium">{c.name}</TableCell>
|
|
<TableCell className="font-mono text-xs text-muted-foreground">{c.url}</TableCell>
|
|
<TableCell>{membership[c.membership] ?? c.membership}</TableCell>
|
|
{showStatus && <TableCell className="capitalize">{c.visibility}</TableCell>}
|
|
{showStatus && (
|
|
<TableCell>
|
|
<CatalogStatus status={c.status} />
|
|
</TableCell>
|
|
)}
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
);
|
|
}
|