Files
t5de-hub/apps/web/app/account/link-card.tsx
T
dhkatzandClaude Opus 5.5 64c552330b Website: Next.js app for accounts, linking, who's online, device sign-in and the console
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]>
2026-10-29 05:02:00 -07:00

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>
);
}