radziel/spotlightcam
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: update documentation with chat enhancements

Browse Source 
Document three recent chat improvements:

1. Real-time Active Users Fix (dd31761)
   - Fixed bug where users list didn't update when new users joined
   - Rewrote getAllDisplayUsers() to prioritize Socket.IO data

2. Message Length Limits (4a91a10)
   - Added 2000 character limit with visual counter
   - Backend + frontend validation

3. Spam Protection System (ace3311)
   - Rate limiting: 10 messages per minute
   - Duplicate detection within 60 second window
   - Profanity filter with Polish + English words

Updated:
- README.md: Added chat features to Events & Chat section
- SESSION_CONTEXT.md: New "Chat Enhancements" section
- COMPLETED.md: Comprehensive entry with problem/solution/impact
- Last updated dates: 2025-12-03
This commit is contained in:
Radosław Gierwiało
2025-12-03 00:03:37 +01:00
parent ace33111a4
commit f6fd983c68
3 changed files with 187 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
README.md
View File

@@ -29,9 +29,13 @@ Web application (PWA) enabling dance event participants to:
### Events & Chat ### Events & Chat
- Event list from worldsdc.com - Event list from worldsdc.com
- Real-time event chat (Socket.IO) with active users sidebar - Real-time event chat (Socket.IO) with active users sidebar
- Real-time active users list (instant updates when users join/leave)
- Infinite scroll message history - Infinite scroll message history
- Clickable usernames (/@{username}) with country flags - Clickable usernames (/@{username}) with country flags
- Competitor numbers (bib numbers) display - Competitor numbers (bib numbers) display
- Message validation: 2000 character limit with visual counter
- Spam protection: rate limiting (10 msg/min), duplicate detection, profanity filter
- Polish + English profanity filtering
### Auto-matching & Fairness System ### Auto-matching & Fairness System
- Smart recording assignment for competition heats - Smart recording assignment for competition heats
@@ -204,7 +208,7 @@ spotlightcam/
│ │ ├── controllers/ # Auth, users, events, WSDC │ │ ├── controllers/ # Auth, users, events, WSDC
│ │ ├── routes/ # API routes (events, matches, admin) │ │ ├── routes/ # API routes (events, matches, admin)
│ │ ├── services/ # Matching algorithm, activity logging │ │ ├── services/ # Matching algorithm, activity logging
│ │ ├── middleware/ # Auth, admin access control │ │ ├── middleware/ # Auth, admin access, message validation (spam protection)
│ │ ├── socket/ # Socket.IO handlers (chat, WebRTC signaling, admin logs) │ │ ├── socket/ # Socket.IO handlers (chat, WebRTC signaling, admin logs)
│ │ └── __tests__/ # Jest tests (342 tests) │ │ └── __tests__/ # Jest tests (342 tests)
│ ├── prisma/ │ ├── prisma/
@@ -376,4 +380,4 @@ TBD
--- ---
**Status:** MVP Complete ✅ | 342/342 tests passing (100%) | Production Ready **Status:** MVP Complete ✅ | 342/342 tests passing (100%) | Production Ready
**Last Updated:** 2025-12-02 **Last Updated:** 2025-12-03

37
docs/SESSION_CONTEXT.md
View File

