Added LDAP config and auth

client/src/components/layout/UserAvatarMenu.jsx

@@ -1,16 +1,18 @@
 import { Avatar, Menu, Portal, Box } from "@chakra-ui/react";
 import { NavLink } from "react-router-dom";
-
+import useAuthStore from "../../store/authStore";
 
 export default function UserAvatarMenu({ name, avatar }) {
+	const { logout } = useAuthStore();
+
 	return (
 		<Menu.Root>
 			<Menu.Trigger focusRing="none">
 				<Box
-						rounded="full" 
-						tabIndex={0}
-						_hover={{ boxShadow: "0 0 0 2px rgb(102, 122, 182)" }}
-						cursor="pointer"
+					rounded="full"
+					tabIndex={0}
+					_hover={{ boxShadow: "0 0 0 2px rgb(102, 122, 182)" }}
+					cursor="pointer"
 				>
 					<Avatar.Root shape="full">
 						<Avatar.Fallback name={name} />
@@ -20,17 +22,24 @@ export default function UserAvatarMenu({ name, avatar }) {
 			</Menu.Trigger>
 			<Portal>
 				{/* zIndex: overlay = 1300 */}
-				<Menu.Positioner zIndex="overlay"> 
+				<Menu.Positioner zIndex="overlay">
 					<Menu.Content>
 						<Menu.Item value="settings" as={NavLink} to={"/settings"}>
 							Settings
 						</Menu.Item>
-						<Menu.Item value="logout" onClick={() => console.log("Log out triggered")}>
+
+						{/* Replaced console.log with the Zustand logout action */}
+						<Menu.Item
+							value="logout"
+							onClick={logout}
+							color="red.600"
+							_dark={{ color: "red.400" }}
+						>
 							Logout
 						</Menu.Item>
 					</Menu.Content>
 				</Menu.Positioner>
 			</Portal>
 		</Menu.Root>
-		);
+	);
 }