Added server.tsx and make it work with tab system
This commit is contained in:
@@ -37,16 +37,14 @@ export function Host({ host }: HostProps): React.ReactElement {
|
||||
const tags = Array.isArray(host.tags) ? host.tags : [];
|
||||
const hasTags = tags.length > 0;
|
||||
|
||||
const title = host.name?.trim() ? host.name : `${host.username}@${host.ip}:${host.port}`;
|
||||
|
||||
const handleTerminalClick = () => {
|
||||
console.log('Terminal button clicked for host:', host);
|
||||
const title = host.name?.trim() ? host.name : `${host.username}@${host.ip}:${host.port}`;
|
||||
console.log('Creating terminal tab with title:', title);
|
||||
const tabId = addTab({
|
||||
type: 'terminal',
|
||||
title,
|
||||
hostConfig: host,
|
||||
});
|
||||
console.log('Created terminal tab with ID:', tabId);
|
||||
addTab({ type: 'terminal', title, hostConfig: host });
|
||||
};
|
||||
|
||||
const handleServerClick = () => {
|
||||
addTab({ type: 'server', title, hostConfig: host });
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -59,7 +57,7 @@ export function Host({ host }: HostProps): React.ReactElement {
|
||||
{host.name || host.ip}
|
||||
</p>
|
||||
<ButtonGroup className="flex-shrink-0">
|
||||
<Button variant="outline" className="!px-2 border-1 border-[#303032]">
|
||||
<Button variant="outline" className="!px-2 border-1 border-[#303032]" onClick={handleServerClick}>
|
||||
<Server/>
|
||||
</Button>
|
||||
<Button
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import React from "react";
|
||||
import {ButtonGroup} from "@/components/ui/button-group.tsx";
|
||||
import {Button} from "@/components/ui/button.tsx";
|
||||
import {Home, SeparatorVertical, X} from "lucide-react";
|
||||
import {Home, SeparatorVertical, X, Terminal as TerminalIcon, Server as ServerIcon} from "lucide-react";
|
||||
|
||||
interface TabProps {
|
||||
tabType: string;
|
||||
@@ -31,7 +31,8 @@ export function Tab({tabType, title, isActive, onActivate, onClose, onSplit, can
|
||||
);
|
||||
}
|
||||
|
||||
if (tabType === "terminal") {
|
||||
if (tabType === "terminal" || tabType === "server") {
|
||||
const isServer = tabType === 'server';
|
||||
return (
|
||||
<ButtonGroup>
|
||||
<Button
|
||||
@@ -40,7 +41,8 @@ export function Tab({tabType, title, isActive, onActivate, onClose, onSplit, can
|
||||
onClick={onActivate}
|
||||
disabled={disableActivate}
|
||||
>
|
||||
{title || "Terminal"}
|
||||
{isServer ? <ServerIcon className="mr-1 h-4 w-4"/> : <TerminalIcon className="mr-1 h-4 w-4"/>}
|
||||
{title || (isServer ? 'Server' : 'Terminal')}
|
||||
</Button>
|
||||
{canSplit && (
|
||||
<Button
|
||||
|
||||
@@ -51,11 +51,13 @@ export function TopNavbar({isTopbarOpen, setIsTopbarOpen}: TopNavbarProps): Reac
|
||||
const isActive = tab.id === currentTab;
|
||||
const isSplit = Array.isArray(allSplitScreenTab) && allSplitScreenTab.includes(tab.id);
|
||||
const isTerminal = tab.type === 'terminal';
|
||||
const isServer = tab.type === 'server';
|
||||
const isSshManager = tab.type === 'ssh_manager';
|
||||
// Old logic port:
|
||||
const isSplitButtonDisabled = (isActive && !isSplitScreenActive) || ((allSplitScreenTab?.length || 0) >= 3 && !isSplit);
|
||||
// Split availability
|
||||
const isSplittable = isTerminal || isServer;
|
||||
// Disable split entirely when on Home or SSH Manager
|
||||
const disableSplit = isSplitButtonDisabled || isActive || currentTabIsHome || currentTabIsSshManager || isSshManager;
|
||||
const isSplitButtonDisabled = (isActive && !isSplitScreenActive) || ((allSplitScreenTab?.length || 0) >= 3 && !isSplit);
|
||||
const disableSplit = !isSplittable || isSplitButtonDisabled || isActive || currentTabIsHome || currentTabIsSshManager;
|
||||
const disableActivate = isSplit || ((tab.type === 'home' || tab.type === 'ssh_manager') && isSplitScreenActive);
|
||||
const disableClose = (isSplitScreenActive && isActive) || isSplit;
|
||||
return (
|
||||
@@ -65,10 +67,10 @@ export function TopNavbar({isTopbarOpen, setIsTopbarOpen}: TopNavbarProps): Reac
|
||||
title={tab.title}
|
||||
isActive={isActive}
|
||||
onActivate={() => handleTabActivate(tab.id)}
|
||||
onClose={isTerminal || isSshManager ? () => handleTabClose(tab.id) : undefined}
|
||||
onSplit={isTerminal ? () => handleTabSplit(tab.id) : undefined}
|
||||
canSplit={isTerminal}
|
||||
canClose={isTerminal || isSshManager}
|
||||
onClose={isTerminal || isServer || isSshManager ? () => handleTabClose(tab.id) : undefined}
|
||||
onSplit={isSplittable ? () => handleTabSplit(tab.id) : undefined}
|
||||
canSplit={isSplittable}
|
||||
canClose={isTerminal || isServer || isSshManager}
|
||||
disableActivate={disableActivate}
|
||||
disableSplit={disableSplit}
|
||||
disableClose={disableClose}
|
||||
@@ -81,7 +83,7 @@ export function TopNavbar({isTopbarOpen, setIsTopbarOpen}: TopNavbarProps): Reac
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setIsTopbarOpen(false)}
|
||||
className="w-[28px] h-[28]"
|
||||
className="w-[28px] h-[28px]"
|
||||
>
|
||||
<ChevronUpIcon/>
|
||||
</Button>
|
||||
|
||||
Reference in New Issue
Block a user