Mirrors/ProxMenux
1
0
Fork 0
mirror of https://github.com/MacRimi/ProxMenux.git synced 2025-12-15 08:36:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update terminal-panel.tsx

Browse Source
This commit is contained in:
MacRimi
2025-11-24 17:29:38 +01:00
parent 9955418a8e
commit fec95c91f8
1 changed files with 16 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
AppImage/components/terminal-panel.tsx
View File

@@ -166,7 +166,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
isMobile, isMobile,
layout, layout,
terminalHeight, terminalHeight,
shouldShowHandle: !isMobile && terminals.length > 0, shouldShowHandle: window.innerWidth >= 640 && terminals.length > 0,
}) })
}, [terminals.length, isMobile, layout, terminalHeight]) }, [terminals.length, isMobile, layout, terminalHeight])
@@ -177,8 +177,8 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
terminalHeight, terminalHeight,
}) })
if (isMobile) { if (window.innerWidth < 640) {
console.log("[v0] Resize blocked - isMobile is true") console.log("[v0] Resize blocked - pantalla muy pequeña")
return return
} }
@@ -192,7 +192,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
const handleMove = (moveEvent: MouseEvent) => { const handleMove = (moveEvent: MouseEvent) => {
const deltaY = moveEvent.clientY - startY const deltaY = moveEvent.clientY - startY
const newHeight = Math.max(200, Math.min(1200, startHeight + deltaY)) const newHeight = Math.max(200, Math.min(2400, startHeight + deltaY))
console.log("[v0] Moving", { clientY: moveEvent.clientY, deltaY, newHeight }) console.log("[v0] Moving", { clientY: moveEvent.clientY, deltaY, newHeight })
setTerminalHeight(newHeight) setTerminalHeight(newHeight)
@@ -333,7 +333,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
}, [terminals, isMobile]) }, [terminals, isMobile])
useEffect(() => { useEffect(() => {
if (isMobile) return if (window.innerWidth < 640) return
terminals.forEach((terminal) => { terminals.forEach((terminal) => {
if (terminal.term && terminal.fitAddon && terminal.isConnected) { if (terminal.term && terminal.fitAddon && terminal.isConnected) {
@@ -366,7 +366,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
import("xterm/css/xterm.css"), import("xterm/css/xterm.css"),
]).then(([Terminal, FitAddon]) => [Terminal, FitAddon]) ]).then(([Terminal, FitAddon]) => [Terminal, FitAddon])
const fontSize = window.innerWidth < 768 ? 12 : 16 const fontSize = window.innerWidth < 768 ? 10 : 14
const term = new TerminalClass({ const term = new TerminalClass({
rendererType: "dom", rendererType: "dom",
@@ -656,7 +656,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
> >
{isMobile ? ( {isMobile ? (
<Tabs value={activeTerminalId} onValueChange={setActiveTerminalId} className="h-full flex flex-col"> <Tabs value={activeTerminalId} onValueChange={setActiveTerminalId} className="h-full flex flex-col">
<TabsList className="w-full justify-start bg-zinc-900 rounded-none border-b border-zinc-800"> <TabsList className="w-full justify-start bg-zinc-900 rounded-none border-b border-zinc-800 overflow-x-auto">
{terminals.map((terminal) => ( {terminals.map((terminal) => (
<TabsTrigger key={terminal.id} value={terminal.id} className="relative"> <TabsTrigger key={terminal.id} value={terminal.id} className="relative">
{terminal.title} {terminal.title}
@@ -683,7 +683,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
> >
<div <div
ref={(el) => (containerRefs.current[terminal.id] = el)} ref={(el) => (containerRefs.current[terminal.id] = el)}
className="w-full h-full bg-black overflow-hidden" className="w-full h-full bg-black overflow-x-auto overflow-y-hidden"
/> />
</TabsContent> </TabsContent>
))} ))}
@@ -724,17 +724,17 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
)} )}
</div> </div>
{!isMobile && terminals.length > 0 && ( {!isMobile && terminals.length > 1 && (
<div <div
onMouseDown={handleResizeStart} onMouseDown={handleResizeStart}
onClick={() => console.log("[v0] === HANDLE CLICKED ===")} onClick={() => console.log("[v0] Handle clicked")}
onMouseEnter={() => console.log("[v0] Mouse ENTERED resize handle")} onPointerDown={() => console.log("[v0] Handle pointer down")}
onMouseLeave={() => console.log("[v0] Mouse LEFT resize handle")} onMouseEnter={() => console.log("[v0] Mouse entered handle area")}
onPointerDown={() => console.log("[v0] === POINTER DOWN on handle ===")} onMouseLeave={() => console.log("[v0] Mouse left handle area")}
className="flex h-3 w-full cursor-row-resize items-center justify-center bg-muted/50 hover:bg-muted transition-colors" className="hidden sm:flex items-center justify-center h-3 bg-zinc-800/50 hover:bg-zinc-700/50 cursor-row-resize border-y border-zinc-700/50 transition-colors"
style={{ touchAction: "none", userSelect: "none" }} style={{ touchAction: "none" }}
> >
<GripHorizontal className="h-4 w-4 text-muted-foreground pointer-events-none" /> <GripHorizontal className="h-3 w-3 text-zinc-500 pointer-events-none" />
</div> </div>
)} )}