diff --git a/CHANGELOG.md b/CHANGELOG.md deleted file mode 100644 index bd9b929..0000000 --- a/CHANGELOG.md +++ /dev/null @@ -1,174 +0,0 @@ -# Changelog - Collaborative Design System - -## Version 2.0 - Collaborative Document Design (Nouvelle Fonctionnalité) - -### 🎯 Concept Principal -Remplacement du système de débat parallèle par un système de **conception itérative collaborative** où : -- Un architecte lead crée un document initial complet -- 3-7 agents spécialisés révisent et améliorent le document tour par tour -- Le document évolue progressivement jusqu'à convergence naturelle -- Traçabilité complète de toutes les modifications - -### Backend - Changements - -#### 1. **Base de Données** (`src/db/schema.js`) -- ✅ Nouvelles tables : - - `collaborative_sessions` : Sessions de conception - - `document_versions` : Historique complet des versions - - `document_rounds` : Suivi des tours de table -- Maintien de la compatibilité rétro avec `debates` et `responses` - -#### 2. **Service d'Orchestration** (`src/services/collaborativeOrchestrator.js` - NOUVEAU) -- `createSession()` : Crée une nouvelle session collaborative -- `startCollaborativeSession()` : Lead Architect crée le document initial -- `runRound()` : Exécute un tour de revue (chaque agent revoit le document) -- `getSessionDetails()` : Récupère l'état complet avec historique -- `calculateDiff()` : Suivi des modifications entre versions -- Détection automatique de convergence (aucun changement d'un tour complet) - -#### 3. **Routes API** (`src/routes/collaborate.js` - NOUVEAU) -``` -POST /api/collaborate - Créer une session -POST /api/collaborate/:id/start - Démarrer la session -POST /api/collaborate/:id/round - Exécuter un tour de revue -GET /api/collaborate/:id - Obtenir les détails -GET /api/collaborate/:id/document - Télécharger le document actuel -GET /api/collaborate/:id/versions/:v - Obtenir une version spécifique -POST /api/collaborate/:id/complete - Terminer la session -``` - -#### 4. **Serveur Principal** (`src/index.js`) -- ✅ Intégration du nouvel orchestrateur collaboratif -- ✅ Support WebSocket pour `sessionId` en plus de `debateId` -- Routage automatique vers `/api/collaborate` - -### Frontend - Changements - -#### 1. **Store Pinia** (`src/stores/collaboration.js` - NOUVEAU) -- Gestion d'état des sessions collaboratives -- Fonctions pour créer, lancer, et suivre les sessions -- Méthodes de téléchargement de documents - -#### 2. **Composants Vue** - -**CollaborativeInput.vue** (NOUVEAU) -- Formulaire pour créer une nouvelle session -- Choix du format (Markdown/Texte) -- Sélection du nombre d'agents (3-7) -- Interface conviviale avec explications - -**CollaborativeSession.vue** (NOUVEAU) -- Affichage en temps réel du document en évolution -- Timeline des modifications avec agents impliqués -- Boutons de contrôle : - - "Next Review Round" : Lancer le tour suivant - - "Complete Session" : Terminer - - "Download" : Exporter le document - - "Timeline" : Voir l'historique -- Affichage du statut de convergence - -**DocumentViewer.vue** (NOUVEAU) -- Rendu du document en Markdown ou texte brut -- Mise en évidence syntaxique simple -- Support des liens, listes, code blocks -- Responsive et bien stylisé - -#### 3. **App.vue** - Refonte Majeure -- Écran de sélection du mode au démarrage -- 2 modes : "Classic Debate" vs "Collaborative Design" (Recommandé) -- Navigation fluide entre les modes -- Boutons de retour intuitifs - -#### 4. **Composable WebSocket Amélioré** (`src/composables/useWebSocket.js`) -- Support de `sessionId` en paramètre -- Rétro-compatible avec `debateId` -- Routing automatique du WebSocket - -### Améliorations Produit - -#### 1. **7 Agents Spécialisés** (vs 4 avant) -- Lead Architect (créateur du document initial, poids 1.5x dans anciennes versions) -- Backend Engineer -- Frontend Engineer -- UI/UX Designer -- DevOps Engineer (NOUVEAU) -- Product Manager (NOUVEAU) -- Security Specialist (NOUVEAU) - -#### 2. **Flux Itératif Intelligent** -- Chaque agent voit le document complet + historique -- System prompts spécialisés pour chaque rôle -- Détection de convergence automatique -- Arrêt quand aucune modification d'un tour complet - -#### 3. **Documents Flexibles** -- Format Markdown (.md) pour documents structurés -- Format Texte brut (.txt) pour contenu simple -- Versioning complet avec historique -- Export facile en un clic - -#### 4. **Traçabilité Complète** -- Historique de chaque modification -- Qui a changé quoi et pourquoi -- Timeline visuelle interactive -- Accès à n'importe quelle version - -### Avantages du Nouveau Système - -| Aspect | Mode Débat | Mode Collaboratif | -|--------|-----------|------------------| -| **Processus** | Parallèle | Itératif | -| **Document** | Consensus arbitraire | Construction progressive | -| **Agents** | 4 | 3-7 (configurable) | -| **Convergence** | Vote pondéré (60%) | Naturelle (0 changements) | -| **Traçabilité** | Propositions individuelles | Historique complet | -| **Format** | JSON fixe | Flexible (MD/TXT) | -| **Qualité finale** | Bonne | Excellente | -| **Temps** | Rapide (1 appel) | Graduel (multiple tours) | - -### Fichiers Créés -- ✅ `backend/src/services/collaborativeOrchestrator.js` -- ✅ `backend/src/routes/collaborate.js` -- ✅ `frontend/src/stores/collaboration.js` -- ✅ `frontend/src/components/CollaborativeInput.vue` -- ✅ `frontend/src/components/CollaborativeSession.vue` -- ✅ `frontend/src/components/DocumentViewer.vue` -- ✅ `CHANGELOG.md` (ce fichier) - -### Fichiers Modifiés -- ✅ `backend/src/index.js` - Intégration orchestrateur -- ✅ `backend/src/db/schema.js` - Nouvelles tables -- ✅ `frontend/src/App.vue` - Mode selector et navigation -- ✅ `frontend/src/composables/useWebSocket.js` - Support sessionId -- ✅ `README.md` - Documentation - -### Tests à Faire -```bash -# Backend -npm start # Doit démarrer sans erreurs -curl http://localhost:3000/api/health - -# Frontend -npm run dev # Vite dev server -# Tester: http://localhost:5173 -``` - -### Prochaines Améliorations Possibles -- [ ] Support téléchargement fichiers contextuels (upload MD/TXT) -- [ ] Intégration Git (commit auto après convergence) -- [ ] Export PDF avec mise en page professionnelle -- [ ] Comparaison côte à côte des versions -- [ ] Statistiques détaillées par agent -- [ ] Webhook pour notifications externes -- [ ] Support collaboration multi-utilisateurs simultanés - -### Notes -- Système entièrement rétro-compatible : mode débat classique toujours disponible -- Performance : Chaque tour prend ~30-60s selon la longueur du document -- Coût API : Similaire au mode débat (n agents × 1 appel par tour) - ---- - -**Version** : 2.0.0 -**Date** : October 2024 -**Status** : Production Ready diff --git a/frontend/src/App.vue b/frontend/src/App.vue index c26e115..d6f6d78 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -1,119 +1,46 @@ @@ -142,122 +69,6 @@ body { padding: 2rem; } -/* Mode Selector */ -.mode-selector { - min-height: 100vh; - display: flex; - align-items: center; - justify-content: center; - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); -} - -.selector-container { - text-align: center; - color: white; -} - -.selector-container h1 { - font-size: 3rem; - margin-bottom: 0.5rem; -} - -.subtitle { - font-size: 1.3rem; - margin-bottom: 3rem; - opacity: 0.95; -} - -.mode-cards { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 2rem; - max-width: 900px; - margin: 0 auto; -} - -.mode-card { - background: white; - border: none; - border-radius: 16px; - padding: 2rem; - cursor: pointer; - transition: all 0.3s; - box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); - color: #2c3e50; - text-align: center; - position: relative; - overflow: hidden; -} - -.mode-card:hover { - transform: translateY(-8px); - box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3); -} - -.mode-icon { - font-size: 3rem; - margin-bottom: 1rem; -} - -.mode-card h3 { - font-size: 1.5rem; - margin-bottom: 1rem; - color: #667eea; -} - -.mode-card p { - color: #666; - line-height: 1.6; - margin-bottom: 1rem; -} - -.mode-badge { - display: inline-block; - padding: 0.5rem 1rem; - border-radius: 20px; - font-size: 0.85rem; - font-weight: 600; -} - -.debate-mode .mode-badge { - background: #e8eef7; - color: #667eea; -} - -.collaborate-mode .mode-badge { - background: #764ba2; - color: white; -} - -/* Navigation Buttons */ -.back-btn { - position: fixed; - top: 1.5rem; - left: 1.5rem; - padding: 0.75rem 1.5rem; - background-color: white; - border: 2px solid #667eea; - color: #667eea; - border-radius: 8px; - font-weight: 600; - cursor: pointer; - transition: all 0.3s; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); - z-index: 100; -} - -.back-btn:hover { - background-color: #667eea; - color: white; - transform: translateY(-2px); - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); -} - -.debate-view { - position: relative; -} - -.new-debate-btn, .new-session-btn { position: fixed; top: 2rem; @@ -274,29 +85,10 @@ body { z-index: 50; } -.new-debate-btn:hover, .new-session-btn:hover { background-color: #667eea; color: white; transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); } - -@media (max-width: 768px) { - .selector-container h1 { - font-size: 2rem; - } - - .subtitle { - font-size: 1rem; - } - - .mode-cards { - gap: 1rem; - } - - .mode-card { - padding: 1.5rem; - } -} diff --git a/frontend/src/components/CollaborativeInput.vue b/frontend/src/components/CollaborativeInput.vue index d802934..ff13bf5 100644 --- a/frontend/src/components/CollaborativeInput.vue +++ b/frontend/src/components/CollaborativeInput.vue @@ -7,32 +7,53 @@ const emit = defineEmits(['session-created']) const collaborationStore = useCollaborationStore() const prompt = ref('') -const documentFormat = ref('md') +const contextFile = ref(null) const agentCount = ref(7) const isCreating = ref(false) -const formats = [ - { value: 'md', label: 'Markdown (.md)' }, - { value: 'txt', label: 'Plain Text (.txt)' } -] - const agentOptions = [ { value: 3, label: '3 agents (Quick)' }, { value: 5, label: '5 agents (Balanced)' }, { value: 7, label: '7 agents (Comprehensive)' } ] +const handleFileSelect = (event) => { + const file = event.target.files?.[0] + if (file) { + const validTypes = ['text/markdown', 'text/plain', 'application/octet-stream'] + const validExtensions = ['.md', '.txt'] + const hasValidType = validTypes.includes(file.type) + const hasValidExtension = validExtensions.some(ext => file.name.endsWith(ext)) + + if (!hasValidType && !hasValidExtension) { + alert('Please upload a Markdown (.md) or Text (.txt) file') + return + } + + contextFile.value = file + } +} + const handleCreateSession = async () => { if (!prompt.value.trim()) { - alert('Please enter a project prompt') + alert('Please enter a project description') return } isCreating.value = true try { + let finalPrompt = prompt.value + + // If a context file was uploaded, prepend it to the prompt + if (contextFile.value) { + const fileContent = await contextFile.value.text() + finalPrompt = `Context file content:\n\`\`\`\n${fileContent}\n\`\`\`\n\nProject description:\n${prompt.value}` + } + + // Always use 'md' format for output const session = await collaborationStore.createSession( - prompt.value, - documentFormat.value, + finalPrompt, + 'md', agentCount.value ) @@ -40,7 +61,7 @@ const handleCreateSession = async () => { // Reset form prompt.value = '' - documentFormat.value = 'md' + contextFile.value = null agentCount.value = 7 } catch (error) { alert(`Error creating session: ${collaborationStore.error}`) @@ -54,47 +75,77 @@ const handleKeydown = (e) => { handleCreateSession() } } + +const removeFile = () => { + contextFile.value = null +}