Update hybrid-script-monitor.tsx

This commit is contained in:
MacRimi
2025-12-01 00:38:42 +01:00
parent 216491012e
commit 88667416d8

View File

@@ -9,9 +9,8 @@ import { Label } from "@/components/ui/label"
import { ScrollArea } from "@/components/ui/scroll-area" import { ScrollArea } from "@/components/ui/scroll-area"
import { Loader2, CheckCircle2, XCircle, TerminalIcon } from "lucide-react" import { Loader2, CheckCircle2, XCircle, TerminalIcon } from "lucide-react"
import { Terminal } from "xterm" import type { Terminal } from "xterm"
import { FitAddon } from "xterm-addon-fit" import type { FitAddon } from "xterm-addon-fit"
import "xterm/css/xterm.css"
interface HybridScriptMonitorProps { interface HybridScriptMonitorProps {
sessionId: string | null sessionId: string | null
@@ -57,7 +56,12 @@ export function HybridScriptMonitor({
} }
useEffect(() => { useEffect(() => {
if (!terminalRef.current || xtermRef.current) return if (!terminalRef.current || xtermRef.current || typeof window === "undefined") return
const loadTerminal = async () => {
const { Terminal } = await import("xterm")
const { FitAddon } = await import("xterm-addon-fit")
await import("xterm/css/xterm.css")
const term = new Terminal({ const term = new Terminal({
cursorBlink: false, cursorBlink: false,
@@ -85,22 +89,21 @@ export function HybridScriptMonitor({
brightWhite: "#ffffff", brightWhite: "#ffffff",
}, },
convertEol: true, convertEol: true,
disableStdin: true, // Terminal es solo lectura disableStdin: true,
}) })
const fitAddon = new FitAddon() const fitAddon = new FitAddon()
term.loadAddon(fitAddon) term.loadAddon(fitAddon)
term.open(terminalRef.current) term.open(terminalRef.current!)
fitAddon.fit() fitAddon.fit()
xtermRef.current = term xtermRef.current = term
fitAddonRef.current = fitAddon fitAddonRef.current = fitAddon
// Ajustar terminal cuando cambia el tamaño
const resizeObserver = new ResizeObserver(() => { const resizeObserver = new ResizeObserver(() => {
fitAddon.fit() fitAddon.fit()
}) })
resizeObserver.observe(terminalRef.current) resizeObserver.observe(terminalRef.current!)
return () => { return () => {
resizeObserver.disconnect() resizeObserver.disconnect()
@@ -108,6 +111,9 @@ export function HybridScriptMonitor({
xtermRef.current = null xtermRef.current = null
fitAddonRef.current = null fitAddonRef.current = null
} }
}
loadTerminal()
}, []) }, [])
useEffect(() => { useEffect(() => {