Private
Public Access
Splitting the builder into a preview column and a fields column still capped the mockup at half the dialog's width. Give it the full width of the modal instead (name field on top, preview below spanning the whole dialog, fields and the native-controls toggle underneath), and scale up CustomThemePreview's own fixed pixel dimensions (~1.4x: avatar, sidebar, paddings, font sizes) so the extra room reads as a genuinely bigger mockup rather than the same small one with more empty space around it. Modal width bumped from 820px to 960px to match. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
DS Chat frontend (Phase 1)
React + Vite PWA. Login, room list, and chat views wired to the backend's
REST API and /ws/chat WebSocket endpoint. See ../README.md
and ../backend/README.md for full local setup.
Dev
npm install
npm run dev
The dev server proxies /api and /ws to http://localhost:8000 (see
vite.config.ts), so the backend must be running for anything beyond the
login page to work.
Build
npm run build
Generates the PWA manifest and service worker via vite-plugin-pwa into dist/.
Layout
src/
main.tsx, App.tsx routes: /login, /rooms, /rooms/:roomId
api/ fetch wrappers (client, auth, rooms)
ws/useChatSocket.ts WebSocket hook (join/send/receive)
context/AuthContext.tsx current-user state, hydrated via GET /api/auth/me
components/ ProtectedRoute, RoomListItem, MessageList, MessageInput
pages/ LoginPage, RoomListPage, ChatRoomPage