Change Audiens

components/ui/Navbar.tsx

@@ -1,11 +1,12 @@
 'use client';
 
 import { ThemeToggle } from '@/components/theme-toggle';
-import { Menu, PanelLeftClose, PanelLeft } from 'lucide-react';
+import { Menu, PanelLeftClose, PanelLeft, LogOut } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { Sheet, SheetContent, SheetTrigger } from '@/components/ui/sheet';
 import SidebarContent from '@/components/ui/SidebarContent';
 import Link from 'next/link';
+import { useRouter } from 'next/navigation';
 
 interface NavbarProps {
   onSidebarToggle: () => void;
@@ -13,6 +14,22 @@ interface NavbarProps {
 }
 
 const Navbar = ({ onSidebarToggle, isSidebarCollapsed }: NavbarProps) => {
+  const router = useRouter();
+
+  const handleLogout = async () => {
+    try {
+      const response = await fetch('/api/auth/logout', {
+        method: 'POST',
+      });
+
+      if (response.ok) {
+        router.push('/');
+      }
+    } catch (error) {
+      console.error('Logout error:', error);
+    }
+  };
+
   return (
     <div className="bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 border-b py-2 px-5 flex justify-between items-center z-30 sticky top-0">
       <div className="flex items-center gap-2">
@@ -48,7 +65,7 @@ const Navbar = ({ onSidebarToggle, isSidebarCollapsed }: NavbarProps) => {
           </Button>
         </div>
         
-        <Link href="/" className="flex items-center text-lg font-semibold hover:text-primary transition-colors">
+        <Link href="/dashboard" className="flex items-center text-lg font-semibold hover:text-primary transition-colors">
           <img src="/podif-icon.png" alt="PODIF Logo" className="h-6 w-auto mr-2" />
           PODIF
         </Link>
@@ -56,6 +73,15 @@ const Navbar = ({ onSidebarToggle, isSidebarCollapsed }: NavbarProps) => {
 
       <div className="flex items-center gap-4">
         <ThemeToggle />
+        <Button 
+          variant="outline" 
+          size="icon" 
+          onClick={handleLogout}
+          title="Logout"
+        >
+          <LogOut className="h-5 w-5" />
+          <span className="sr-only">Logout</span>
+        </Button>
       </div>
     </div>
   );