@@ -22,6 +22,9 @@
### Core Features (All Implemented) ### Core Features (All Implemented)
- JWT authentication with email verification (AWS SES) - JWT authentication with email verification (AWS SES)
- Real-time chat (Socket.IO) - event rooms + private 1:1 - Real-time chat (Socket.IO) - event rooms + private 1:1
- Real-time active users with instant updates
- Message validation (2000 char limit with visual counter)
- Spam protection (rate limiting, duplicate detection, profanity filter)
- WebRTC P2P file transfer (RTCDataChannel, up to 700MB tested) - WebRTC P2P file transfer (RTCDataChannel, up to 700MB tested)
- Competition heats system for matchmaking - Competition heats system for matchmaking
- Recording matching system with 3-tier account system (BASIC/SUPPORTER/COMFORT) - Recording matching system with 3-tier account system (BASIC/SUPPORTER/COMFORT)
@@ -98,9 +101,37 @@ Key models:
--- ---
## Recent Changes (2025-12-02) ## Recent Changes (2025-12-03)
### Activity Log System (Phase 3.5) - Complete ✅ ### Chat Enhancements - Complete ✅
**Real-time updates, message validation, and spam protection**
**Commits:** `dd31761` (real-time users), `4a91a10` (message limits), `ace3311` (spam protection)
**1. Real-time Active Users Fix (dd31761)**
- Fixed bug where active users list didn't update when new users joined chat
- Root cause: Used static `checkedInUsers` as base instead of real-time `activeUsers`
- Solution: Rewrote `getAllDisplayUsers()` to prioritize Socket.IO data
- Files: `frontend/src/pages/EventChatPage.jsx`, `frontend/src/hooks/useEventChat.js`
**2. Message Length Limits (4a91a10)**
- Added 2000 character limit for all chat messages (event + match chat)
- Backend validation in `send_event_message` and `send_match_message` handlers
- Frontend: `maxLength` attribute + character counter at 80% threshold (1600+)
- Visual feedback: red text when at limit, submit button disabled
- Files: `backend/src/constants/index.js`, `backend/src/socket/index.js`, `frontend/src/constants/index.js`, `frontend/src/components/chat/ChatInput.jsx`
**3. Spam Protection System (ace3311)**
- Rate Limiting: 10 messages per minute per user
- Duplicate Detection: Prevents identical messages within 1 minute window
- Profanity Filter: bad-words library (v2.0.0) with English + 11 Polish words
- In-memory tracking with automatic cleanup every 5 minutes
- User-friendly error messages for each validation type
- Files: `backend/src/middleware/messageValidation.js` (new), `backend/src/socket/index.js`, `backend/package.json`
---
### Activity Log System (Phase 3.5) - Complete ✅ (2025-12-02)
**Comprehensive admin monitoring with real-time streaming dashboard** **Comprehensive admin monitoring with real-time streaming dashboard**
**Backend (Phases 1-5):** **Backend (Phases 1-5):**
@@ -229,4 +260,4 @@ REST_BUFFER_MINUTES: 60
--- ---
**Last Updated:** 2025-12-02 **Last Updated:** 2025-12-03

148
docs/archive/COMPLETED.md
View File

