Files
towercontrol/TODO.md
Julien Froidefond a112bb74f3 doc: ajout todo
2025-09-19 10:31:06 +02:00

24 KiB

TowerControl v2.0 - Gestionnaire de tâches moderne

Phase 1: Nettoyage et architecture (TERMINÉ)

1.1 Configuration projet Next.js

  • Initialiser Next.js avec TypeScript
  • Configurer ESLint, Prettier
  • Setup structure de dossiers selon les règles du workspace
  • Configurer base de données (SQLite local)
  • Setup Prisma ORM

1.2 Architecture backend standalone

  • Créer services/database.ts - Pool de connexion DB
  • Créer services/tasks.ts - Service CRUD pour les tâches
  • Créer lib/types.ts - Types partagés (Task, Tag, etc.)
  • Nettoyer l'ancien code de synchronisation

1.3 API moderne et propre

  • app/api/tasks/route.ts - API CRUD complète (GET, POST, PATCH, DELETE)
  • Supprimer les routes de synchronisation obsolètes
  • Configuration moderne dans lib/config.ts

Architecture finale : App standalone avec backend propre et API REST moderne

🎯 Phase 2: Interface utilisateur moderne (EN COURS)

2.1 Système de design et composants UI

  • Créer les composants UI de base (Button, Input, Card, Modal, Badge)
  • Implémenter le système de design tech dark (couleurs, typographie, spacing)
  • Setup Tailwind CSS avec classes utilitaires personnalisées
  • Créer une palette de couleurs tech/cyberpunk

2.2 Composants Kanban existants (à améliorer)

  • components/kanban/Board.tsx - Tableau Kanban principal
  • components/kanban/Column.tsx - Colonnes du Kanban
  • components/kanban/TaskCard.tsx - Cartes de tâches
  • components/ui/Header.tsx - Header avec statistiques
  • Refactoriser les composants pour utiliser le nouveau système UI

2.3 Gestion des tâches (CRUD)

  • Formulaire de création de tâche (Modal + Form)
  • Création rapide inline dans les colonnes (QuickAddTask)
  • Formulaire d'édition de tâche (Modal + Form avec pré-remplissage)
  • Édition inline du titre des tâches (clic sur titre → input)
  • Suppression de tâche (icône discrète + API call)
  • Changement de statut par drag & drop (@dnd-kit)
  • Validation des formulaires et gestion d'erreurs

2.4 Gestion des tags

  • Créer/éditer des tags avec sélecteur de couleur
  • Autocomplete pour les tags existants
  • Suppression de tags (avec vérification des dépendances)
  • Affichage des tags avec couleurs personnalisées
  • Service tags avec CRUD complet (Prisma)
  • API routes /api/tags avec validation
  • Client HTTP et hook useTags
  • Composants UI (TagInput, TagDisplay, TagForm)
  • Intégration dans les formulaires (TagInput avec autocomplete)
  • Intégration dans les TaskCards (TagDisplay avec couleurs)
  • Contexte global pour partager les tags
  • Page de gestion des tags (/tags) avec interface complète
  • Navigation dans le Header (Kanban ↔ Tags)
  • Filtrage par tags (intégration dans Kanban)
  • Interface de filtrage complète (recherche, priorités, tags)
  • Logique de filtrage temps réel dans le contexte
  • Intégration des filtres dans KanbanBoard

2.5 Clients HTTP et hooks

  • clients/tasks-client.ts - Client pour les tâches (CRUD complet)
  • clients/tags-client.ts - Client pour les tags
  • clients/base/http-client.ts - Client HTTP de base
  • hooks/useTasks.ts - Hook pour la gestion des tâches (CRUD complet)
  • hooks/useTags.ts - Hook pour la gestion des tags
  • Drag & drop avec @dnd-kit (intégré directement dans Board.tsx)
  • Gestion des erreurs et loading states
  • Architecture SSR + hydratation client optimisée

