feat: add logout functionality to navigation component

- Integrated logout feature in the navigation dropdown using authClient.
- Implemented toast notifications for successful logout and error handling.
- Redirected users to the login page post-logout for improved user experience.

components/layout/navigation.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import Link from "next/link";
-import { usePathname } from "next/navigation";
+import { usePathname, useRouter } from "next/navigation";
 import { Button } from "@/components/ui/button";
 import { ThemeToggle } from "@/components/layout/theme-toggle";
 import {
@@ -17,6 +17,8 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
+import { authClient } from "@/clients";
+import { useToast } from "@/hooks/use-toast";
 
 interface NavigationProps {
   userInfo?: {
@@ -28,6 +30,27 @@ interface NavigationProps {
 
 export function Navigation({ userInfo }: NavigationProps = {}) {
   const pathname = usePathname();
+  const router = useRouter();
+  const { toast } = useToast();
+
+  const handleLogout = async () => {
+    try {
+      await authClient.logout();
+      toast({
+        title: "Déconnexion réussie",
+        description: "Vous avez été déconnecté avec succès.",
+      });
+      // Rediriger vers la page de login après déconnexion
+      router.push("/login");
+    } catch (error: any) {
+      console.error("Logout failed:", error);
+      toast({
+        title: "Erreur de déconnexion",
+        description: "Erreur lors de la déconnexion. Veuillez réessayer.",
+        variant: "destructive",
+      });
+    }
+  };
 
   const navItems = [
     {
@@ -106,11 +129,12 @@ export function Navigation({ userInfo }: NavigationProps = {}) {
                     Mon compte
                   </Link>
                 </DropdownMenuItem>
-                <DropdownMenuItem asChild>
-                  <Link href="/login" className="flex items-center gap-2">
-                    <User className="h-4 w-4" />
-                    Se déconnecter
-                  </Link>
+                <DropdownMenuItem
+                  onClick={handleLogout}
+                  className="flex items-center gap-2"
+                >
+                  <User className="h-4 w-4" />
+                  Se déconnecter
                 </DropdownMenuItem>
               </DropdownMenuContent>
             </DropdownMenu>