fix(ui): make the dashboards agree with each other and with what the code does

Host and admin implement the same four operations with independently written copy, and
admin was stale or wrong in every case. Its release button was always enabled and always
read "Galerie freigeben", so a second tap returned a 409; it showed no release state, no
keepsake progress, no failure reason, no rebuild, and never refreshed after releasing.
It now matches the host page.

Both dashboards subscribed to SSE and never opened the connection — `onSseEvent` only
registers a handler. Every subscription was inert, so the keepsake progress bar sat
frozen after a release and PIN requests appeared only on a manual refresh. It happened
to work when arriving straight from /feed, which connects, and /feed disconnects on
destroy, so navigating to the dashboard killed it again.

The unban confirm named neither of the two things a host most needs to know: unbanning
also restores ALL of that guest's previously hidden photos to the gallery, diashow and
export, and it retires and rebuilds a released keepsake, during which every guest's
download is briefly unavailable. The ban modal warns that uploads vanish; nothing said
they come back. Both now do, gated on the gallery actually being released.

"Event verlassen" implied the account was being deleted, then the dialog said the guest
could log back in. It calls `DELETE /session` — this device only, nothing deleted — so
it is "Abmelden" now. Gallery release now states it locks uploads and is reversible; PIN
reset states the guest is signed out on all devices.

The keepsake download failed silently: nothing inspected the iframe result and the
ticket POST always succeeded, so an over-limit tap did nothing at all. It now surfaces
the (newly visible) 429 and confirms the download started. `/export` rendered "Export
noch nicht verfügbar / Schau nach der Veranstaltung noch einmal vorbei" when the status
request had merely FAILED — telling a guest to come back after an event that already
happened. Both dashboards' error states gained a retry, which a host on a PWA with no
URL bar otherwise has no way to reach.

Modals were centred with no max-height, so on a short viewport the join PIN dialog
clipped equally top and bottom — potentially putting "Weiter zur Galerie" off-screen at
the moment a first-time guest must proceed. The ten moderation buttons were ~28px tall
side by side, on the screen where a mis-tap bans the wrong guest; they are 44px now.
Six German quotation marks paired the opening „ with an ASCII straight quote.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Fabian Hamm (Privat)
2026-08-03 18:36:57 +02:00
parent 89ca819529
commit 2b1500e624
9 changed files with 465 additions and 54 deletions

View File

@@ -3,6 +3,7 @@
import { goto } from '$app/navigation';
import { api, ApiError } from '$lib/api';
import { setAuth } from '$lib/auth';
import { markGuideSeen } from '$lib/onboarding';
import { focusTrap } from '$lib/actions/focus-trap';
// Show which event the guest is joining (USER_JOURNEYS §1). Public, pre-auth.
@@ -72,6 +73,9 @@
pin: recoveryPin.trim()
});
setAuth(res.jwt, recoveryPin.trim(), res.user_id, takenName);
// Same as the dedicated /recover page: this is an EXISTING guest reclaiming their
// account, not a first-timer, so don't replay the onboarding guide at them.
markGuideSeen();
goto('/feed');
} catch (e) {
if (e instanceof ApiError) {
@@ -182,12 +186,12 @@
class="mb-5 rounded-lg border border-amber-200 bg-amber-50 p-4 dark:border-amber-800/60 dark:bg-amber-950/30"
>
<p class="font-semibold text-amber-900 dark:text-amber-200">
{takenName}" ist bereits vergeben.
{takenName} ist bereits vergeben.
</p>
<p class="mt-1 text-sm text-amber-800 dark:text-amber-300/90">
Wähle einen anderen Namen, z.&nbsp;B. einen Spitznamen oder füge deinen Nachnamen hinzu
(„{takenName}
M." oder „{takenName} aus Berlin").
M. oder „{takenName} aus Berlin).
</p>
</div>
@@ -322,11 +326,16 @@
{#if showPinModal}
<div
class="fixed inset-0 z-50 flex items-center justify-center bg-black/50 px-4"
class="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4"
data-testid="pin-modal"
>
<!-- Vertically centred, so anything taller than the viewport is clipped equally at both
ends — and this card is ~320 px, which a phone in landscape does not have. The
casualty would be "Weiter zur Galerie" at the very moment a first-time guest has to
get past it, with no visible scrollbar to suggest there is more. Cap the height and
scroll; `overscroll-contain` stops the join page behind from scrolling instead. -->
<div
class="card w-full max-w-sm p-6 shadow-xl"
class="card max-h-full w-full max-w-sm overflow-y-auto overscroll-contain p-6 shadow-xl"
role="dialog"
aria-modal="true"
aria-labelledby="pin-modal-title"