"use client"; import { Cloud, HardDrive, Plus } from "@/components/icons/platform-icons"; import { OsIcon } from "@/components/icons/OsIcon"; import { DEVICE_ICONS, FILE_SIDEBAR_ICONS } from "@/components/icons/icon-assets"; import { cn } from "@/lib/utils"; import { useCurrentUser } from "@/hooks/useCurrentUser"; import { normalizePathForBackend } from "@/modules/files/components/file-manager-presenters"; import { FILES_MENU_SHELL, FILES_PANEL_SHELL } from "@/modules/files/components/file-manager-surface"; import { Users, Trash2, EjectIcon } from "@/components/icons/platform-icons"; import { useRef, useState, useEffect, type ReactNode } from "react"; import { FEATURE_FLAGS } from "@/lib/shared/feature-flags"; export type FileManagerSidebarItem = { name: string; icon: ReactNode; path: string[]; }; export type RemovableSidebarItem = FileManagerSidebarItem & { driveId: string; isMounted: boolean; }; export type FileManagerSidebarSection = { title: string; items: FileManagerSidebarItem[]; }; export type CloudSidebarItem = FileManagerSidebarItem & { accountEmail: string }; type SidebarProps = { currentPath: string[]; isSharedView: boolean; isTrashView: boolean; locationItems: FileManagerSidebarItem[]; cloudItems: CloudSidebarItem[]; removableItems: RemovableSidebarItem[]; sidebarSections: FileManagerSidebarSection[]; storageUsagePercent: number; storageUsageText: string; onNavigateToPath: (path: string[]) => void; onOpenNetworkDialog: () => void; onOpenGoogleDriveDialog: () => void; onOpenUsbDialog: () => void; onMountDrive: (driveId: string) => void; onEjectDrive: (driveId: string) => void; }; function isPathActive(itemPath: string[], currentPath: string[]): boolean { return JSON.stringify(normalizePathForBackend(itemPath)) === JSON.stringify(currentPath); } export function FileManagerSidebar({ currentPath, isSharedView, isTrashView, locationItems, cloudItems, removableItems, sidebarSections, storageUsagePercent, storageUsageText, onNavigateToPath, onOpenNetworkDialog, onOpenGoogleDriveDialog, onOpenUsbDialog, onMountDrive, onEjectDrive, }: SidebarProps) { const currentUserQuery = useCurrentUser(); const isDemoMode = currentUserQuery.data?.isDemoMode ?? false; const [addMenuOpen, setAddMenuOpen] = useState(false); const addMenuRef = useRef(null); useEffect(() => { if (!addMenuOpen) return; function handleClickOutside(e: MouseEvent) { if (addMenuRef.current && !addMenuRef.current.contains(e.target as Node)) { setAddMenuOpen(false); } } document.addEventListener("mousedown", handleClickOutside); return () => document.removeEventListener("mousedown", handleClickOutside); }, [addMenuOpen]); return ( ); }