2.6 Fonctionnalités Kanban avancées

  • Drag & drop entre colonnes (@dnd-kit avec React 19)
  • Drag & drop optimiste (mise à jour immédiate + rollback si erreur)
  • Filtrage par statut/priorité/assigné
  • Recherche en temps réel dans les tâches
  • Interface de filtrage complète (KanbanFilters.tsx)
  • Logique de filtrage dans TasksContext
  • Tri des tâches (date, priorité, alphabétique)

2.7 Système de thèmes (clair/sombre)

  • Créer le contexte de thème (ThemeContext + ThemeProvider)
  • Ajouter toggle de thème dans le Header (bouton avec icône soleil/lune)
  • Définir les variables CSS pour le thème clair
  • Adapter tous les composants UI pour supporter les deux thèmes
  • Modifier la palette de couleurs pour le mode clair
  • Adapter les composants Kanban (Board, TaskCard, Column)
  • Adapter les formulaires et modales
  • Adapter la page de gestion des tags
  • Sauvegarder la préférence de thème (localStorage)
  • Configuration par défaut selon préférence système (prefers-color-scheme)

📊 Phase 3: Intégrations et analytics (Priorité 3)

3.1 Gestion du Daily

  • Créer services/daily.ts - Service de gestion des daily notes
  • Modèle de données Daily (date, checkboxes hier/aujourd'hui)
  • Interface Daily avec sections "Hier" et "Aujourd'hui"
  • Checkboxes interactives avec état coché/non-coché
  • Liaison optionnelle checkbox ↔ tâche existante
  • Cocher une checkbox NE change PAS le statut de la tâche liée
  • Navigation par date (daily précédent/suivant)
  • Auto-création du daily du jour si inexistant
  • UX améliorée : édition au clic, focus persistant, input large
  • Vue calendar/historique des dailies

3.2 Intégration Jira Cloud

  • Créer services/jira.ts - Service de connexion à l'API Jira Cloud
  • Configuration Jira (URL, email, API token) dans lib/config.ts
  • Authentification Basic Auth (email + API token)
  • Récupération des tickets assignés à l'utilisateur
  • Mapping des statuts Jira vers statuts internes (todo, in_progress, done, etc.)
  • Synchronisation unidirectionnelle (Jira → local uniquement)
  • Gestion des diffs - ne pas écraser les modifications locales
  • Style visuel distinct pour les tâches Jira (bordure spéciale)
  • Métadonnées Jira (projet, clé, assignee) dans la base
  • Possibilité d'affecter des tags locaux aux tâches Jira
  • Interface de configuration dans les paramètres
  • Synchronisation manuelle via bouton (pas d'auto-sync)
  • Logs de synchronisation pour debug
  • Gestion des erreurs et timeouts API

3.3 Page d'accueil/dashboard

  • Créer une page d'accueil moderne avec vue d'ensemble
  • Widgets de statistiques (tâches par statut, priorité, etc.)
  • Déplacer kanban vers /kanban et créer nouveau dashboard à la racine
  • Actions rapides vers les différentes sections
  • Affichage des tâches récentes
  • Graphiques de productivité (tâches complétées par jour/semaine)
  • Indicateurs de performance personnels
  • Intégration des analytics dans le dashboard

3.4 Analytics et métriques

  • services/analytics.ts - Calculs statistiques
  • Métriques de productivité (vélocité, temps moyen, etc.)
  • Graphiques avec Recharts (tendances, vélocité, distribution)
  • Composants de graphiques (CompletionTrend, Velocity, Priority, Weekly)
  • Insights automatiques et métriques visuelles

Autre Todo

  • Avoir un bouton pour réduire/agrandir la font des taches dans les kanban (swimlane et classique)
  • Refactorer les couleurs des priorités dans un seul endroit
  • Settings synchro Jira : ajouter une liste de projet à ignorer, doit etre pris en compte par le service bien sur
  • Faire des pages à part entière pour les sous-pages de la page config + SSR
  • Afficher dans l'édition de task les todo reliés. Pouvoir en ajouter directement avec une date ou sans.
  • Dans les titres de colonnes des swimlanes, je n'ai pas les couleurs des statuts
  • Système de sauvegarde automatique base de données
    • Sauvegarde automatique configurable (hourly/daily/weekly)
    • Configuration complète dans les paramètres avec interface dédiée
    • Rotation automatique des sauvegardes (configurable)
    • Format de sauvegarde avec timestamp + compression optionnelle
    • Interface complète pour visualiser et gérer les sauvegardes
    • CLI d'administration pour les opérations avancées
    • API REST complète pour la gestion programmatique
    • Vérification d'intégrité et restauration sécurisée
    • Option de restauration depuis une sauvegarde sélectionnée

🔧 Phase 4: Server Actions - Migration API Routes (Nouveau)

4.1 Migration vers Server Actions - Actions rapides

Objectif : Remplacer les API routes par des server actions pour les actions simples et fréquentes

Actions TaskCard (Priorité 1)

  • Créer actions/tasks.ts avec server actions de base
  • updateTaskStatus(taskId, status) - Changement de statut
  • updateTaskTitle(taskId, title) - Édition inline du titre
  • deleteTask(taskId) - Suppression de tâche
  • Modifier TaskCard.tsx pour utiliser server actions directement
  • Remplacer les props callbacks par calls directs aux actions
  • Intégrer useTransition pour les loading states natifs
  • Tester la revalidation automatique du cache
  • Nettoyage : Supprimer props obsolètes dans tous les composants Kanban
  • Nettoyage : Simplifier tasks-client.ts (garder GET et POST uniquement)
  • Nettoyage : Modifier useTasks.ts pour remplacer mutations par server actions

Actions Daily (Priorité 2)

  • Créer actions/daily.ts pour les checkboxes
  • toggleCheckbox(checkboxId) - Toggle état checkbox
  • addCheckboxToDaily(dailyId, content) - Ajouter checkbox
  • updateCheckboxContent(checkboxId, content) - Éditer contenu
  • deleteCheckbox(checkboxId) - Supprimer checkbox
  • reorderCheckboxes(dailyId, checkboxIds) - Réorganiser
  • Modifier les composants Daily pour utiliser server actions
  • Nettoyage : Supprimer routes /api/daily/checkboxes (POST, PATCH, DELETE)
  • Nettoyage : Simplifier daily-client.ts (garder GET uniquement)
  • Nettoyage : Modifier hook useDaily.ts pour useTransition

Actions User Preferences (Priorité 3)

  • Créer actions/preferences.ts pour les toggles
  • updateViewPreferences(preferences) - Préférences d'affichage
  • updateKanbanFilters(filters) - Filtres Kanban
  • updateColumnVisibility(columns) - Visibilité colonnes
  • updateTheme(theme) - Changement de thème
  • Remplacer les hooks par server actions directes
  • Nettoyage : Supprimer routes /api/user-preferences/* (PUT/PATCH)
  • Nettoyage : Simplifier user-preferences-client.ts (GET uniquement)
  • Nettoyage : Modifier UserPreferencesContext.tsx pour server actions

Actions Tags (Priorité 4)

  • Créer actions/tags.ts pour la gestion tags
  • createTag(name, color) - Création tag
  • updateTag(tagId, data) - Modification tag
  • deleteTag(tagId) - Suppression tag
  • Modifier les formulaires tags pour server actions
  • Nettoyage : Supprimer routes /api/tags (POST, PATCH, DELETE)
  • Nettoyage : Simplifier tags-client.ts (GET et search uniquement)
  • Nettoyage : Modifier useTags.ts pour server actions directes

Migration progressive avec nettoyage immédiat

Principe : Pour chaque action migrée → nettoyage immédiat des routes et code obsolètes

4.2 Conservation API Routes - Endpoints complexes

À GARDER en API routes (pas de migration)

Endpoints de fetching initial

  • GET /api/tasks - Récupération avec filtres complexes
  • GET /api/daily - Vue daily avec logique métier
  • GET /api/tags - Liste tags avec recherche
  • GET /api/user-preferences - Préférences initiales

Endpoints d'intégration externe

  • POST /api/jira/sync - Synchronisation Jira complexe
  • GET /api/jira/logs - Logs de synchronisation
  • Configuration Jira (formulaires complexes)

Raisons de conservation

  • API publique : Réutilisable depuis mobile/externe
  • Logique complexe : Synchronisation, analytics, rapports
  • Monitoring : Besoin de logs HTTP séparés
  • Real-time futur : WebSockets/SSE non compatibles server actions

4.3 Architecture hybride cible

Actions rapides → Server Actions directes
├── TaskCard actions (status, title, delete)
├── Daily checkboxes (toggle, add, edit) 
├── Preferences toggles (theme, filters)
└── Tags CRUD (create, update, delete)

Endpoints complexes → API Routes conservées  
├── Fetching initial avec filtres
├── Intégrations externes (Jira, webhooks)
├── Analytics et rapports
└── Future real-time features

4.4 Avantages attendus

  • 🚀 Performance : Pas de sérialisation HTTP pour actions rapides
  • 🔄 Cache intelligent : revalidatePath() automatique
  • 📦 Bundle reduction : Moins de code client HTTP
  • UX : useTransition loading states natifs
  • 🎯 Simplicité : Moins de boilerplate pour actions simples

📊 Phase 5: Surveillance Jira - Analytics d'équipe (Priorité 5)

5.1 Configuration projet Jira

  • Ajouter champ projectKey dans la config Jira (settings)
  • Interface pour sélectionner le projet à surveiller
  • Validation de l'existence du projet via API Jira
  • Sauvegarde de la configuration projet dans les préférences
  • Test de connexion spécifique au projet configuré

5.2 Service d'analytics Jira

  • Créer services/jira-analytics.ts - Métriques avancées
  • Récupération des tickets du projet (toute l'équipe, pas seulement assignés)
  • Calculs de vélocité d'équipe (story points par sprint)
  • Métriques de cycle time (temps entre statuts)
  • Analyse de la répartition des tâches par assignee
  • Détection des goulots d'étranglement (tickets bloqués)
  • Historique des sprints et burndown charts
  • Cache intelligent des métriques (éviter API rate limits)

5.3 Page de surveillance /jira-dashboard

  • Créer page dédiée avec navigation depuis settings Jira
  • Vue d'ensemble du projet (nom, lead, statut global)
  • Sélecteur de période (7j, 30j, 3 mois, sprint actuel)
  • Graphiques de vélocité avec Recharts
  • Heatmap d'activité de l'équipe
  • Timeline des releases et milestones
  • Alertes visuelles (tickets en retard, sprints déviants)

5.4 Métriques et graphiques avancés

  • Vélocité : Story points complétés par sprint
  • Burndown chart : Progression vs planifié
  • Cycle time : Temps moyen par type de ticket
  • Throughput : Nombre de tickets complétés par période
  • Work in Progress : Répartition par statut et assignee
  • Quality metrics : Ratio bugs/features, retours clients
  • Predictability : Variance entre estimé et réel
  • Collaboration : Matrice d'interactions entre assignees

5.5 Fonctionnalités de surveillance

  • Cache serveur intelligent : Cache en mémoire avec invalidation manuelle
  • Export des métriques : Export CSV/JSON avec téléchargement automatique
  • Comparaison inter-sprints : Tendances, prédictions et recommandations
  • Détection automatique d'anomalies (alertes)
  • Filtrage par composant, version, type de ticket
  • Vue détaillée par sprint avec drill-down
  • Intégration avec les daily notes (mentions des blockers) (supprimé)

📊 Phase 5.6: Résumé hebdomadaire pour Individual Review (EN COURS)

5.6.1 Fonctionnalités de base (TERMINÉ)

  • Vue résumé des 7 derniers jours (daily items + tâches)
  • Statistiques globales (completion rates, jour le plus productif)
  • Timeline chronologique des activités
  • Filtrage par jour de la semaine
  • Architecture SSR pour performance optimale

5.6.2 Améliorations pour l'Individual Review Manager 🎯

  • Métriques de performance personnelles

    • Vélocité hebdomadaire (tasks completed/week)
    • Temps moyen de completion des tâches
    • Répartition par priorité (high/medium/low tasks)
    • Taux de respect des deadlines
    • Evolution des performances sur 4 semaines (tendance)
  • Catégorisation des activités professionnelles

    • Auto-tagging par type : "Development", "Meetings", "Documentation", "Code Review"
    • Répartition temps par catégorie (% dev vs meetings vs admin)
    • Identification des "deep work" sessions vs interruptions
    • Tracking des objectifs OKRs/KPIs assignés
  • Visualisations pour manager

    • Graphique en aires : progression hebdomadaire
    • Heatmap de productivité : heures/jours les plus productifs
    • Radar chart : compétences/domaines travaillés
    • Burndown chart personnel : objectifs vs réalisé
  • Rapport automatique formaté

    • Export PDF professionnel avec métriques
    • Template "Weekly Accomplishments" pré-rempli
    • Bullet points des principales réalisations
    • Section "Challenges & Blockers" automatique
    • Recommandations d'amélioration basées sur les patterns
  • Contexte business et impact

    • Liaison tâches → tickets Jira → business value
    • Calcul d'impact estimé (story points, business priority)
    • Suivi des initiatives stratégiques
    • Corrélation avec les métriques d'équipe
  • Intelligence et insights

    • Détection patterns de productivité personnels
    • Suggestions d'optimisation du planning
    • Alertes sur la charge de travail excessive
    • Comparaison avec moyennes d'équipe (anonyme)
    • Prédiction de capacity pour la semaine suivante
  • Fonctionnalités avancées pour 1-on-1

    • Mode "Manager View" : vue consolidée pour discussions
    • Annotations et notes privées sur les réalisations
    • Objectifs SMART tracking avec progress bars
    • Archivage des reviews précédentes pour suivi long terme
    • Templates de questions pour auto-reflection

5.6.3 Intégrations externes pour contexte pro

  • Import calendrier : Meetings duration & frequency
  • GitHub/GitLab integration : Commits, PRs, code reviews
  • Slack integration : Messages envoyés, réactions, temps de réponse
  • Confluence/Notion : Documents créés/édités
  • Time tracking tools : Import depuis Toggl, Clockify, etc.

5.6.4 Machine Learning & Predictions

  • Modèle de productivité personnelle

    • Prédiction des jours de forte/faible productivité
    • Recommandations de planning optimal
    • Détection automatique de burnout patterns
    • Suggestions de breaks et équilibre work-life
  • Insights business automatiques

    • "Cette semaine, tu as contribué à 3 initiatives stratégiques"
    • "Ton focus sur la qualité (code reviews) est 20% au-dessus de la moyenne"
    • "Suggestion: bloquer 2h demain pour deep work sur Project X"

🚀 Quick Wins pour démarrer (Priorité 1)

  • Métriques de vélocité personnelle (1-2h)

    • Calcul tâches complétées par jour/semaine
    • Graphique simple ligne de tendance sur 4 semaines
    • Comparaison semaine actuelle vs semaine précédente
  • Export PDF basique (2-3h)

    • Génération PDF simple avec statistiques actuelles
    • Template "Weekly Summary" avec logo/header pro
    • Liste des principales réalisations de la semaine
  • Catégorisation simple par tags (1h)

    • Tags prédéfinis : "Dev", "Meeting", "Admin", "Learning"
    • Auto-suggestion basée sur mots-clés dans les titres
    • Répartition en camembert par catégorie
  • Connexion Jira pour contexte business (3-4h)

    • Affichage des story points complétés
    • Lien vers les tickets Jira depuis les tâches
    • Récap des sprints/epics contributés
  • Période flexible (1h)

    • Sélecteur de période : dernière semaine, 2 semaines, mois
    • Comparaison période courante vs période précédente
    • Sauvegarde de la période préférée

💡 Idées spécifiques pour Individual Review

Sections du rapport idéal :

  1. Executive Summary (3-4 bullet points impact business)
  2. Quantified Achievements (metrics, numbers, scope)
  3. Technical Contributions (code, architecture, tools)
  4. Collaboration Impact (reviews, mentoring, knowledge sharing)
  5. Process Improvements (efficiency gains, automation)
  6. Learning & Growth (new skills, certifications, initiatives)
  7. Challenges & Solutions (blockers overcome, lessons learned)
  8. Next Period Goals (SMART objectives, capacity planning)

Métriques qui impressionnent un manager :

  • Velocity & Consistency : "Completed 23 tasks with 94% on-time delivery"
  • Quality Focus : "15 code reviews provided, 0 production bugs"
  • Initiative : "Automated deployment reducing release time by 30%"
  • Business Impact : "Features delivered serve 10K+ users daily"
  • Collaboration : "Mentored 2 junior devs, led 3 technical sessions"
  • Efficiency : "Process optimization saved team 5h/week"

Questions auto-reflection intégrées :

  • "What was your biggest technical achievement this week?"
  • "Which tasks had the highest business impact?"
  • "What blockers did you encounter and how did you solve them?"
  • "What did you learn that you can share with the team?"
  • "What would you do differently next week?"

Autre Todos #2

  • Synchro Jira auto en background timé comme pour la synchro de sauvegarde
  • refacto des allpreferences : ca devrait eter un contexte dans le layout qui balance serverside dans le hook

🔧 Phase 6: Fonctionnalités avancées (Priorité 6)

6.1 Gestion avancée des tâches

  • Actions en lot (sélection multiple)
  • Sous-tâches et hiérarchie
  • Dates d'échéance et rappels
  • Assignation et collaboration
  • Templates de tâches

6.2 Personnalisation et thèmes

  • Mode sombre/clair
  • Personnalisation des couleurs
  • Configuration des colonnes Kanban
  • Préférences utilisateur

🚀 Phase 7: Intégrations futures (Priorité 7)

7.1 Intégrations externes (optionnel)

  • Import/Export depuis d'autres outils
  • API webhooks pour intégrations
  • Synchronisation cloud (optionnel)
  • Notifications push

7.2 Optimisations et performance

  • Optimisation des requêtes DB
  • Pagination et virtualisation
  • Cache côté client
  • PWA et mode offline

🛠️ Configuration technique

Stack moderne

  • Frontend: Next.js 14, React, TypeScript, Tailwind CSS
  • Backend: Next.js API Routes, Prisma ORM
  • Database: SQLite (local) → PostgreSQL (production future)
  • UI: Composants custom + Shadcn/ui, React Beautiful DnD
  • Charts: Recharts ou Chart.js pour les analytics

Architecture respectée

src/app/
├── api/tasks/          # API CRUD complète
├── page.tsx           # Page principale
└── layout.tsx

services/
├── database.ts        # Pool Prisma
└── tasks.ts          # Service tâches standalone

components/
├── kanban/           # Board Kanban
├── ui/              # Composants UI de base
└── dashboard/       # Widgets dashboard (futur)

clients/             # Clients HTTP (à créer)
hooks/              # Hooks React (à créer)
lib/
├── types.ts        # Types TypeScript
└── config.ts       # Config app moderne

🎯 Prochaines étapes immédiates

  1. Drag & drop entre colonnes - react-beautiful-dnd pour changer les statuts
  2. Gestion avancée des tags - Couleurs, autocomplete, filtrage
  3. Recherche et filtres - Filtrage temps réel par titre, tags, statut
  4. Dashboard et analytics - Graphiques de productivité

Fonctionnalités terminées (Phase 2.1-2.3)

  • Système de design tech dark complet
  • Composants UI de base (Button, Input, Card, Modal, Badge)
  • Architecture SSR + hydratation client
  • CRUD tâches complet (création, édition, suppression)
  • Création rapide inline (QuickAddTask)
  • Édition inline du titre (clic sur titre → input éditable)
  • Drag & drop entre colonnes (@dnd-kit) + optimiste
  • Client HTTP et hooks React
  • Refactoring Kanban avec nouveaux composants

Focus sur l'expérience utilisateur et le design moderne. App standalone prête pour évoluer.