Update terminal-panel.tsx

This commit is contained in:
MacRimi
2025-11-24 12:10:07 +01:00
parent 498ad280e0
commit f32dba72b4

View File

@@ -149,11 +149,12 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
const containerRefs = useRef<{ [key: string]: HTMLDivElement | null }>({}) const containerRefs = useRef<{ [key: string]: HTMLDivElement | null }>({})
const resizeStartY = useRef(0) const resizeStartY = useRef(0)
const resizeStartHeight = useRef(terminalHeight) const resizeStartHeight = useRef(terminalHeight)
const currentDragHeight = useRef(terminalHeight)
const terminalHeightRef = useRef(terminalHeight) const terminalHeightRef = useRef(terminalHeight)
useEffect(() => { useEffect(() => {
terminalHeightRef.current = terminalHeight terminalHeightRef.current = terminalHeight
currentDragHeight.current = terminalHeight
}, [terminalHeight]) }, [terminalHeight])
useEffect(() => { useEffect(() => {
@@ -181,6 +182,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
resizeStartY.current = e.clientY resizeStartY.current = e.clientY
resizeStartHeight.current = terminalHeight resizeStartHeight.current = terminalHeight
currentDragHeight.current = terminalHeight
setIsResizing(true) setIsResizing(true)
console.log("[v0] Resize iniciado - Y:", e.clientY, "Altura:", terminalHeight) console.log("[v0] Resize iniciado - Y:", e.clientY, "Altura:", terminalHeight)
@@ -199,13 +201,21 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
const newHeight = Math.max(200, Math.min(1200, resizeStartHeight.current + deltaY)) const newHeight = Math.max(200, Math.min(1200, resizeStartHeight.current + deltaY))
console.log("[v0] DeltaY:", deltaY, "Nueva altura:", newHeight) console.log("[v0] DeltaY:", deltaY, "Nueva altura:", newHeight)
setTerminalHeight(newHeight) currentDragHeight.current = newHeight
const containers = document.querySelectorAll("[data-terminal-container]")
containers.forEach((container) => {
if (container instanceof HTMLElement) {
container.style.height = `${newHeight}px`
}
})
} }
const handleMouseUp = () => { const handleMouseUp = () => {
console.log("[v0] Mouse up - Finalizando resize") console.log("[v0] Mouse up - Finalizando resize")
setIsResizing(false) setIsResizing(false)
localStorage.setItem("terminalHeight", terminalHeight.toString()) setTerminalHeight(currentDragHeight.current)
localStorage.setItem("terminalHeight", currentDragHeight.current.toString())
} }
document.addEventListener("mousemove", handleMouseMove) document.addEventListener("mousemove", handleMouseMove)
@@ -216,7 +226,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
document.removeEventListener("mousemove", handleMouseMove) document.removeEventListener("mousemove", handleMouseMove)
document.removeEventListener("mouseup", handleMouseUp) document.removeEventListener("mouseup", handleMouseUp)
} }
}, [isResizing, terminalHeight]) }, [isResizing])
useEffect(() => { useEffect(() => {
if (terminals.length === 0) { if (terminals.length === 0) {
@@ -724,6 +734,7 @@ export const TerminalPanel: React.FC<TerminalPanelProps> = ({ websocketUrl, onCl
ref={(el) => (containerRefs.current[terminal.id] = el)} ref={(el) => (containerRefs.current[terminal.id] = el)}
onClick={() => setActiveTerminalId(terminal.id)} onClick={() => setActiveTerminalId(terminal.id)}
className="flex-1 w-full max-w-full bg-black overflow-hidden cursor-pointer" className="flex-1 w-full max-w-full bg-black overflow-hidden cursor-pointer"
data-terminal-container
/> />
</div> </div>
))} ))}