Nuxt shadcn Demo

Workflow

Keine Headless-Browser-Verifizierung nach UI-Änderungen — der User testet selbst. Nur bei wiederholten Fehlern nachfragen/debuggen. Syntax-/Build-Checks sind weiterhin okay.
Dev-Server: npm run dev (Port 3000). Der User lässt ihn meist selbst laufen — nicht blind starten, erst prüfen ob bereits aktiv.
DB: MariaDB via docker-compose.yml (Container nuxt-shadcn-demo-db), URL in DATABASE_URL. Migrationen: npm run db:generate (Schema → SQL), npm run db:migrate (anwenden; im Dev-Modus auch automatisch per Nitro-Plugin).

Vue 3 <script setup lang="ts">, Composition API, shadcn-vue-Komponenten unter app/components/ui/.
Theme-Farben über semantische Tokens (bg-primary, border-primary, …), nie hardcoden. Themes: standard, neo, neo-pink, neo-mint — --primary ist die Signaturfarbe, --accent der Kontrast; in neo-* ist --radius: 0 (eckig), daher rounded-md/rounded-sm statt rounded-2xl/rounded-xl verwenden.
Tailwind: size-* statt w-* h-*, gap-* statt space-x/y-*, cn() für Konditionales.
Live-Updates laufen über server/routes/_ws.ts + broadcastToAll; Client-Verarbeitung in app/plugins/notifications.client.ts.
Kommentar-Reactions: useCommentReactions (State-Map pro Comment-Id), Emoji-Liste REACTION_EMOJIS.
Thread-Benachrichtigungen: threadSubscriptions speichert Abos und explizite Deaktivierungen. Erstellen, Kommentieren, Favorisieren und Post-Reactions rufen ensureThreadSubscription() auf; ein deaktiviertes Abo darf dadurch nicht reaktiviert werden. notifyComment() benachrichtigt aktive Abonnenten und erwähnte Nutzer, respektiert Deaktivierungen auch bei Erwähnungen und fasst Meldungen pro Nutzer/Thread zusammen.
Berechtigungen: Katalog in shared/utils/permissions.ts (PERMISSIONS), Server-Check per requirePermission(event, key) in server/utils/auth.ts — admin-Rolle ist implizit wildcard. Client-seitig can(key) aus useAuth. Seeding via seedPermissions() im Migrations-Plugin/Script.