loki5512344
fd2e29cede
Task 12 batch around the existing crop/preview flow: - Success Notice (auto-dismiss ~2.5s) after an avatar upload. - "Reposition" re-crops the current avatar without re-picking a file. - Drag & drop an image straight onto the profile avatar circle. - Real upload progress via a new XHR-backed api.upload (fetch has none); refreshOnce now also stores the renewed token (reload-restore fix). - Local avatar history (last 5, IndexedDB, this-device-only) strip that re-uploads a stored crop. Stored as ArrayBuffer (Blob is not cloneable under structuredClone); label makes the per-device scope explicit. - Added a "success" tone to Notice. Infra (same session): registered @shared/@features/@pages/@app/@test path aliases in vite.config + tsconfigs and rewrote deep ../../../ imports; moved avatar components into components/avatar/ to keep folders at <=4 files. Tests: avatarHistory cap/order, recrop visibility, drop-opens-cropper, client upload/progress/401-retry. bun test 103 pass, lint 0 errors, build ok.
21 lines
944 B
TypeScript
21 lines
944 B
TypeScript
import { useParams } from 'react-router'
|
|
import { ParticleField } from '@features/landing/effects/ParticleField'
|
|
import { VoxelScene } from '@features/landing/effects/VoxelScene'
|
|
import { ListingDetail } from '@features/showcase/components/ListingDetail'
|
|
|
|
const ACCENT = 'rgb(92, 200, 231)'
|
|
|
|
export default function ListingPage() {
|
|
const { id } = useParams<{ id: string }>()
|
|
return (
|
|
<section className="lv-bleed relative isolate -mt-(--topbar-h) flex min-h-svh flex-col gap-8 overflow-hidden pt-(--topbar-h) pb-16">
|
|
<div aria-hidden="true" className="absolute inset-0 -z-10 opacity-40">
|
|
<VoxelScene accent={ACCENT} />
|
|
</div>
|
|
<div aria-hidden="true" className="absolute inset-0 -z-10 bg-abyss/70" />
|
|
<ParticleField color={ACCENT} className="opacity-50" />
|
|
|
|
<div className="relative mx-auto w-full max-w-[720px] px-4 pt-12 sm:px-6">{id ? <ListingDetail id={id} /> : null}</div>
|
|
</section>
|
|
)
|
|
}
|