diff --git a/AppImage/components/script-terminal-modal.tsx b/AppImage/components/script-terminal-modal.tsx index 76d4a67..b2cc1e6 100644 --- a/AppImage/components/script-terminal-modal.tsx +++ b/AppImage/components/script-terminal-modal.tsx @@ -6,7 +6,16 @@ import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog" import { Button } from "@/components/ui/button" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" -import { Loader2, Activity, GripHorizontal } from "lucide-react" +import { + Loader2, + Activity, + GripHorizontal, + ArrowUp, + ArrowDown, + ArrowLeft, + ArrowRight, + CornerDownLeft, +} from "lucide-react" import "xterm/css/xterm.css" import { API_PORT } from "@/lib/api-config" @@ -407,13 +416,11 @@ export function ScriptTerminalModal({ e.preventDefault() e.stopPropagation() - setIsResizing(true) - const startY = "clientY" in e ? e.clientY : e.touches[0].clientY + const startY = "touches" in e ? e.touches[0].clientY : e.clientY const startHeight = modalHeight const handleMove = (moveEvent: MouseEvent | TouchEvent) => { - moveEvent.preventDefault() - const currentY = moveEvent instanceof MouseEvent ? moveEvent.clientY : moveEvent.touches[0].clientY + const currentY = "touches" in moveEvent ? moveEvent.touches[0].clientY : moveEvent.clientY const deltaY = currentY - startY const newHeight = Math.max(300, Math.min(2400, startHeight + deltaY)) @@ -436,51 +443,26 @@ export function ScriptTerminalModal({ } const handleEnd = () => { - setIsResizing(false) - - localStorage.setItem("scriptModalHeight", modalHeight.toString()) - - if (fitAddonRef.current && termRef.current && wsRef.current?.readyState === WebSocket.OPEN) { - setTimeout(() => { - if (fitAddonRef.current && termRef.current) { - fitAddonRef.current.fit() - wsRef.current?.send( - JSON.stringify({ - type: "resize", - cols: termRef.current.cols, - rows: termRef.current.rows, - }), - ) - } - }, 50) - } - - document.removeEventListener("mousemove", handleMove) - document.removeEventListener("touchmove", handleMove) + document.removeEventListener("mousemove", handleMove as any) document.removeEventListener("mouseup", handleEnd) + document.removeEventListener("touchmove", handleMove as any) document.removeEventListener("touchend", handleEnd) - resizeHandlersRef.current = { - handleMouseMove: null, - handleMouseUp: null, - handleTouchMove: null, - handleTouchEnd: null, - } - } - - resizeHandlersRef.current = { - handleMouseMove: handleMove as any, - handleMouseUp: handleEnd, - handleTouchMove: handleMove as any, - handleTouchEnd: handleEnd, + localStorage.setItem("scriptModalHeight", modalHeight.toString()) } document.addEventListener("mousemove", handleMove as any) - document.addEventListener("touchmove", handleMove as any, { passive: false }) document.addEventListener("mouseup", handleEnd) + document.addEventListener("touchmove", handleMove as any, { passive: false }) document.addEventListener("touchend", handleEnd) } + const sendCommand = (command: string) => { + if (wsRef.current?.readyState === WebSocket.OPEN) { + wsRef.current.send(JSON.stringify({ type: "input", data: command })) + } + } + return ( <> @@ -512,90 +494,118 @@ export function ScriptTerminalModal({ )} - {(isTablet || (!isMobile && !isTablet)) && ( -
- -
- )} - {(isMobile || isTablet) && (
)} + {(isTablet || (!isMobile && !isTablet)) && ( +
+ +
+ )} +