diff --git a/.DS_Store b/.DS_Store index 473cac4..5c1a4ec 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/DEBUG_COLOR_BUTTON.md b/DEBUG_COLOR_BUTTON.md deleted file mode 100644 index e7091df..0000000 --- a/DEBUG_COLOR_BUTTON.md +++ /dev/null @@ -1,104 +0,0 @@ -# 🐛 Debug : Bouton couleur manquant - -## Diagnostic - -Le code est bien prĂ©sent dans le fichier `app/missions/equipe/page.tsx` : -- ✅ Import de `Palette` (ligne 4) -- ✅ Fonction `handleOpenColorPicker` (ligne 503) -- ✅ Bouton avec icĂŽne Palette (ligne 1040-1049) -- ✅ Dialog de sĂ©lection de couleur (ligne 1377+) - -## VĂ©rifications Ă  faire - -### 1. Êtes-vous sur la bonne page ? - -Votre screenshot montre : **"Gestion des Ă©quipes"** avec onglet **"Groupes (7)"** - -✅ C'est bien la page `/missions/equipe` avec l'onglet Groupes activĂ©. - -### 2. VĂ©rifier le cache Next.js - -```bash -# Dans le terminal : -cd /Users/alma/Documents/NeahStable - -# Supprimer le cache Next.js -rm -rf .next - -# Rebuild -npm run dev -``` - -### 3. VĂ©rifier le cache du navigateur - -Dans votre navigateur : -- **Chrome/Edge** : Ctrl+Shift+R (Windows) ou Cmd+Shift+R (Mac) -- **Firefox** : Ctrl+F5 (Windows) ou Cmd+Shift+R (Mac) -- Ou ouvrir DevTools (F12) → Onglet Network → Cocher "Disable cache" - -### 4. VĂ©rifier que le serveur dev tourne - -```bash -# ArrĂȘter le serveur actuel (Ctrl+C) -# Puis relancer : -npm run dev -``` - -### 5. VĂ©rifier dans le code source de la page - -1. Ouvrir la page `/missions/equipe` -2. Clic droit → "Inspecter" (F12) -3. Onglet "Elements" ou "Inspector" -4. Chercher "Palette" dans le HTML (Ctrl+F) -5. Est-ce que vous trouvez `` avec la classe contenant "Palette" ? - -### 6. VĂ©rifier les erreurs console - -1. F12 → Onglet "Console" -2. Y a-t-il des erreurs en rouge ? -3. Copier/coller les erreurs si prĂ©sentes - -## Solution temporaire - -Si le bouton n'apparaĂźt toujours pas, utilisez la page `/groups` Ă  la place : - -1. Aller sur `/groups` -2. Dans la colonne ACTIONS, cliquer sur **⋼** (trois points) -3. SĂ©lectionner "Couleur du calendrier" - -Le code est identique dans `components/groups/groups-table.tsx` et devrait fonctionner. - -## Code exact du bouton - -Voici le code exact qui devrait ĂȘtre rendu (ligne 1040-1049) : - -```tsx - -``` - -Ce bouton devrait apparaĂźtre entre le bouton "Modifier" (Edit2) et "GĂ©rer les membres" (Users). - -## Ordre des boutons attendu - -Dans la colonne ACTIONS, vous devriez voir **4 boutons** : - -1. ✏ **Edit2** - Modifier le nom du groupe -2. 🎹 **Palette** - Couleur du calendrier ← NOUVEAU -3. đŸ‘„ **Users** - GĂ©rer les membres -4. đŸ—‘ïž **Trash2** - Supprimer le groupe - -## Si rien ne fonctionne - -Envoyez-moi : -1. Screenshot de la console (F12 → Console) -2. Screenshot du code source HTML (F12 → Elements, autour de la table) -3. RĂ©sultat de : `ls -la .next` dans le terminal diff --git a/DEPLOYMENT.md b/DEPLOYMENT.md deleted file mode 100644 index 05fa80c..0000000 --- a/DEPLOYMENT.md +++ /dev/null @@ -1,356 +0,0 @@ -# Guide de DĂ©ploiement Docker - Production - -Ce guide explique comment dĂ©ployer l'application Neah en production avec Docker. - -## 📋 PrĂ©requis - -- Docker Engine 20.10+ -- Docker Compose 2.0+ -- Au moins 4GB de RAM disponible -- Au moins 10GB d'espace disque - -## 🚀 DĂ©ploiement Rapide - -### 1. PrĂ©paration de l'environnement - -```bash -# Cloner le repository (si ce n'est pas dĂ©jĂ  fait) -git clone -cd NeahStable - -# CrĂ©er le fichier .env.production avec vos variables -cp .env.example .env.production -nano .env.production # Éditez avec vos valeurs -``` - -### 2. Configuration des variables d'environnement - -CrĂ©ez un fichier `.env.production` avec toutes les variables nĂ©cessaires : - -```bash -# Copier le fichier d'exemple -cp env.production.example .env.production - -# Éditer avec vos valeurs -nano .env.production -``` - -**Important** : Toutes les commandes `docker-compose` doivent utiliser `--env-file .env.production` pour charger les variables. - -```env -# Database -POSTGRES_USER=neah_user -POSTGRES_PASSWORD=VOTRE_MOT_DE_PASSE_SECURISE -POSTGRES_DB=calendar_db -DATABASE_URL=postgresql://neah_user:VOTRE_MOT_DE_PASSE_SECURISE@db:5432/calendar_db?schema=public - -# Redis -REDIS_PASSWORD=VOTRE_MOT_DE_PASSE_REDIS_SECURISE -REDIS_URL=redis://:VOTRE_MOT_DE_PASSE_REDIS_SECURISE@redis:6379 - -# NextAuth -NEXTAUTH_URL=https://hub.slm-lab.net -NEXTAUTH_SECRET=VOTRE_SECRET_NEXTAUTH_TRES_LONG_ET_SECURISE - -# Keycloak -KEYCLOAK_ISSUER=https://connect.slm-lab.net/realms/cercle -KEYCLOAK_CLIENT_ID=lab -KEYCLOAK_CLIENT_SECRET=VOTRE_CLIENT_SECRET -KEYCLOAK_REALM=cercle -NEXT_PUBLIC_KEYCLOAK_ISSUER=https://connect.slm-lab.net/realms/cercle - -# Application -APP_PORT=3000 -NODE_ENV=production -``` - -### 3. Build et dĂ©marrage - -```bash -# Build l'image Docker -docker-compose -f docker-compose.prod.yml --env-file .env.production build - -# DĂ©marrer les services (base de donnĂ©es et Redis) -docker-compose -f docker-compose.prod.yml --env-file .env.production up -d db redis - -# Attendre que les services soient prĂȘts (environ 10 secondes) -sleep 10 - -# Appliquer les migrations Prisma -docker-compose -f docker-compose.prod.yml --env-file .env.production run --rm app npx --yes prisma@6.4.1 migrate deploy - -# DĂ©marrer l'application -docker-compose -f docker-compose.prod.yml --env-file .env.production up -d app - -# VĂ©rifier les logs -docker-compose -f docker-compose.prod.yml --env-file .env.production logs -f app -``` - -## 🔧 Configuration AvancĂ©e - -### Variables d'environnement importantes - -#### Base de donnĂ©es PostgreSQL -- `POSTGRES_USER` : Utilisateur PostgreSQL -- `POSTGRES_PASSWORD` : **Changez absolument le mot de passe par dĂ©faut !** -- `POSTGRES_DB` : Nom de la base de donnĂ©es - -#### Redis -- `REDIS_PASSWORD` : **Changez absolument le mot de passe par dĂ©faut !** - -#### NextAuth -- `NEXTAUTH_URL` : URL publique de votre application (ex: `https://hub.slm-lab.net`) -- `NEXTAUTH_SECRET` : Secret pour signer les tokens JWT (gĂ©nĂ©rez avec `openssl rand -base64 32`) - -#### Keycloak -- `KEYCLOAK_ISSUER` : URL de votre instance Keycloak -- `KEYCLOAK_CLIENT_ID` : ID du client OAuth -- `KEYCLOAK_CLIENT_SECRET` : Secret du client OAuth -- `KEYCLOAK_REALM` : Nom du realm Keycloak - -### Ports exposĂ©s - -Par dĂ©faut, les ports suivants sont exposĂ©s : -- **3000** : Application Next.js -- **5432** : PostgreSQL (uniquement sur localhost) -- **6379** : Redis (uniquement sur localhost) - -Pour modifier les ports, Ă©ditez `docker-compose.prod.yml` : - -```yaml -app: - ports: - - "80:3000" # Exposer sur le port 80 -``` - -### Volumes et persistance - -Les donnĂ©es sont stockĂ©es dans des volumes Docker : -- `postgres_data` : Base de donnĂ©es PostgreSQL -- `redis_data` : DonnĂ©es Redis - -Pour sauvegarder : - -```bash -# Sauvegarder PostgreSQL -docker exec neah-postgres-prod pg_dump -U ${POSTGRES_USER:-neah_user} ${POSTGRES_DB:-calendar_db} > backup.sql - -# Restaurer PostgreSQL -docker exec -i neah-postgres-prod psql -U ${POSTGRES_USER:-neah_user} ${POSTGRES_DB:-calendar_db} < backup.sql -``` - -## 🔄 Mises Ă  jour - -### Mettre Ă  jour l'application - -```bash -# ArrĂȘter l'application -docker-compose -f docker-compose.prod.yml --env-file .env.production stop app - -# Rebuild l'image -docker-compose -f docker-compose.prod.yml --env-file .env.production build app - -# Appliquer les migrations si nĂ©cessaire -docker-compose -f docker-compose.prod.yml --env-file .env.production run --rm app npx --yes prisma@6.4.1 migrate deploy - -# RedĂ©marrer -docker-compose -f docker-compose.prod.yml --env-file .env.production up -d app -``` - -### Appliquer les migrations Prisma - -```bash -# VĂ©rifier le statut des migrations -docker-compose -f docker-compose.prod.yml --env-file .env.production run --rm app npx --yes prisma@6.4.1 migrate status - -# Appliquer les migrations -docker-compose -f docker-compose.prod.yml --env-file .env.production run --rm app npx --yes prisma@6.4.1 migrate deploy -``` - -## 📊 Monitoring et Logs - -### Voir les logs - -```bash -# Tous les services -docker-compose -f docker-compose.prod.yml --env-file .env.production logs -f - -# Un service spĂ©cifique -docker-compose -f docker-compose.prod.yml --env-file .env.production logs -f app -docker-compose -f docker-compose.prod.yml --env-file .env.production logs -f db -docker-compose -f docker-compose.prod.yml --env-file .env.production logs -f redis -``` - -### Health Check - -L'application expose un endpoint de health check : -- `GET http://localhost:3000/api/health` - -RĂ©ponse : -```json -{ - "status": "ok", - "timestamp": "2024-01-01T00:00:00.000Z", - "uptime": 3600, - "checks": { - "database": { "status": "ok", "latency": 5 }, - "redis": { "status": "ok", "latency": 2 } - }, - "latency": 7 -} -``` - -## 🔒 SĂ©curitĂ© - -### Checklist de sĂ©curitĂ© - -- [ ] Tous les mots de passe par dĂ©faut ont Ă©tĂ© changĂ©s -- [ ] `NEXTAUTH_SECRET` est un secret fort et unique -- [ ] Les ports ne sont exposĂ©s que si nĂ©cessaire -- [ ] Un reverse proxy (Nginx/Traefik) est configurĂ© avec SSL/TLS -- [ ] Les volumes sont sauvegardĂ©s rĂ©guliĂšrement -- [ ] Les logs sont surveillĂ©s pour dĂ©tecter les anomalies - -### Reverse Proxy avec Nginx - -Exemple de configuration Nginx : - -```nginx -server { - listen 80; - server_name hub.slm-lab.net; - - # Redirection HTTPS - return 301 https://$server_name$request_uri; -} - -server { - listen 443 ssl http2; - server_name hub.slm-lab.net; - - ssl_certificate /path/to/cert.pem; - ssl_certificate_key /path/to/key.pem; - - location / { - proxy_pass http://localhost:3000; - proxy_http_version 1.1; - proxy_set_header Upgrade $http_upgrade; - proxy_set_header Connection 'upgrade'; - proxy_set_header Host $host; - proxy_set_header X-Real-IP $remote_addr; - proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; - proxy_set_header X-Forwarded-Proto $scheme; - proxy_cache_bypass $http_upgrade; - } -} -``` - -## đŸ› ïž DĂ©pannage - -### L'application ne dĂ©marre pas - -```bash -# VĂ©rifier les logs -docker-compose -f docker-compose.prod.yml --env-file .env.production logs app - -# VĂ©rifier que les services dĂ©pendants sont dĂ©marrĂ©s -docker-compose -f docker-compose.prod.yml --env-file .env.production ps - -# VĂ©rifier la santĂ© des services -docker-compose -f docker-compose.prod.yml --env-file .env.production exec app curl http://localhost:3000/api/health -``` - -### ProblĂšmes de connexion Ă  la base de donnĂ©es - -```bash -# Tester la connexion PostgreSQL -docker-compose -f docker-compose.prod.yml --env-file .env.production exec db psql -U neah_user -d calendar_db -c "SELECT 1;" - -# VĂ©rifier les variables d'environnement -docker-compose -f docker-compose.prod.yml --env-file .env.production exec app env | grep DATABASE -``` - -### ProblĂšmes de connexion Redis - -```bash -# Tester Redis -docker-compose -f docker-compose.prod.yml --env-file .env.production exec redis redis-cli -a VOTRE_MOT_DE_PASSE ping -``` - -### Rebuild complet - -Si vous avez des problĂšmes persistants : - -```bash -# ArrĂȘter tous les services -docker-compose -f docker-compose.prod.yml --env-file .env.production down - -# Supprimer les volumes (⚠ PERDREZ LES DONNÉES) -docker-compose -f docker-compose.prod.yml --env-file .env.production down -v - -# Rebuild tout -docker-compose -f docker-compose.prod.yml --env-file .env.production build --no-cache - -# RedĂ©marrer -docker-compose -f docker-compose.prod.yml --env-file .env.production up -d -``` - -## 📩 Sauvegardes - -### Script de sauvegarde automatique - -CrĂ©ez un script `backup.sh` : - -```bash -#!/bin/bash -BACKUP_DIR="/backups/neah" -DATE=$(date +%Y%m%d_%H%M%S) - -# CrĂ©er le dossier de backup -mkdir -p $BACKUP_DIR - -# Sauvegarder PostgreSQL -docker exec neah-postgres-prod pg_dump -U neah_user calendar_db | gzip > $BACKUP_DIR/db_$DATE.sql.gz - -# Sauvegarder Redis (optionnel) -docker exec neah-redis-prod redis-cli --rdb - | gzip > $BACKUP_DIR/redis_$DATE.rdb.gz - -# Garder seulement les 7 derniers jours -find $BACKUP_DIR -name "*.gz" -mtime +7 -delete - -echo "Backup completed: $DATE" -``` - -Ajoutez dans crontab pour exĂ©cution quotidienne : -```bash -0 2 * * * /path/to/backup.sh -``` - -## 🚀 DĂ©ploiement avec Traefik (Optionnel) - -Pour un dĂ©ploiement avec Traefik comme reverse proxy : - -```yaml -# Ajoutez dans docker-compose.prod.yml -app: - labels: - - "traefik.enable=true" - - "traefik.http.routers.neah.rule=Host(`hub.slm-lab.net`)" - - "traefik.http.routers.neah.entrypoints=websecure" - - "traefik.http.routers.neah.tls.certresolver=letsencrypt" - - "traefik.http.services.neah.loadbalancer.server.port=3000" -``` - -## 📝 Notes importantes - -1. **Migrations Prisma** : Toujours exĂ©cuter `prisma migrate deploy` avant de dĂ©marrer l'application en production -2. **Secrets** : Ne jamais commiter les fichiers `.env` dans Git -3. **Ports** : Limiter l'exposition des ports aux services nĂ©cessaires uniquement -4. **Monitoring** : Configurer des alertes pour les health checks -5. **Sauvegardes** : Automatiser les sauvegardes de la base de donnĂ©es - -## 🔗 Ressources - -- [Documentation Docker](https://docs.docker.com/) -- [Documentation Next.js](https://nextjs.org/docs) -- [Documentation Prisma](https://www.prisma.io/docs) diff --git a/FEATURE_GROUP_CALENDAR_COLOR.md b/FEATURE_GROUP_CALENDAR_COLOR.md deleted file mode 100644 index 4104290..0000000 --- a/FEATURE_GROUP_CALENDAR_COLOR.md +++ /dev/null @@ -1,398 +0,0 @@ -# 🎹 FonctionnalitĂ© : Modification de la couleur des calendriers de groupes - -## 📋 Vue d'ensemble - -Cette fonctionnalitĂ© permet aux membres d'un groupe de personnaliser la couleur de la pastille du calendrier associĂ© Ă  leur groupe. Chaque groupe créé possĂšde un calendrier automatique nommĂ© `"Groupe: {nom}"`, et cette couleur est visible dans tous les affichages de calendrier (agenda, vision, etc.). - -## ✹ FonctionnalitĂ©s implĂ©mentĂ©es - -### 1. **API Backend** (`/app/api/groups/[groupId]/calendar/route.ts`) - -#### Nouveaux endpoints : - -**GET `/api/groups/[groupId]/calendar`** -- RĂ©cupĂšre le calendrier associĂ© Ă  un groupe -- Retourne l'objet calendrier avec sa couleur actuelle - -**PATCH `/api/groups/[groupId]/calendar`** -- Modifie uniquement la couleur du calendrier d'un groupe -- Body : `{ "color": "#FF5733" }` -- Validation du format hexadĂ©cimal -- VĂ©rification que l'utilisateur est membre du groupe -- Retourne le calendrier mis Ă  jour - -#### SĂ©curitĂ© : -- ✅ Authentification requise -- ✅ VĂ©rification de l'appartenance au groupe via Keycloak -- ✅ Validation du format de couleur (hex : `#RRGGBB` ou `#RGB`) - ---- - -### 2. **Interface utilisateur - Page Groupes** (`/components/groups/groups-table.tsx`) - -#### Modifications : - -1. **Affichage de la pastille de couleur** - - Chaque groupe affiche maintenant une pastille colorĂ©e Ă  cĂŽtĂ© de son nom - - Couleur par dĂ©faut : `#4f46e5` (indigo) - -2. **Nouveau bouton "Couleur du calendrier"** - - Accessible via le menu actions (icĂŽne ⋯) - - IcĂŽne palette (🎹) - -3. **Dialog de sĂ©lection de couleur** - - Palette de 16 couleurs prĂ©dĂ©finies - - Input manuel pour code hexadĂ©cimal - - Aperçu en temps rĂ©el de la couleur sĂ©lectionnĂ©e - - Validation avant sauvegarde - -#### Palette de couleurs disponibles : -```typescript -const colorPalette = [ - "#4f46e5", // Indigo - "#0891b2", // Cyan - "#0e7490", // Teal - "#16a34a", // Green - "#65a30d", // Lime - "#ca8a04", // Amber - "#d97706", // Orange - "#dc2626", // Red - "#e11d48", // Rose - "#9333ea", // Purple - "#7c3aed", // Violet - "#2563eb", // Blue - "#0284c7", // Sky - "#059669", // Emerald - "#84cc16", // Lime - "#eab308", // Yellow -]; -``` - ---- - -### 3. **Interface utilisateur - Page Missions/Équipe** (`/app/missions/equipe/page.tsx`) - -#### Modifications identiques Ă  GroupsTable : - -1. **Affichage de la couleur** - - IcĂŽne du groupe (đŸ‘„) affichĂ©e sur fond de la couleur du calendrier - - Texte en blanc pour meilleure lisibilitĂ© - -2. **Bouton direct dans la table** - - IcĂŽne palette (🎹) directement dans les actions - - Tooltip "Couleur du calendrier" - -3. **Dialog de sĂ©lection** - - MĂȘme interface que dans GroupsTable - - Sauvegarde avec loader pendant l'opĂ©ration - ---- - -### 4. **Suppression automatique du calendrier** (`/app/api/groups/[groupId]/route.ts`) ✹ **NOUVEAU** - -#### Modifications au DELETE endpoint : - -Lorsqu'un groupe est supprimĂ©, le calendrier associĂ© est maintenant automatiquement supprimĂ© : - -1. **RĂ©cupĂ©ration du nom du groupe** - - Appel Ă  Keycloak avant suppression pour obtenir le nom du groupe - -2. **Suppression du calendrier** - - Recherche du calendrier nommĂ© `"Groupe: {nom}"` - - Suppression via `prisma.calendar.deleteMany()` - - Logs en cas de succĂšs ou d'Ă©chec - -3. **Suppression du groupe** - - Suppression du groupe de Keycloak - - MĂȘme si la suppression du calendrier Ă©choue, le groupe est quand mĂȘme supprimĂ© - -#### Impact : -- ✅ Plus de calendriers orphelins dans la base -- ✅ Nettoyage automatique de la base de donnĂ©es -- ✅ Agenda plus propre aprĂšs suppression de groupes - ---- - -### 5. **Enrichissement API groupes utilisateur** (`/app/api/users/[userId]/groups/route.ts`) ✹ **NOUVEAU** - -#### Modifications au GET endpoint : - -L'API qui rĂ©cupĂšre les groupes d'un utilisateur enrichit maintenant les donnĂ©es avec les couleurs des calendriers : - -1. **RĂ©cupĂ©ration des groupes** - - Appel Ă  Keycloak pour obtenir les groupes de l'utilisateur - -2. **Enrichissement avec couleurs** - - Pour chaque groupe, recherche du calendrier associĂ© dans Prisma - - Ajout de la propriĂ©tĂ© `calendarColor` Ă  chaque groupe - - Valeur `null` si pas de calendrier trouvĂ© - -3. **Retour enrichi** - - Les groupes retournĂ©s contiennent maintenant `calendarColor` - - Visible immĂ©diatement dans la page Vision - -#### Impact : -- ✅ La page Vision affiche les bonnes couleurs -- ✅ Pas besoin de requĂȘtes supplĂ©mentaires cĂŽtĂ© client -- ✅ Une seule API call pour tout charger - ---- - -## 🔄 Flux de donnĂ©es - -### Chargement initial : -``` -1. Page charge les groupes via GET /api/groups -2. Pour chaque groupe : - └─> GET /api/groups/{groupId}/calendar - └─> RĂ©cupĂšre la couleur du calendrier - └─> Stocke dans state local : group.calendarColor -``` - -### Modification de couleur : -``` -1. Utilisateur clique sur icĂŽne palette -2. Dialog s'ouvre avec couleur actuelle -3. Utilisateur sĂ©lectionne nouvelle couleur -4. Clic "Enregistrer" - └─> PATCH /api/groups/{groupId}/calendar { color: "#newcolor" } - └─> VĂ©rification membre du groupe (Keycloak) - └─> Mise Ă  jour en base de donnĂ©es (Prisma) - └─> Mise Ă  jour du state local - └─> Toast de confirmation -5. Couleur visible immĂ©diatement partout -``` - ---- - -## 🎯 Points d'affichage de la couleur - -La couleur du calendrier de groupe est maintenant visible dans : - -1. **`/groups`** - Page groupes - - Table des groupes (pastille Ă  cĂŽtĂ© du nom) - -2. **`/missions/equipe`** - Page gestion Ă©quipe - - Table des groupes (icĂŽne colorĂ©e) - -3. **`/agenda`** - Page agenda - - Liste des calendriers (pastille Ă  gauche) - - ÉvĂ©nements dans le calendrier (barre colorĂ©e) - -4. **`/vision`** - Page visioconfĂ©rences ✹ **NOUVEAU** - - Cercle colorĂ© autour de l'icĂŽne groupe - - IcĂŽne en blanc si couleur personnalisĂ©e, en bleu sinon - - Couleur par dĂ©faut : `#DBEAFE` (bleu clair) - -5. **Widgets calendrier** - Tous les composants calendrier - - `calendar-widget.tsx` - - `calendar-client.tsx` - - `calendar.tsx` - ---- - -## đŸ§Ș Tests suggĂ©rĂ©s - -### Test 1 : Modification de couleur -1. Aller sur `/groups` ou `/missions/equipe` -2. Cliquer sur ⋯ → "Couleur du calendrier" -3. Choisir une nouvelle couleur -4. Cliquer "Enregistrer" -5. ✅ VĂ©rifier : Pastille mise Ă  jour immĂ©diatement - -### Test 2 : Validation format -1. Ouvrir dialog couleur -2. Entrer manuellement un code invalide : `#GGGGGG` -3. Cliquer "Enregistrer" -4. ✅ VĂ©rifier : Message d'erreur affichĂ© - -### Test 3 : Permissions -1. Se connecter avec utilisateur NON membre du groupe -2. Essayer de modifier la couleur -3. ✅ VĂ©rifier : Erreur 403 "Vous devez ĂȘtre membre du groupe" - -### Test 4 : Persistance -1. Modifier couleur d'un groupe -2. Actualiser la page -3. ✅ VĂ©rifier : Couleur conservĂ©e -4. Aller sur `/agenda` -5. ✅ VĂ©rifier : Couleur visible dans le calendrier - -### Test 5 : Affichage dans Vision ✹ **NOUVEAU** -1. Modifier la couleur d'un groupe -2. Aller sur `/vision` -3. ✅ VĂ©rifier : Le cercle autour de l'icĂŽne du groupe a la bonne couleur -4. ✅ VĂ©rifier : L'icĂŽne est en blanc si couleur personnalisĂ©e - -### Test 6 : Suppression du calendrier ✹ **NOUVEAU** -1. CrĂ©er un nouveau groupe -2. VĂ©rifier dans `/agenda` que le calendrier est créé -3. Supprimer le groupe dans `/missions/equipe` -4. Aller sur `/agenda` -5. ✅ VĂ©rifier : Le calendrier du groupe a Ă©tĂ© supprimĂ© -6. ✅ VĂ©rifier : Aucune erreur dans la console - ---- - -## 📁 Fichiers modifiĂ©s - -### Nouveaux fichiers : -- `app/api/groups/[groupId]/calendar/route.ts` (nouveau endpoint API) - -### Fichiers modifiĂ©s : - -#### 1. Gestion des couleurs : - -- `components/groups/groups-table.tsx` - - Import `Palette` de lucide-react - - Ajout interface `calendarColor?` Ă  Group - - Ajout Ă©tats `colorPickerDialog`, `selectedGroupForColor`, `selectedColor` - - Fonction `fetchGroups()` modifiĂ©e pour charger couleurs - - Fonctions `handleOpenColorPicker()` et `handleSaveColor()` - - Palette de couleurs `colorPalette` - - Dialog de sĂ©lection de couleur - - Affichage pastille dans table - -- `app/missions/equipe/page.tsx` - - Import `Palette` de lucide-react - - Ajout interface `calendarColor?` Ă  Group - - Ajout Ă©tats color picker - - Fonction `fetchData()` modifiĂ©e pour charger couleurs - - Fonctions `handleOpenColorPicker()` et `handleSaveColor()` - - Palette de couleurs - - Bouton palette dans actions - - Dialog de sĂ©lection de couleur - - Affichage icĂŽne colorĂ©e - -#### 2. Affichage dans Vision : ✹ **NOUVEAU** - -- `app/vision/page.tsx` - - Ajout `calendarColor?` Ă  interface `Group` - - Modification affichage du cercle groupe pour utiliser `group.calendarColor` - - Style dynamique : couleur personnalisĂ©e ou dĂ©faut `#DBEAFE` - - IcĂŽne blanche si couleur personnalisĂ©e, bleue sinon - -#### 3. Suppression automatique : ✹ **NOUVEAU** - -- `app/api/groups/[groupId]/route.ts` - - Endpoint DELETE modifiĂ© - - Import `prisma` et `logger` - - RĂ©cupĂ©ration des dĂ©tails du groupe avant suppression - - Suppression du calendrier associĂ© via `prisma.calendar.deleteMany()` - - Logs dĂ©taillĂ©s - -#### 4. Enrichissement API : ✹ **NOUVEAU** - -- `app/api/users/[userId]/groups/route.ts` - - Import `prisma` - - Endpoint GET enrichi - - Recherche du calendrier pour chaque groupe - - Ajout de `calendarColor` aux donnĂ©es retournĂ©es - - Gestion d'erreurs pour chaque groupe - ---- - -## 🔼 AmĂ©liorations futures possibles - -1. **Color picker avancĂ©** - - Utiliser un vrai color picker (ex: `react-color`) - - Support HSL, RGB en plus de hex - -2. **ThĂšmes prĂ©dĂ©finis** - - Palettes thĂ©matiques (pastel, vif, entreprise, etc.) - - Sauvegarde de palettes personnalisĂ©es - -3. **Permissions granulaires** - - Seuls les admins du groupe peuvent changer la couleur - - RĂŽle "gestionnaire de groupe" dans Keycloak - -4. **Historique des couleurs** - - Log des changements de couleur - - PossibilitĂ© de revenir en arriĂšre - -5. **Synchronisation** - - Webhook pour notifier les autres utilisateurs en temps rĂ©el - - WebSocket pour mise Ă  jour instantanĂ©e sans refresh - ---- - -## 📊 Impact sur les performances - -- **Chargement initial** : +1 requĂȘte API par groupe (GET calendar) -- **Modification** : 1 requĂȘte PATCH, pas de refresh complet -- **Cache** : Les calendriers sont dĂ©jĂ  en cache Redis (GET /api/calendars) -- **Optimisation** : PossibilitĂ© de batch les requĂȘtes GET calendar en une seule - ---- - -## 🐛 ProblĂšmes rĂ©solus - -### ✅ ProblĂšme 1 : Calendriers orphelins aprĂšs suppression de groupe -**SymptĂŽme** : Quand on supprimait un groupe, son calendrier restait dans la base de donnĂ©es et s'affichait dans l'agenda. - -**Solution** : Modification du endpoint DELETE pour supprimer automatiquement le calendrier associĂ© lors de la suppression du groupe. - -**Commit** : Ajout de la suppression automatique dans `/app/api/groups/[groupId]/route.ts` - ---- - -### ✅ ProblĂšme 2 : Couleurs non visibles dans la page Vision -**SymptĂŽme** : Les couleurs de calendrier personnalisĂ©es n'apparaissaient pas dans `/vision`, tous les groupes avaient la mĂȘme couleur bleue. - -**Solution** : -1. Enrichissement de l'API `/api/users/[userId]/groups` pour inclure `calendarColor` -2. Modification de l'interface `Group` dans `vision/page.tsx` -3. Affichage dynamique des couleurs dans l'UI - -**Commit** : Enrichissement API et affichage dans Vision - ---- - -## 🐛 ProblĂšmes connus - -Aucun problĂšme connu pour le moment. - ---- - -## ✅ Checklist de dĂ©ploiement - -- [x] API créée et testĂ©e -- [x] Interface utilisateur implĂ©mentĂ©e -- [x] Validation des permissions -- [x] Gestion des erreurs -- [x] Pas d'erreurs de linting -- [ ] Tests unitaires (Ă  ajouter) -- [ ] Tests E2E (Ă  ajouter) -- [ ] Documentation utilisateur (Ă  ajouter) - ---- - -## 📞 Support - -Pour toute question ou problĂšme : -1. VĂ©rifier que l'utilisateur est bien membre du groupe -2. VĂ©rifier le format de la couleur (hex valide) -3. VĂ©rifier les logs serveur pour les erreurs Keycloak -4. VĂ©rifier que le calendrier du groupe existe en base - ---- - -**Date de crĂ©ation** : 20 janvier 2026 -**DerniĂšre mise Ă  jour** : 21 janvier 2026 -**Version** : 1.2 -**Auteur** : Senior Developer Assistant - -### 📝 Changelog - -#### v1.2 (21 janvier 2026) -- ✹ Ajout : Suppression automatique du calendrier lors de la suppression d'un groupe -- ✹ Ajout : Affichage des couleurs dans la page Vision (`/vision`) -- 🔧 Modification : Enrichissement de l'API `/api/users/[userId]/groups` avec les couleurs -- 📚 Documentation : Ajout de nouveaux tests et problĂšmes rĂ©solus - -#### v1.1 (20 janvier 2026) -- 🐛 Fix : ProblĂšmes de dĂ©ploiement Docker -- 📚 Documentation : Ajout du guide de dĂ©ploiement - -#### v1.0 (20 janvier 2026) -- ✹ Version initiale avec modification des couleurs de calendrier diff --git a/LEANTIME_TASKS_FLOW.md b/LEANTIME_TASKS_FLOW.md deleted file mode 100644 index ce871d0..0000000 --- a/LEANTIME_TASKS_FLOW.md +++ /dev/null @@ -1,192 +0,0 @@ -# Flow complet des tĂąches Leantime dans le widget Devoirs - -## 1. BACKEND - API Route `/api/leantime/tasks` (app/api/leantime/tasks/route.ts) - -### Étape 1.1 : VĂ©rification de session -- **Ligne 91-95** : VĂ©rifie la session utilisateur -- Si pas de session → retourne 401 Unauthorized - -### Étape 1.2 : VĂ©rification du cache Redis -- **Ligne 103-141** : Si `forceRefresh=false`, vĂ©rifie le cache Redis -- **Ligne 107-123** : **FILTRE 1** - Filtre les tĂąches "done" du cache : - - Statuts filtrĂ©s : `0`, `3`, `5` (ou strings `'0'`, `'3'`, `'5'`, `'Done'`, `'done'`, `'DONE'`) - - Si des tĂąches "done" sont trouvĂ©es dans le cache, elles sont supprimĂ©es - - Le cache est mis Ă  jour avec les tĂąches filtrĂ©es -- Si cache valide → retourne les tĂąches filtrĂ©es du cache (ligne 139) - -### Étape 1.3 : RĂ©cupĂ©ration de l'ID utilisateur Leantime -- **Ligne 146** : `getLeantimeUserId(session.user.email)` -- Appelle l'API Leantime `leantime.rpc.users.getAll` -- Trouve l'utilisateur par `username === email` -- Retourne `user.id` ou `null` - -### Étape 1.4 : Appel API Leantime -- **Ligne 165-178** : Appelle `leantime.rpc.tickets.getAll` avec : - - `userId: userId` - - `status: "all"` (rĂ©cupĂšre TOUTES les tĂąches, tous statuts confondus) -- **Ligne 193-195** : Log toutes les tĂąches brutes reçues de Leantime - -### Étape 1.5 : Filtrage des tĂąches -- **Ligne 217-249** : **FILTRE 2** - Filtre les tĂąches : - - **a) Filtre par statut "done" (ligne 223-240)** : - - Statuts filtrĂ©s : `0`, `3`, `5` (ou strings `'0'`, `'3'`, `'5'`, `'done'`) - - Si `isDone === true` → la tĂąche est exclue (`return false`) - - **b) Filtre par Ă©diteur (ligne 242-248)** : - - Seules les tĂąches oĂč `task.editorId === userId` sont gardĂ©es - - Si `taskEditorId !== currentUserId` → la tĂąche est exclue - -### Étape 1.6 : Transformation des donnĂ©es -- **Ligne 250-266** : Transforme les tĂąches Leantime en format standard : - ```typescript - { - id: task.id.toString(), - headline: task.headline, - projectName: task.projectName, - projectId: task.projectId, - status: task.status, // ⚠ LE STATUT EST INCLUS ICI - dateToFinish: task.dateToFinish || null, - milestone: task.type || null, - details: task.description || null, - createdOn: task.dateCreated, - editedOn: task.editedOn || null, - editorId: task.editorId, - editorFirstname: task.editorFirstname, - editorLastname: task.editorLastname, - type: task.type || null, - dependingTicketId: task.dependingTicketId || null - } - ``` - -### Étape 1.7 : Mise en cache -- **Ligne 292** : Met en cache les tĂąches filtrĂ©es dans Redis -- **Ligne 294** : Retourne les tĂąches filtrĂ©es en JSON - ---- - -## 2. FRONTEND - Widget Devoirs (components/flow.tsx) - -### Étape 2.1 : Appel API -- **Ligne 107-113** : Appelle `/api/leantime/tasks` (ou `/api/leantime/tasks?refresh=true`) -- **Ligne 117-127** : RĂ©cupĂšre les donnĂ©es JSON et les assigne Ă  `leantimeTasks` -- **Ligne 121-126** : Log toutes les tĂąches reçues avec leur statut - -### Étape 2.2 : DĂ©tection des tĂąches "done" (pour log uniquement) -- **Ligne 129-143** : DĂ©tecte les tĂąches avec statut `5` ou `'done'` (⚠ NE FILTRE PAS LE STATUT 0) -- Affiche un warning si des tĂąches "done" sont trouvĂ©es - -### Étape 2.3 : Analyse des statuts (pour log uniquement) -- **Ligne 164-178** : CrĂ©e `leantimeStatusDetails` avec calcul de `isDone` -- **Ligne 168** : `isDone = statusNum === 0 || statusNum === 3 || statusNum === 5 || ...` -- **Ligne 193** : Filtre les tĂąches "done" pour le log `doneTasksCount` -- **Ligne 201-206** : Log le breakdown des statuts - -### Étape 2.4 : Combinaison avec Twenty CRM -- **Ligne 161** : Combine `leantimeTasks` et `twentyCrmTasks` dans `allTasks` - -### Étape 2.5 : Filtrage frontend -- **Ligne 242-281** : **FILTRE 3** - Filtre les tĂąches : - - **a) Filtre par statut "done" (ligne 245-260)** : - - Statuts filtrĂ©s : `0`, `3`, `5` (ou strings `'0'`, `'3'`, `'5'`, `'done'`) - - Si le statut correspond → la tĂąche est exclue (`return false`) - - **b) Filtre par date (ligne 262-280)** : - - Exclut les tĂąches sans `dateToFinish` - - Garde uniquement les tĂąches avec `dateToFinish <= today` (overdue ou due today) - -### Étape 2.6 : Tri -- **Ligne 296-317** : Trie les tĂąches : - 1. Par `dateToFinish` (oldest first) - 2. Si dates Ă©gales, par statut (statut `4` en premier) - -### Étape 2.7 : Notification badge -- **Ligne 362-366** : Met Ă  jour le badge de notification avec le nombre de tĂąches - -### Étape 2.8 : Affichage -- **Ligne 368** : `setTasks(sortedTasks)` - Met Ă  jour l'Ă©tat React - -### Étape 2.9 : Filtrage avant notification Outlook -- **Ligne 372-390** : **FILTRE 4** - Filtre les tĂąches avant d'envoyer l'Ă©vĂ©nement `tasks-updated` : - - **Ligne 380** : ⚠ **PROBLÈME ICI** - Ne filtre que `3` et `5`, PAS le statut `0` ! - - Si `isDone === true` → la tĂąche est exclue -- **Ligne 391-398** : Transforme les tĂąches pour l'Ă©vĂ©nement (sans inclure le `status`) - ---- - -## 3. PROBLÈMES IDENTIFIÉS - -### ProblĂšme 1 : Filtre ligne 380 dans flow.tsx -- **Ligne 380** : `isDone = taskStatus === 3 || taskStatus === 5 || ...` -- **Manque** : `taskStatus === 0` -- **Impact** : Les tĂąches avec statut `0` passent le filtre et sont envoyĂ©es dans l'Ă©vĂ©nement `tasks-updated` - -### ProblĂšme 2 : DĂ©tection ligne 129-135 dans flow.tsx -- **Ligne 134** : Ne dĂ©tecte que le statut `5`, pas `0` ni `3` -- **Impact** : Le log `⚠ Received done tasks` ne dĂ©tecte pas toutes les tĂąches "done" - -### ProblĂšme 3 : Le statut n'est pas inclus dans l'Ă©vĂ©nement tasks-updated -- **Ligne 391-398** : L'objet envoyĂ© dans l'Ă©vĂ©nement ne contient pas le champ `status` -- **Impact** : Les hooks qui Ă©coutent `tasks-updated` ne peuvent pas filtrer par statut - ---- - -## 4. FLOW RÉSUMÉ - -``` -1. API Leantime (toutes les tĂąches, tous statuts) - ↓ -2. FILTRE 1 (cache) : Exclut statuts 0, 3, 5 - ↓ -3. FILTRE 2 (API backend) : Exclut statuts 0, 3, 5 + filtre par editorId - ↓ -4. Transformation + Cache Redis - ↓ -5. Frontend reçoit les tĂąches (avec statut inclus) - ↓ -6. FILTRE 3 (frontend) : Exclut statuts 0, 3, 5 + filtre par date - ↓ -7. Tri par date - ↓ -8. FILTRE 4 (avant notification) : ⚠ Exclut seulement statuts 3, 5 (MANQUE 0) - ↓ -9. ÉvĂ©nement tasks-updated (sans statut dans l'objet) - ↓ -10. Affichage dans le widget -``` - ---- - -## 5. CORRECTIONS NÉCESSAIRES - -1. **Ligne 380 dans flow.tsx** : Ajouter `taskStatus === 0` au filtre ✅ CORRIGÉ -2. **Ligne 134 dans flow.tsx** : Ajouter dĂ©tection des statuts `0` et `3` ✅ CORRIGÉ -3. **Ligne 391-398 dans flow.tsx** : Inclure le champ `status` dans l'objet envoyĂ© dans l'Ă©vĂ©nement - ---- - -## 6. SIGNIFICATION DES STATUTS LEANTIME - -D'aprĂšs le code : - -### Mapping standard (app/api/leantime/status-labels/route.ts) : -- **Status 1** = 'NEW' -- **Status 2** = 'INPROGRESS' -- **Status 3** = 'DONE' ⚠ -- **Status 0** = Non dĂ©fini (tombe dans `default: 'UNKNOWN'`) - -### Mapping dans le widget (components/flow.tsx) : -- **Status 1** = 'New' -- **Status 2** = 'Blocked' -- **Status 3** = 'In Progress' ⚠ **INCOHÉRENCE avec status-labels** -- **Status 4** = 'Waiting for Approval' -- **Status 5** = 'Done' -- **Status 0** = 'Unknown' (par dĂ©faut) - -### Statuts filtrĂ©s comme "done" : -- **Status 0** = "Done" (dans votre instance Leantime, configuration personnalisĂ©e) -- **Status 3** = "Done" (selon `status-labels/route.ts`) -- **Status 5** = "Done" (selon `flow.tsx`) - -**Note** : Il y a une incohĂ©rence entre les deux mappings. Le statut 3 est mappĂ© Ă  "DONE" dans `status-labels` mais Ă  "In Progress" dans `flow.tsx`. Le statut 0 n'est pas standard dans Leantime mais semble ĂȘtre utilisĂ© comme "done" dans votre instance. diff --git a/QUICK_START_PRODUCTION.md b/QUICK_START_PRODUCTION.md deleted file mode 100644 index 9127f34..0000000 --- a/QUICK_START_PRODUCTION.md +++ /dev/null @@ -1,65 +0,0 @@ -# 🚀 DĂ©marrage Rapide - Production Docker - -## Installation en 5 minutes - -### 1. PrĂ©parer l'environnement - -```bash -# Copier le fichier d'exemple -cp env.production.example .env.production - -# Éditer avec vos valeurs -nano .env.production -``` - -**⚠ IMPORTANT** : Changez au minimum : -- `POSTGRES_PASSWORD` -- `REDIS_PASSWORD` -- `NEXTAUTH_SECRET` (gĂ©nĂ©rez avec `openssl rand -base64 32`) - -### 2. DĂ©ployer - -```bash -# Option A: Utiliser le script automatique -./scripts/deploy-prod.sh - -# Option B: Commandes manuelles -docker-compose -f docker-compose.prod.yml --env-file .env.production build -docker-compose -f docker-compose.prod.yml --env-file .env.production up -d db redis -sleep 15 -docker-compose -f docker-compose.prod.yml --env-file .env.production run --rm app npx --yes prisma@6.4.1 migrate deploy -docker-compose -f docker-compose.prod.yml --env-file .env.production up -d app -``` - -### 3. VĂ©rifier - -```bash -# VĂ©rifier que tout fonctionne -curl http://localhost:3000/api/health - -# Voir les logs -docker-compose -f docker-compose.prod.yml logs -f app -``` - -## Commandes utiles - -```bash -# ArrĂȘter -docker-compose -f docker-compose.prod.yml --env-file .env.production down - -# RedĂ©marrer -docker-compose -f docker-compose.prod.yml --env-file .env.production restart app - -# Voir les logs -docker-compose -f docker-compose.prod.yml --env-file .env.production logs -f - -# Appliquer les migrations -docker-compose -f docker-compose.prod.yml --env-file .env.production run --rm app npx --yes prisma@6.4.1 migrate deploy - -# AccĂ©der Ă  la base de donnĂ©es -docker-compose -f docker-compose.prod.yml --env-file .env.production exec db psql -U neah_user -d calendar_db -``` - -## 📖 Documentation complĂšte - -Voir `DEPLOYMENT.md` pour la documentation complĂšte.