Ethica/Termix
1
0
Fork 0
mirror of https://github.com/Termix-SSH/Termix.git synced 2026-07-15 21:03:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

v2.3.0

Browse Source
This commit is contained in:
LukeGus
2026-05-28 22:29:20 -05:00
parent 33dcde0827
commit 5777351145
238 changed files with 62303 additions and 98955 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ui/shell/TabBar.tsx
+37 -17
View File
@@ -4,24 +4,27 @@ import { Separator } from "@/components/separator";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/components/dropdown-menu";
import { ChevronDown, ChevronUp, X } from "lucide-react";
import { ChevronDown, ChevronUp, RefreshCw, X } from "lucide-react";
import { tabIcon } from "@/shell/tabUtils";
import type { Tab } from "@/types/ui-types";
import type { Tab, TabType } from "@/types/ui-types";
const CONNECTION_TAB_TYPES: TabType[] = ["terminal", "rdp", "vnc", "telnet"];
export function TabBar({
tabs,
activeTabId,
onSetActiveTab,
onCloseTab,
onRefreshTab,
onReorderTabs,
}: {
tabs: Tab[];
activeTabId: string;
onSetActiveTab: (id: string) => void;
onCloseTab: (id: string) => void;
onRefreshTab: (id: string) => void;
onReorderTabs: (tabs: Tab[]) => void;
}) {
const [open, setOpen] = useState(true);
@@ -69,8 +72,8 @@ export function TabBar({
const barRect = tabBarRef.current.getBoundingClientRect();
const x = Math.max(
barRect.left,
Math.min(barRect.right - d.width, e.clientX - d.offsetX),
barRect.left + 2,
Math.min(barRect.right - d.width - 6, e.clientX - d.offsetX),
);
const y = d.barTop;
setDragPos({ x, y });
@@ -218,16 +221,33 @@ export function TabBar({
{tabIcon(tab.type)}
{tab.type !== "dashboard" && tab.label}
{tab.type !== "dashboard" && (
<button
onPointerDown={(e) => e.stopPropagation()}
onClick={(e) => {
e.stopPropagation();
onCloseTab(tab.id);
}}
className={`flex items-center justify-center size-5 md:size-4 rounded-sm transition-opacity text-muted-foreground hover:text-foreground hover:bg-muted ml-1 ${active ? "opacity-100" : "opacity-0 group-hover/tab:opacity-100"}`}
<div
className={`flex items-center gap-0.5 ml-1 ${active ? "opacity-100" : "opacity-0 group-hover/tab:opacity-100"}`}
>
<X className="size-3" />
</button>
{CONNECTION_TAB_TYPES.includes(tab.type) && (
<button
onPointerDown={(e) => e.stopPropagation()}
onClick={(e) => {
e.stopPropagation();
onRefreshTab(tab.id);
}}
title="Refresh connection"
className="flex items-center justify-center size-5 md:size-4 rounded-sm transition-colors text-muted-foreground hover:text-foreground hover:bg-muted"
>
<RefreshCw className="size-3" />
</button>
)}
<button
onPointerDown={(e) => e.stopPropagation()}
onClick={(e) => {
e.stopPropagation();
onCloseTab(tab.id);
}}
className="flex items-center justify-center size-5 md:size-4 rounded-sm transition-colors text-muted-foreground hover:text-foreground hover:bg-muted"
>
<X className="size-3" />
</button>
</div>
)}
</div>
);
@@ -273,7 +293,7 @@ export function TabBar({
<Button
variant="ghost"
size="icon"
className="h-full w-12.5 rounded-none text-muted-foreground hover:text-foreground"
className="h-full w-12.5 border-y-0 border-r-0 border-border rounded-none text-muted-foreground hover:text-foreground"
>
<ChevronDown className="size-4" />
</Button>
@@ -314,7 +334,7 @@ export function TabBar({
<Button
variant="ghost"
size="icon"
className="h-full w-12.5 rounded-none text-muted-foreground hover:text-foreground"
className="h-full w-12.5 rounded-none border-y-0 border-border text-muted-foreground hover:text-foreground"
onClick={() => setOpen((o) => !o)}
>
<ChevronUp
@@ -326,7 +346,7 @@ export function TabBar({
{!open && (
<button
onClick={() => setOpen(true)}
className="flex items-center justify-center w-full h-6 bg-sidebar border-b border-border text-muted-foreground hover:text-accent-brand hover:bg-accent-brand/5 transition-colors shrink-0"
className="flex items-center justify-center w-full h-6 bg-sidebar border-b border-border text-muted-foreground hover:text-accent-brand hover:bg-accent-brand/5 transition-colors shrink-0"
>
<ChevronDown className="size-3.5" />
</button>