@@ -1436,7 +1436,153 @@ activityLog({
--- ---
**Last Updated:** 2025-12-02 (Activity Log System completed) ## ✅ Chat Enhancements (COMPLETED 2025-12-03)
**Status:** Production Ready
**Time Spent:** ~2 hours
**Commits:** 3 commits (`dd31761`, `4a91a10`, `ace3311`)
**Tests:** Manual testing
### Overview
Enhanced chat system with real-time updates, message validation, and comprehensive spam protection. Improves UX with instant active user updates, prevents abuse with rate limiting and profanity filtering, and protects against excessive message lengths.
### 1. Real-time Active Users Fix (dd31761)
**Problem:**
- When new users joined event chat, existing users didn't see them in the active users list without page refresh
- Socket.IO was working correctly and emitting `active_users` events
- Frontend was receiving updates but users weren't displayed in UI
**Root Cause:**
- `getAllDisplayUsers()` function in `EventChatPage.jsx` used `checkedInUsers` (static, loaded once from API) as the base list
- `activeUsers` (real-time Socket.IO data) was only used to set `isOnline` flag
- When new user joined: appeared in `activeUsers` but not in `checkedInUsers`, so not displayed
**Solution:**
- Rewrote `getAllDisplayUsers()` to prioritize real-time data:
1. Use `activeUsers` (Socket.IO) as primary source of truth
2. Merge with `checkedInUsers` for offline users who checked in
3. Enrich Socket.IO data with database data when available
4. Sort online users first, offline second
**Files Modified:**
- `frontend/src/pages/EventChatPage.jsx` - Rewrote `getAllDisplayUsers()` function
- `frontend/src/hooks/useEventChat.js` - Added debug logging
- `backend/src/socket/index.js` - Added debug logging for active_users emissions
**Impact:**
- Instant real-time updates when users join/leave event chat
- No page refresh required
- Improved user experience for active chat monitoring
### 2. Message Length Limits (4a91a10)
**Problem:**
- No character limit for chat messages
- Database TEXT field could accept very long messages
- Risk of UI breaking with extremely long messages
- Poor UX with no feedback about message length
**Solution:**
- Implemented 2000 character limit across the stack:
**Backend:**
- Added `MESSAGE_MAX_LENGTH = 2000` constant
- Validation in `send_event_message` handler
- Validation in `send_match_message` handler
- User-friendly error message
**Frontend:**
- Added `MESSAGE_MAX_LENGTH = 2000` constant
- `maxLength={MESSAGE_MAX_LENGTH}` attribute on input field
- Character counter appears at 80% threshold (1600+ characters)
- Red warning text when at/over limit
- Submit button disabled when over limit
**Files Modified:**
- `backend/src/constants/index.js` - Added MESSAGE_MAX_LENGTH constant
- `backend/src/socket/index.js` - Added validation to both message handlers
- `frontend/src/constants/index.js` - Added MESSAGE_MAX_LENGTH export
- `frontend/src/components/chat/ChatInput.jsx` - Enhanced with counter and validation
**Impact:**
- Prevents database/UI issues from excessively long messages
- Clear visual feedback for users approaching limit
- Consistent validation across event and match chat
- Better UX with proactive character counter
### 3. Spam Protection System (ace3311)
**Problem:**
- No protection against chat abuse
- Users could spam messages rapidly
- No duplicate message detection
- No profanity filtering (especially important for Polish users)
**Solution:**
- Created comprehensive `messageValidation.js` middleware with 3 protection mechanisms:
**1. Rate Limiting**
- 10 messages per minute per user
- Sliding time window (60 seconds)
- In-memory tracking with Map: `userId -> timestamps[]`
- Auto-cleanup of expired timestamps
**2. Duplicate Detection**
- Prevents identical messages within 1 minute window
- Tracks last 5 messages per user
- In-memory tracking with Map: `userId -> [{ content, timestamp }]`
- Auto-cleanup of old messages
**3. Profanity Filter**
- Uses `bad-words` library v2.0.0 (CommonJS compatible)
- English profanity words (built-in)
- 11 Polish profanity words added
- User-friendly error message: "Message contains inappropriate language"
**Implementation Details:**
- Single `validateMessage(userId, content)` function for all checks
- Returns `{ valid: boolean, error?: string }`
- Integrated into both `send_event_message` and `send_match_message` handlers
- Replaced basic validation (empty/length checks only) with comprehensive validation
- Memory management: Periodic cleanup every 5 minutes
**Technical Note:**
- Initially installed `bad-words` v3.0.4 (ES module)
- Backend crashed: "exports is not defined in ES module scope"
- Fixed by downgrading to v2.0.0 (CommonJS compatible)
**Files Created:**
- `backend/src/middleware/messageValidation.js` (200 lines)
**Files Modified:**
- `backend/src/socket/index.js` - Import and integrate validateMessage()
- `backend/package.json` - Added bad-words@2.0.0
**Impact:**
- Prevents chat spam and abuse
- Maintains respectful chat environment
- Protects against duplicate message flooding
- Bilingual profanity filtering (English + Polish)
- User-friendly error messages for each violation type
- Never blocks legitimate users (reasonable limits)
### Git Commits
1. `dd31761` - fix(chat): real-time active users list updates
2. `4a91a10` - feat(chat): add 2000 character limit for messages
3. `ace3311` - feat(chat): implement spam protection and profanity filter
### Access Information
- Feature available to all logged-in users in event chat and match chat
- Spam protection runs automatically on every message
- Rate limit: 10 messages per minute
- Duplicate window: 60 seconds
- Character limit: 2000 characters (counter appears at 1600+)
---
**Last Updated:** 2025-12-03 (Chat Enhancements completed)
**Note:** This file is an archive of completed phases. For current status, see SESSION_CONTEXT.md or TODO.md **Note:** This file is an archive of completed phases. For current status, see SESSION_CONTEXT.md or TODO.md
**MVP Status:** ✅ 100% Complete - All core features implemented, tested, and production-ready **MVP Status:** ✅ 100% Complete - All core features implemented, tested, and production-ready