From defa47ae45dee695cea64add0bc448cbe2339f95 Mon Sep 17 00:00:00 2001
From: Xavier <xavier@mail.aethas38.duckdns.org>
Date: Wed, 7 Oct 2026 01:26:21 +0200
Subject: [PATCH] =?UTF-8?q?feat:=20cr=C3=A9ation=20de=20la=20structure=20U?=
 =?UTF-8?q?I=20du=20Dashboard=20(style=20Gemini)=20et=20liaison=20avec=20l?=
 =?UTF-8?q?a=20route=20prot=C3=A9g=C3=A9e?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 backend/main.py         |  10 +--
 frontend/dashboard.html | 138 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 144 insertions(+), 4 deletions(-)
 create mode 100644 frontend/dashboard.html

diff --git a/backend/main.py b/backend/main.py
index db9365a..bf43eb1 100644
--- a/backend/main.py
+++ b/backend/main.py
@@ -119,15 +119,17 @@ def login(login_data: LoginRequest, response: Response, db: Session = Depends(ge
 
 @app.get("/dashboard")
 def dashboard(request: Request):
-    """Route protégée : nécessite un cookie de session valide."""
+    """Route protégée : affiche l'interface principale si le cookie est valide."""
     token = request.cookies.get("session_token")
     if not token:
         return RedirectResponse(url="/login")
         
     payload = verify_token(token)
     if not payload:
-        # Si le token a expiré (60 min) ou est invalide, retour au login
         return RedirectResponse(url="/login")
         
-    username = payload.get("sub")
-    return {"message": f"Bienvenue sur le tableau de bord sécurisé, {username} !"}
\ No newline at end of file
+    frontend_path = os.path.join(os.getcwd(), "frontend", "dashboard.html")
+    if not os.path.exists(frontend_path):
+        raise HTTPException(status_code=404, detail="Interface du tableau de bord introuvable.")
+        
+    return FileResponse(frontend_path)
\ No newline at end of file
diff --git a/frontend/dashboard.html b/frontend/dashboard.html
new file mode 100644
index 0000000..2419ddd
--- /dev/null
+++ b/frontend/dashboard.html
@@ -0,0 +1,138 @@
+<!DOCTYPE html>
+<html lang="fr" class="dark">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>AETHAS38 - Dashboard</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script>
+        tailwind.config = {
+            darkMode: 'class',
+            theme: {
+                extend: {
+                    colors: {
+                        aethas: { dark: '#0f172a', panel: '#1e293b', cyan: '#06b6d4', purple: '#a855f7' }
+                    }
+                }
+            }
+        }
+    </script>
+    <!-- Vue.js 3 -->
+    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
+    <!-- Icônes Lucide (légères et modernes) -->
+    <script src="https://unpkg.com/lucide@latest"></script>
+    <style>
+        body { background-color: #0f172a; color: #f8fafc; font-family: 'Inter', sans-serif; }
+        .glass-panel { background: rgba(30, 41, 59, 0.7); backdrop-filter: blur(10px); border: 1px solid rgba(6, 182, 212, 0.2); }
+        .neon-text { background: linear-gradient(to right, #06b6d4, #a855f7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
+        /* Masquer la scrollbar pour un look épuré */
+        ::-webkit-scrollbar { width: 6px; }
+        ::-webkit-scrollbar-track { background: transparent; }
+        ::-webkit-scrollbar-thumb { background: #334155; border-radius: 10px; }
+    </style>
+</head>
+<body class="h-screen flex overflow-hidden">
+
+<div id="app" class="flex w-full h-full">
+    
+    <!-- Barre latérale (Sidebar) - Projets & Historique -->
+    <aside class="w-72 bg-aethas-panel border-r border-gray-700 flex flex-col transition-all duration-300 hidden md:flex">
+        <!-- En-tête Sidebar -->
+        <div class="p-4 border-b border-gray-700 flex items-center gap-3">
+            <img src="https://via.placeholder.com/150x150/0f172a/06b6d4?text=Logo+A38" alt="Logo" class="w-10 h-10 rounded-full border border-aethas-cyan">
+            <span class="font-bold text-lg tracking-wider neon-text">AETHAS38</span>
+        </div>
+        
+        <!-- Bouton Nouveau Projet -->
+        <div class="p-4">
+            <button class="w-full bg-gray-800 hover:bg-gray-700 text-white border border-gray-600 rounded-lg py-2.5 px-4 flex items-center gap-2 transition-colors">
+                <i data-lucide="plus" class="w-5 h-5 text-aethas-cyan"></i>
+                Nouveau Projet IA
+            </button>
+        </div>
+
+        <!-- Liste des projets (Catégories Épinglés / Récents à venir) -->
+        <div class="flex-1 overflow-y-auto p-4 space-y-6">
+            <div>
+                <h3 class="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-3">Épinglés</h3>
+                <ul class="space-y-1">
+                    <li class="p-2 hover:bg-gray-800 rounded cursor-pointer text-sm text-gray-300 truncate">Projet Assistant Code</li>
+                </ul>
+            </div>
+            <div>
+                <h3 class="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-3">Récents</h3>
+                <ul class="space-y-1">
+                    <li class="p-2 hover:bg-gray-800 rounded cursor-pointer text-sm text-gray-300 truncate">Traduction Document</li>
+                </ul>
+            </div>
+        </div>
+
+        <!-- Profil & Paramètres -->
+        <div class="p-4 border-t border-gray-700 flex justify-between items-center">
+            <div class="flex items-center gap-2">
+                <div class="w-8 h-8 rounded-full bg-gradient-to-tr from-aethas-cyan to-aethas-purple flex items-center justify-center text-sm font-bold">
+                    {{ username.charAt(0).toUpperCase() }}
+                </div>
+                <span class="text-sm font-medium">{{ username }}</span>
+            </div>
+            <button class="text-gray-400 hover:text-white"><i data-lucide="settings" class="w-5 h-5"></i></button>
+        </div>
+    </aside>
+
+    <!-- Zone Principale (Chat & Orchestration) -->
+    <main class="flex-1 flex flex-col bg-aethas-dark relative">
+        <!-- Header Mobile (visible uniquement sur petits écrans) -->
+        <header class="md:hidden flex items-center justify-between p-4 border-b border-gray-700 bg-aethas-panel">
+            <div class="flex items-center gap-2">
+                <img src="https://via.placeholder.com/150x150/0f172a/06b6d4?text=Logo+A38" alt="Logo" class="w-8 h-8 rounded-full border border-aethas-cyan">
+                <span class="font-bold text-lg neon-text">AETHAS38</span>
+            </div>
+            <button class="text-gray-300"><i data-lucide="menu" class="w-6 h-6"></i></button>
+        </header>
+
+        <!-- Zone de conversation (vide pour l'instant) -->
+        <div class="flex-1 overflow-y-auto p-4 md:p-8 flex flex-col items-center justify-center">
+            <img src="https://via.placeholder.com/150x150/0f172a/06b6d4?text=Logo+A38" alt="AETHAS38 Logo" class="w-24 h-24 mb-6 rounded-full border-2 border-aethas-cyan shadow-[0_0_15px_rgba(6,182,212,0.5)]">
+            <h2 class="text-2xl font-bold text-gray-200 mb-2">Comment puis-je vous aider aujourd'hui ?</h2>
+            <p class="text-gray-500 text-sm">L'orchestrateur Multi-IA est prêt.</p>
+        </div>
+
+        <!-- Zone de saisie (Prompt) -->
+        <div class="p-4 md:p-6 max-w-4xl mx-auto w-full">
+            <div class="relative flex items-end bg-gray-800 border border-gray-600 rounded-2xl p-2 shadow-lg focus-within:border-aethas-cyan focus-within:ring-1 focus-within:ring-aethas-cyan transition-all">
+                <button class="p-3 text-gray-400 hover:text-aethas-cyan transition-colors" title="Joindre un fichier">
+                    <i data-lucide="paperclip" class="w-5 h-5"></i>
+                </button>
+                <textarea rows="1" class="w-full bg-transparent text-gray-200 p-3 max-h-32 focus:outline-none resize-none" placeholder="Posez votre question à l'Orchestrateur..."></textarea>
+                <button class="p-3 text-aethas-cyan hover:text-white transition-colors">
+                    <i data-lucide="send" class="w-5 h-5"></i>
+                </button>
+            </div>
+            <p class="text-center text-xs text-gray-500 mt-3">AETHAS38 peut faire des erreurs. Vérifiez toujours les informations importantes.</p>
+        </div>
+    </main>
+
+</div>
+
+<script>
+    const { createApp, ref, onMounted } = Vue;
+
+    createApp({
+        setup() {
+            // Nom d'utilisateur par défaut, sera mis à jour par l'API
+            const username = ref("Admin");
+
+            onMounted(async () => {
+                // Initialisation des icônes Lucide
+                lucide.createIcons();
+                
+                // Ici, nous pourrons appeler une route API (ex: /api/me) 
+                // pour récupérer le profil utilisateur et ses projets.
+            });
+
+            return { username };
+        }
+    }).mount('#app');
+</script>
+</body>
+</html>
\ No newline at end of file