import { useState } from "react"; import { mutate } from "swr"; import Link from "next/link"; import { useRouter } from "next/router"; import { observer } from "mobx-react-lite"; import { useTheme } from "next-themes"; import { ChevronLeft, LogOut, MoveLeft, Plus, UserPlus } from "lucide-react"; // hooks import { useApplication, useUser, useWorkspace } from "hooks/store"; import useToast from "hooks/use-toast"; // ui import { Tooltip } from "@plane/ui"; // constants import { PROFILE_ACTION_LINKS } from "constants/profile"; const WORKSPACE_ACTION_LINKS = [ { key: "create-workspace", Icon: Plus, label: "Create workspace", href: "/create-workspace", }, { key: "invitations", Icon: UserPlus, label: "Invitations", href: "/invitations", }, ]; export const ProfileLayoutSidebar = observer(() => { // states const [isSigningOut, setIsSigningOut] = useState(false); // router const router = useRouter(); // next themes const { setTheme } = useTheme(); // toast const { setToastAlert } = useToast(); // store hooks const { theme: { sidebarCollapsed, toggleSidebar }, } = useApplication(); const { currentUser, currentUserSettings, signOut } = useUser(); const { workspaces } = useWorkspace(); const workspacesList = Object.values(workspaces ?? {}); // redirect url for normal mode const redirectWorkspaceSlug = currentUserSettings?.workspace?.last_workspace_slug || currentUserSettings?.workspace?.fallback_workspace_slug || ""; const handleSignOut = async () => { setIsSigningOut(true); await signOut() .then(() => { mutate("CURRENT_USER_DETAILS", null); setTheme("system"); router.push("/"); }) .catch(() => setToastAlert({ type: "error", title: "Error!", message: "Failed to sign out. Please try again.", }) ) .finally(() => setIsSigningOut(false)); }; return (
{!sidebarCollapsed && (

Profile settings

)}
{!sidebarCollapsed && (
Your account
)}
{PROFILE_ACTION_LINKS.map((link) => { if (link.key === "change-password" && currentUser?.is_password_autoset) return null; return (
{} {!sidebarCollapsed && link.label}
); })}
{!sidebarCollapsed && (
Workspaces
)} {workspacesList && workspacesList.length > 0 && (
{workspacesList.map((workspace) => ( {workspace?.logo && workspace.logo !== "" ? ( Workspace Logo ) : ( workspace?.name?.charAt(0) ?? "..." )} {!sidebarCollapsed && (

{workspace.name}

)}
))}
)}
{WORKSPACE_ACTION_LINKS.map((link) => (
{} {!sidebarCollapsed && link.label}
))}
); });