Files
towercontrol/TODO.md
Julien Froidefond 124e8baee8 feat: overhaul TODO.md and enhance Kanban components
- Updated TODO.md to reflect the new project structure and phases, marking several tasks as completed.
- Enhanced Kanban components with a tech-inspired design, including new styles for columns and task cards.
- Removed the obsolete reminders service and task processor, streamlining the codebase for better maintainability.
- Introduced a modern API for task management, including CRUD operations and improved error handling.
- Updated global styles for a cohesive dark theme and added custom scrollbar styles.
2025-09-14 08:15:22 +02:00

4.9 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, etc.)
  • Implémenter le système de design (couleurs, typographie, spacing)
  • Setup Tailwind CSS avec design tokens personnalisés
  • Créer une palette de couleurs moderne et accessible

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
  • Améliorer le design et l'UX des composants existants

2.3 Clients HTTP et hooks

  • clients/tasks-client.ts - Client pour les tâches
  • clients/base/http-client.ts - Client HTTP de base
  • hooks/useTasks.ts - Hook pour la gestion des tâches
  • hooks/useKanban.ts - Hook pour drag & drop
  • Gestion des erreurs et loading states

2.4 Fonctionnalités Kanban avancées

  • Drag & drop entre colonnes (react-beautiful-dnd)
  • Formulaires de création/édition de tâches
  • Filtrage par tags/statut/priorité
  • Recherche en temps réel dans les tâches
  • Gestion des tags avec couleurs

📊 Phase 3: Dashboard et analytics (Priorité 3)

3.1 Page d'accueil/dashboard

  • Créer une page d'accueil moderne avec vue d'ensemble
  • Widgets de statistiques (tâches par statut, priorité, etc.)
  • Graphiques de productivité (tâches complétées par jour/semaine)
  • Indicateurs de performance personnels

3.2 Analytics et métriques

  • services/analytics.ts - Calculs statistiques
  • Métriques de productivité (vélocité, temps moyen, etc.)
  • Graphiques avec Chart.js ou Recharts
  • Export des données en CSV/JSON

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

4.1 Gestion avancée des tâches

  • Sous-tâches et hiérarchie
  • Dates d'échéance et rappels
  • Assignation et collaboration
  • Templates de tâches

4.2 Personnalisation et thèmes

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

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

5.1 Intégrations externes (optionnel)

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

5.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. Créer les composants UI de base (Button, Input, Card, Modal)
  2. Implémenter le système de design avec Tailwind
  3. Améliorer le Kanban avec un design moderne
  4. Ajouter drag & drop entre les colonnes
  5. Créer les formulaires de tâches

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