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]>
58 lines
2.1 KiB
TypeScript
58 lines
2.1 KiB
TypeScript
import { ActionForm, SubmitButton } from "@/components/forms";
|
|
import { AgeTag, Initial, Outfit, Tag } from "@/components/status";
|
|
import { TimeAgo } from "@/components/time";
|
|
import type { Link } from "@/lib/api";
|
|
import { linkAction } from "./actions";
|
|
import { LinkSettings } from "./link-settings";
|
|
|
|
/** One linked IMVU account. */
|
|
export function LinkCard({ link }: { link: Link }) {
|
|
return (
|
|
<li className="flex gap-4 py-6 first:pt-0 last:pb-0">
|
|
<Initial name={link.username} />
|
|
<div className="flex min-w-0 flex-1 flex-col gap-5 sm:flex-row sm:items-start">
|
|
<div className="min-w-0 flex-1 space-y-4">
|
|
<div className="space-y-2">
|
|
<div className="font-medium">{link.username}</div>
|
|
<div className="flex flex-wrap items-center gap-2">
|
|
{link.online && (
|
|
<Tag tone="online" dot>
|
|
Online in T5DE
|
|
</Tag>
|
|
)}
|
|
<AgeTag link={link} />
|
|
<span className="text-xs text-muted-foreground">
|
|
checked <TimeAgo iso={link.checkedAt} />
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<Outfit items={link.outfit} />
|
|
<LinkSettings imvuId={link.imvuId} showBadge={link.showBadge} showPresence={link.showPresence} />
|
|
</div>
|
|
<ActionForm action={linkAction} fields={{ imvu: link.imvuId }} className="sm:max-w-56 sm:text-right">
|
|
<div className="flex gap-2 sm:justify-end">
|
|
<SubmitButton
|
|
variant="outline"
|
|
name="intent"
|
|
value="recheck"
|
|
pendingLabel="Checking…"
|
|
title="Check age verification with IMVU again"
|
|
>
|
|
Check again
|
|
</SubmitButton>
|
|
<SubmitButton
|
|
variant="outline"
|
|
name="intent"
|
|
value="unlink"
|
|
pendingLabel="Unlinking…"
|
|
confirm={`Unlink ${link.username}? To link it again, you'll need a new code in its tagline.`}
|
|
>
|
|
Unlink
|
|
</SubmitButton>
|
|
</div>
|
|
</ActionForm>
|
|
</div>
|
|
</li>
|
|
);
|
|
}
|