feat: ajout du bouton de déconnexion dans la sidebar

src/components/layout/Sidebar.tsx

@@ -1,7 +1,8 @@
-import { BookOpen, Home, Library, Settings } from "lucide-react";
+import { BookOpen, Home, Library, Settings, LogOut } from "lucide-react";
 import Link from "next/link";
-import { usePathname } from "next/navigation";
+import { usePathname, useRouter } from "next/navigation";
 import { cn } from "@/lib/utils";
+import { authService } from "@/lib/services/auth.service";
 
 interface SidebarProps {
   isOpen: boolean;
@@ -9,6 +10,12 @@ interface SidebarProps {
 
 export function Sidebar({ isOpen }: SidebarProps) {
   const pathname = usePathname();
+  const router = useRouter();
+
+  const handleLogout = () => {
+    authService.logout();
+    router.push("/login");
+  };
 
   const navigation = [
     {
@@ -26,11 +33,11 @@ export function Sidebar({ isOpen }: SidebarProps) {
   return (
     <aside
       className={cn(
-        "fixed left-0 top-14 z-30 h-[calc(100vh-3.5rem)] w-64 border-r border-border/40 bg-background transition-transform duration-300 ease-in-out",
+        "fixed left-0 top-14 z-30 h-[calc(100vh-3.5rem)] w-64 border-r border-border/40 bg-background transition-transform duration-300 ease-in-out flex flex-col",
         isOpen ? "translate-x-0" : "-translate-x-full"
       )}
     >
-      <div className="space-y-4 py-4">
+      <div className="flex-1 space-y-4 py-4">
         <div className="px-3 py-2">
           <div className="space-y-1">
             <h2 className="mb-2 px-4 text-lg font-semibold tracking-tight">Navigation</h2>
@@ -66,6 +73,17 @@ export function Sidebar({ isOpen }: SidebarProps) {
           </div>
         </div>
       </div>
+
+      {/* Bouton de déconnexion */}
+      <div className="p-3 border-t border-border/40">
+        <button
+          onClick={handleLogout}
+          className="flex w-full items-center rounded-lg px-3 py-2 text-sm font-medium text-destructive hover:bg-destructive/10 hover:text-destructive"
+        >
+          <LogOut className="mr-2 h-4 w-4" />
+          Se déconnecter
+        </button>
+      </div>
     </aside>
   );
 }