Added SSH manager and terminals to tab system, now I need to do the server stats

This commit is contained in:
LukeGus
2025-08-16 00:29:40 -05:00
parent 58947f4455
commit 2667af9437
17 changed files with 954 additions and 1641 deletions
+83 -11
View File
@@ -1,22 +1,94 @@
import React from "react";
import {ButtonGroup} from "@/components/ui/button-group.tsx";
import {Button} from "@/components/ui/button.tsx";
import {SeparatorVertical, X} from "lucide-react";
import {Home, SeparatorVertical, X} from "lucide-react";
export function Tab(): React.ReactElement {
return (
<div>
interface TabProps {
tabType: string;
title?: string;
isActive?: boolean;
onActivate?: () => void;
onClose?: () => void;
onSplit?: () => void;
canSplit?: boolean;
canClose?: boolean;
disableActivate?: boolean;
disableSplit?: boolean;
disableClose?: boolean;
}
export function Tab({tabType, title, isActive, onActivate, onClose, onSplit, canSplit = false, canClose = false, disableActivate = false, disableSplit = false, disableClose = false}: TabProps): React.ReactElement {
if (tabType === "home") {
return (
<Button
variant="outline"
className={`!px-2 border-1 border-[#303032] ${isActive ? '!bg-[#1d1d1f] !text-white !border-[#2d2d30]' : ''}`}
onClick={onActivate}
disabled={disableActivate}
>
<Home/>
</Button>
);
}
if (tabType === "terminal") {
return (
<ButtonGroup>
<Button variant="outline" className="!px-2 border-1 border-[#303032]">
Server Name
<Button
variant="outline"
className={`!px-2 border-1 border-[#303032] ${isActive ? '!bg-[#1d1d1f] !text-white !border-[#2d2d30]' : ''}`}
onClick={onActivate}
disabled={disableActivate}
>
{title || "Terminal"}
</Button>
<Button variant="outline" className="!px-2 border-1 border-[#303032]">
<SeparatorVertical className="w-[28px] h-[28px]" />
{canSplit && (
<Button
variant="outline"
className="!px-2 border-1 border-[#303032]"
onClick={onSplit}
disabled={disableSplit}
title={disableSplit ? 'Cannot split this tab' : 'Split'}
>
<SeparatorVertical className="w-[28px] h-[28px]" />
</Button>
)}
{canClose && (
<Button
variant="outline"
className="!px-2 border-1 border-[#303032]"
onClick={onClose}
disabled={disableClose}
>
<X/>
</Button>
)}
</ButtonGroup>
);
}
if (tabType === "ssh_manager") {
return (
<ButtonGroup>
<Button
variant="outline"
className={`!px-2 border-1 border-[#303032] ${isActive ? '!bg-[#1d1d1f] !text-white !border-[#2d2d30]' : ''}`}
onClick={onActivate}
disabled={disableActivate}
>
{title || "SSH Manager"}
</Button>
<Button variant="outline" className="!px-2 border-1 border-[#303032]">
<Button
variant="outline"
className="!px-2 border-1 border-[#303032]"
onClick={onClose}
disabled={disableClose}
>
<X/>
</Button>
</ButtonGroup>
</div>
)
);
}
return null;
}