Merge pull request 'Bug fixed Logout Sidebar' (#3) from dev/dashboard-rbac into main

Reviewed-on: #3

src/app/components/Sidebar.jsx

@@ -2,9 +2,9 @@
 import { useState, useEffect } from "react";
 import Link from "next/link";
 import { usePathname, useRouter } from "next/navigation";
-import { FileText, Moon, Sun } from "lucide-react";
-import { FaLock, FaChevronDown, FaChevronUp } from "react-icons/fa";
+import { FileText } from "lucide-react";
 import { useTheme } from "../context/ThemeContext";
+import { account } from "../lib/appwrite";
 
 const Sidebar = ({ sidebarOpen, setSidebarOpen, isCollapsed }) => {
   const pathname = usePathname();
@@ -25,10 +25,17 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen, isCollapsed }) => {
       setSidebarOpen(false);
     }
   };
-  const handleLogout = () => {
-    localStorage.removeItem("token"); // or account.deleteSession("current") if using Appwrite
-    router.push("/signup");
+  const handleLogout = async () => {
+    try {
+      await account.deleteSession("current");
+      localStorage.removeItem("token");
+      // Force a full page reload to reset all state
+      window.location.href = "/";
+    } catch (error) {
+      console.error("Logout failed:", error);
+    }
   };
+
   // ---------------logo handling in dark mode-----------------------
   // Create a separate LogoImage component for better error handling
   function LogoImage({ darkSrc, lightSrc, darkMode, className, alt }) {
@@ -71,7 +78,7 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen, isCollapsed }) => {
     >
       <div className="h-full flex flex-col border-r border-gray-200 p-4 overflow-y-auto scrollbar-hide">
         {/* Logo Section */}
-        
+
 
         {/* MENU section - Only show when not collapsed */}
         {!isCollapsed && (
@@ -87,12 +94,12 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen, isCollapsed }) => {
           <Link
             href="/dashboard"
             className={`flex items-center gap-2 p-3 rounded-md text-sm font-semibold transition-colors ${isActive("/dashboard")
-                ? darkMode
-                  ? "bg-blue-900 text-blue-200"
-                  : "bg-blue-100 text-blue-800"
-                : darkMode
-                  ? "hover:bg-gray-700 text-gray-200"
-                  : "hover:bg-gray-200"
+              ? darkMode
+                ? "bg-blue-900 text-blue-200"
+                : "bg-blue-100 text-blue-800"
+              : darkMode
+                ? "hover:bg-gray-700 text-gray-200"
+                : "hover:bg-gray-200"
               } ${isCollapsed ? 'justify-center' : ''}`}
             onClick={closeSidebarOnMobile}
           >