import { useState, useEffect, useRef } from "react"; import { Link, useNavigate } from "react-router-dom"; import { toast } from "react-hot-toast"; import { useTranslation } from "react-i18next"; // for multilinguality const Sidebar = () => { const { t } = useTranslation(); // for multilinguality const navigate = useNavigate(); // Hook for programmatic navigation const [userMenuOpen, setUserMenuOpen] = useState(false); const menuRef = useRef(); // Show loading toast and perform logout const handleLogout = () => { const loadingToast = toast.loading(t("sidebar_logging_out")); // Simulate a delay (for example, network request) setTimeout(() => { // Remove the token from localStorage localStorage.removeItem("token"); localStorage.removeItem("username"); localStorage.removeItem("expiresIn"); // Redirect user to the homepage navigate("/"); // Show success toast after logout toast.update(loadingToast, { render: t("sidebar_logged_out"), type: "success", isLoading: false, autoClose: 2000, }); }, 1500); }; // Close dropdown on outside click useEffect(() => { const handleClickOutside = (e) => { if (menuRef.current && !menuRef.current.contains(e.target)) { setUserMenuOpen(false); } }; document.addEventListener("mousedown", handleClickOutside); return () => document.removeEventListener("mousedown", handleClickOutside); }, []); return ( <> ); }; export default Sidebar;