How pratik-vats/spillthetea works
SpillTheTea is an anonymous, multi-room real-time chat app. A visitor uses the React interface to connect without an account, receives a temporary identity, joins or creates a room, and exchanges messages; the interface also shows room activity, loads history, and supports invite links. Socket handlers coordinate identity, room membership, validation, rate limits, message history, and broadcasts. MongoDB provides persistence with documented in-memory fallback for messages. The map follows documented capabilities where socket-handler details were not sampled; those internal edges are limited to supported responsibilities.
Main entry points: chatSocket.js Chat event handlers · App.jsx App layout · useChat.js Chat state · server.js HTTP and socket server
Components 20
Chat interface
- App layout
frontend/src/App.jsx - Chat window
frontend/src/components/ChatWindow.jsx - Room navigation
frontend/src/components/Sidebar.jsx - Create room UI
frontend/src/components/CreateRoomModal.jsx - Message input
frontend/src/components/MessageInput.jsx - Chat state
frontend/src/hooks/useChat.js - Socket client
frontend/src/services/socket.js
Socket coordination
- HTTP and socket server
backend/src/server.js - HTTP health endpoint
backend/src/app.js - Chat event handlers
backend/src/sockets/chatSocket.js
Chat services
- Message validation
backend/src/middleware/security.js - Anonymous sessions
backend/src/services/userManager.js - Rate limiting
backend/src/services/rateLimiter.js - Room lifecycle
backend/src/services/roomManager.js - Message history
backend/src/services/messageManager.js
Persistence
- Database connection
backend/src/config/database.js - Message records
backend/src/models/Message.js - Room records
backend/src/models/Room.js
Other components
- Visitor
- MongoDB
Connections 25
- Visitor → App layout: uses
- App layout → Chat state: reads chat state
- App layout → Chat window: renders
- App layout → Room navigation: renders
- App layout → Create room UI: renders
- Chat window → Message input: renders
- Chat window → Chat state: calls actions
- Room navigation → Chat state: calls room actions
- Create room UI → Chat state: creates room
- Chat state → Socket client: emits and receives
- Socket client → Chat event handlers: Socket.IO events
- HTTP and socket server → HTTP health endpoint: creates app
- HTTP and socket server → Database connection: connects database
- HTTP and socket server → Chat event handlers: registers handlers
- Chat event handlers → Anonymous sessions: manages sessions
- Chat event handlers → Rate limiting: checks messages
- Chat event handlers → Message validation: validates payloads
- Chat event handlers → Room lifecycle: manages membership
- Chat event handlers → Message history: saves and loads
- Message history → Message records: reads and writes
- Room lifecycle → Room records: reads and writes
- Room lifecycle → Message records: deletes room messages
- Message records → MongoDB: persists records
- Room records → MongoDB: persists rooms
- Database connection → MongoDB: connects and reconnects