## Frontend Testing — Step by Step Please test each step in order and report any errors (console errors, wrong text, broken UI, API errors). ### Step 1 — Join flow + PIN modal 1. Open **http://localhost:5173/** in your browser (or navigate there if already open) 2. You should land on the **join page** (`/join`) with a name input 3. Enter your name (e.g. `Max`) and click **Beitreten** 4. ✅ Expected: A modal appears showing your 4-digit PIN in large monospace font with a "Kopieren" button 5. Click **Weiter zur Galerie** ### Step 2 — Onboarding guide 6. You should land on the **feed page** (`/feed`) 7. ✅ Expected: A dark overlay appears at the bottom (or center on desktop) — the onboarding guide — showing step 1 of 4 with a step indicator and the Willkommen screen 8. Click **Weiter** through all 4 steps, then **Los geht's!** 9. ✅ Expected: Overlay disappears ### Step 3 — Feed & navigation 10. ✅ Expected: Feed shows "Noch keine Fotos." empty state with an upload button 11. ✅ Expected: Top-right has an **upload button** (blue) and a **person icon** link ### Step 4 — My Account page 12. Click the **person icon** in the top-right 13. ✅ Expected: `/account` page shows your name (`Max`), a blue "Gast" badge, session expiry date, and your PIN displayed large in an amber box 14. Click **Kopieren** — check clipboard contains your PIN 15. ✅ Expected: Button briefly shows "Kopiert!" 16. Click **Zur Galerie** to go back to the feed ### Step 5 — Upload 17. Click **Hochladen** — this takes you to `/upload` 18. Try uploading a photo from your device library 19. ✅ Expected: Photo appears in queue with a progress bar, then completes 20. Go back to `/feed` — ✅ Expected: your photo appears in the feed grid ### Step 6 — Onboarding guide not shown again 21. Reload the page at `/feed` 22. ✅ Expected: The onboarding overlay does **not** appear (already dismissed) ### Step 7 — Recover (open a private/incognito window) 23. Open a new **private/incognito** window at **http://localhost:5173/recover** 24. Enter the same name (`Max`) and the PIN you copied 25. ✅ Expected: You're redirected to the feed with the same account ### Step 8 — Upload rate-limit auto-retry 26. Upload more than 20 photos in one hour to trigger the rate limit 27. ✅ Expected: When the limit is hit, remaining items stay **Wartend** (not error) 28. ✅ Expected: An amber banner appears in the queue: "Upload-Limit erreicht. Wird in Xs automatisch fortgesetzt." 29. ✅ Expected: The countdown ticks down and uploads resume automatically when it reaches 0 ### Step 9 — Name uniqueness (case-insensitive) 30. In a private/incognito window go to **http://localhost:5173/join** 31. Enter `max` or `MAX` — the same name already taken in Step 1 (different case) 32. ✅ Expected: Instead of creating a new account, an amber warning appears: „Max ist bereits vergeben." with name tips 33. ✅ Expected: A PIN input and **Anmelden** button appear, plus an **Anderen Namen wählen** button 34. Enter your PIN from Step 1 and click **Anmelden** 35. ✅ Expected: You're signed in to the existing `Max` account and redirected to the feed 36. Alternatively, click **Anderen Namen wählen** — ✅ Expected: the name input reappears with `max` pre-filled so you can edit it --- ## Admin & Host Features For these steps you need an admin session. Go to **http://localhost:5173/admin/login** and enter the admin password (`admin123` for the dev environment). You'll be redirected to the dashboard automatically. ### Step 10 — Admin Dashboard: Stats & Config 1. Go to **http://localhost:5173/admin** 2. ✅ Expected: Stats card shows user count, upload count, comment count, and a disk-usage progress bar 3. In the **Konfiguration** section, change **Upload-Limit pro Stunde** to a different value (e.g. `5`) and click **Speichern** 4. ✅ Expected: Toast "Konfiguration gespeichert." appears briefly 5. Reload — ✅ Expected: the changed value persists ### Step 11 — Admin Dashboard: Export Jobs 6. The **Export-Jobs** section shows all past jobs (likely empty if gallery hasn't been released yet) 7. Click **Aktualisieren** — ✅ Expected: list refreshes without a full page reload ### Step 12 — Host Dashboard: Event Controls 8. Navigate to **http://localhost:5173/host** (or click "Host-Dashboard" from the admin page) 9. ✅ Expected: Event name shown in the header; two status dots (Uploads open/locked, Export released/locked) 10. Click **Uploads sperren** 11. ✅ Expected: Toast "Uploads wurden gesperrt."; button changes to "Uploads wieder öffnen"; status dot turns red 12. Try uploading a photo as a guest — ✅ Expected: "Uploads sind gesperrt." error 13. Click **Uploads wieder öffnen** — ✅ Expected: dot turns green; uploads work again ### Step 13 — Host Dashboard: User Management 14. The **Gäste** list shows all registered users with upload counts and sizes 15. Find a guest and click **Host** next to their name 16. ✅ Expected: Toast "X ist jetzt Host."; a blue "Host" badge appears next to their name 17. As admin, a **Degradieren** button is now visible — click it 18. ✅ Expected: Toast "X ist jetzt Gast."; badge disappears ### Step 14 — Host Dashboard: Ban & Unban 19. Click **Sperren** next to a guest 20. ✅ Expected: A confirmation modal opens asking what to do with their uploads, with a checkbox "Uploads aus der Galerie ausblenden" 21. Leave the checkbox unchecked and click **Sperren** 22. ✅ Expected: Toast "X wurde gesperrt."; a red "Gesperrt" badge appears; buttons change to **Entsperren** 23. Try uploading as that banned user — ✅ Expected: "Du bist gesperrt." error 24. Click **Entsperren** — ✅ Expected: ban lifted; badge gone ### Step 15 — Gallery Release & Export 25. Make sure you have at least a few photos uploaded, then on the Host Dashboard click **Galerie freigeben** 26. ✅ Expected: Toast "Galerie wurde freigegeben. Export wird vorbereitet…"; button becomes disabled "Galerie bereits freigegeben" 27. Navigate to **http://localhost:5173/export** as any logged-in user 28. ✅ Expected: Two cards — **ZIP-Archiv** and **HTML-Viewer** — both initially showing "Wird vorbereitet…" or a progress bar 29. Wait for both to show "Bereit zum Download" (reload or wait for SSE to update the UI) 30. Click **Download** on the ZIP card — ✅ Expected: `Gallery.zip` downloads 31. Click **Download** on the HTML card — ✅ Expected: A guide modal appears explaining how to open the file; click **Herunterladen** to get `Memories.zip` 32. In the Admin Dashboard → **Export-Jobs**, click **Aktualisieren** — ✅ Expected: both jobs show "Fertig" with green badges