Self-service avatar picker in Account

Users can now set their own profile picture instead of asking staff:
POST /api/auth/avatar/ accepts a J-ID (or blank to clear) and reuses the
same item resolution as the staff endpoint. The Account page gains a
profile picture card with a searchable, paginated library grid — any
item works (the thumbnail is used), the current avatar is marked, and
the choice is confirmed before saving. Refreshing the signed-in user
updates the shell avatar immediately.

Verified against the dev server: set, clear, unknown J-ID -> 400,
anonymous -> 401.
This commit is contained in:
2026-09-17 22:31:05 -05:00
parent d8ba442e72
commit 3c49d2be2e
5 changed files with 313 additions and 19 deletions
@@ -13,6 +13,8 @@ import { useAuth } from "@/store/auth";
import { useE621 } from "@/store/e621";
import { toast } from "@/store/toasts";
import { AvatarCard } from "./AvatarCard";
const BASE_URL_OPTIONS = [
{ value: "https://e621.net", label: "e621.net — main site" },
{ value: "https://e926.net", label: "e926.net — safe mirror" },
@@ -208,6 +210,7 @@ export default function AccountPage() {
</p>
) : null}
</header>
{user ? <AvatarCard /> : null}
{loading && !credentials ? (
<div className="flex justify-center py-12">
<Spinner className="h-6 w-6" />