feat: Add collapsible groups for AI chat conversations
Implemented mobile-first collapsible conversation groups with full group management: Backend Changes: - Added PATCH /api/v1/ai/conversations/:id/group endpoint to move conversations - Added GET /api/v1/ai/groups endpoint to list user groups - Added updateConversationGroup() service method (ai.service.ts:687-710) - Added getConversationGroups() service method (ai.service.ts:712-730) - Uses existing metadata field in AIConversation entity (no migration needed) - Updated getUserConversations() to include metadata field Frontend Changes: - Implemented collapsible group headers with Folder/FolderOpen icons - Added organizeConversations() to group by metadata.groupName (lines 243-271) - Added toggleGroupCollapse() for expand/collapse functionality (lines 273-283) - Implemented context menu with "Move to Group" and "Delete" options (lines 309-320) - Created Move to Group dialog with existing groups list (lines 858-910) - Created Create New Group dialog with text input (lines 912-952) - Mobile-first design with touch-optimized targets and smooth animations - Right-click (desktop) or long-press (mobile) for context menu - Shows conversation count per group in header - Indented conversations (pl: 5) show visual hierarchy - Groups sorted alphabetically with "Ungrouped" always last Component Growth: - Backend: ai.controller.ts (+35 lines), ai.service.ts (+43 lines) - Frontend: AIChatInterface.tsx (663 → 955 lines, +292 lines) Mobile UX Enhancements: - MoreVert icon on mobile vs Delete icon on desktop - Touch-optimized group headers (larger padding) - Smooth Collapse animations (timeout: 'auto') - Context menu replaces inline actions on small screens 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -42,6 +42,7 @@ This document identifies features specified in the documentation that are not ye
|
||||
- ✅ **Conversation Memory** (October 2, 2025): Semantic search with embeddings, conversation summarization, memory retrieval
|
||||
- ✅ **Multi-Language AI** (October 2, 2025): 5 languages (en/es/fr/pt/zh) with localized prompts and safety responses
|
||||
- ✅ **AI Chat Conversation History** (October 2, 2025): Full conversation management UI with sidebar, conversation switching, deletion, and persistence
|
||||
- ✅ **AI Chat Collapsible Groups** (October 2, 2025): Mobile-first collapsible conversation groups with custom group management, context menus, and drag-to-organize
|
||||
|
||||
### Key Gaps Identified
|
||||
- **Backend**: 35 features not implemented (19 completed ✅)
|
||||
@@ -312,7 +313,51 @@ This document identifies features specified in the documentation that are not ye
|
||||
- Priority: Medium ✅ **COMPLETE**
|
||||
- Impact: Users can access chat history, switch conversations, and manage past conversations
|
||||
|
||||
6. **Prompt Injection Protection** ✅ COMPLETED (Previously)
|
||||
6. **AI Chat Collapsible Groups** ✅ COMPLETED (October 2, 2025)
|
||||
- Status: **IMPLEMENTED**
|
||||
- Current: Mobile-first collapsible conversation groups with custom group management
|
||||
- Implemented:
|
||||
* **Backend Group API** (ai.controller.ts, ai.service.ts):
|
||||
- PATCH /api/v1/ai/conversations/:id/group - Move conversation to group
|
||||
- GET /api/v1/ai/groups - Get all user groups
|
||||
- updateConversationGroup(userId, conversationId, groupName) service method
|
||||
- getConversationGroups(userId) service method
|
||||
- Uses existing metadata field in AIConversation entity
|
||||
* **Collapsible Group UI** (AIChatInterface.tsx:243-271):
|
||||
- organizeConversations() groups conversations by metadata.groupName
|
||||
- Sorts groups alphabetically with "Ungrouped" always last
|
||||
- toggleGroupCollapse(groupName) manages collapsed state
|
||||
- Folder/FolderOpen icons show expand/collapse state
|
||||
- Shows conversation count per group
|
||||
* **Context Menu** (AIChatInterface.tsx:309-320, 820-856):
|
||||
- Right-click or long-press on conversation (mobile)
|
||||
- "Move to Group" option
|
||||
- "Delete" option
|
||||
- Mobile shows MoreVert icon, desktop shows Delete icon
|
||||
* **Move to Group Dialog** (AIChatInterface.tsx:858-910):
|
||||
- Lists existing groups
|
||||
- "Ungrouped" option to remove from group
|
||||
- "Create New Group" button
|
||||
- handleMoveToGroup() updates conversation metadata
|
||||
* **Create New Group Dialog** (AIChatInterface.tsx:912-952):
|
||||
- Text input for new group name
|
||||
- Enter key submits
|
||||
- Validates non-empty group name
|
||||
- handleCreateNewGroup() creates group and moves conversation
|
||||
* **Mobile-First Design**:
|
||||
- Touch-optimized group headers (py: 1, larger touch targets)
|
||||
- Smooth Collapse animations (timeout: 'auto')
|
||||
- Context menu replaces inline actions on mobile
|
||||
- Hamburger menu for drawer access
|
||||
- Indented conversations (pl: 5) show hierarchy
|
||||
- Files:
|
||||
* Backend: `ai.controller.ts` (+35 lines), `ai.service.ts` (+43 lines)
|
||||
* Frontend: `AIChatInterface.tsx` (663 → 955 lines, +292 lines)
|
||||
- Backend APIs: PATCH /api/v1/ai/conversations/:id/group, GET /api/v1/ai/groups
|
||||
- Priority: Medium ✅ **COMPLETE**
|
||||
- Impact: Organized conversation management with collapsible groups, mobile-optimized UX
|
||||
|
||||
7. **Prompt Injection Protection** ✅ COMPLETED (Previously)
|
||||
- Status: **IMPLEMENTED**
|
||||
- Current: Comprehensive security system with 25+ regex patterns
|
||||
- Implemented: System manipulation detection, role change blocking, data exfiltration prevention, sanitizeInput() called in chat flow (ai.service.ts:193)
|
||||
|
||||
Reference in New Issue
Block a user