diff --git a/src/ui/desktop/navigation/tabs/TabDropdown.tsx b/src/ui/desktop/navigation/tabs/TabDropdown.tsx index 3d006c9f..e1c56bc8 100644 --- a/src/ui/desktop/navigation/tabs/TabDropdown.tsx +++ b/src/ui/desktop/navigation/tabs/TabDropdown.tsx @@ -18,12 +18,13 @@ import { Network as SshManagerIcon, User as UserIcon, Network, + X, } from "lucide-react"; import { useTabs, type Tab } from "@/ui/desktop/navigation/tabs/TabContext.tsx"; import { useTranslation } from "react-i18next"; export function TabDropdown(): React.ReactElement { - const { tabs, currentTab, setCurrentTab } = useTabs(); + const { tabs, currentTab, setCurrentTab, removeTab } = useTabs(); const { t } = useTranslation(); const getTabIcon = (tabType: Tab["type"]) => { @@ -83,6 +84,16 @@ export function TabDropdown(): React.ReactElement { setCurrentTab(tabId); }; + const handleCloseTab = ( + e: React.MouseEvent, + tabId: number, + tabType: Tab["type"], + ) => { + e.stopPropagation(); + if (tabType === "home") return; + removeTab(tabId); + }; + return ( @@ -100,6 +111,7 @@ export function TabDropdown(): React.ReactElement { > {tabs.map((tab) => { const isActive = tab.id === currentTab; + const canClose = tab.type !== "home"; return ( {getTabIcon(tab.type)} {getTabDisplayTitle(tab)} - {isActive && ( -
+ {canClose && ( + )} );