From fb720c8c421321733963dcfa89fe46fe575ebff0 Mon Sep 17 00:00:00 2001 From: Karmaa Date: Sun, 9 Mar 2025 14:06:07 -0500 Subject: [PATCH] Fixed multi-line command issues with switching between split and not split. --- src/Terminal.jsx | 67 ++++++++++++++++++++++++------------------ src/backend/server.cjs | 4 +-- 2 files changed, 39 insertions(+), 32 deletions(-) diff --git a/src/Terminal.jsx b/src/Terminal.jsx index b26e8f90..04e5f72d 100644 --- a/src/Terminal.jsx +++ b/src/Terminal.jsx @@ -16,9 +16,7 @@ export const NewTerminal = forwardRef(({ hostConfig, isVisible }, ref) => { const terminalContainer = terminalRef.current; const parentContainer = terminalContainer?.parentElement; - if (!parentContainer || !isVisible) return; - - void parentContainer.offsetHeight; + if (!parentContainer || parentContainer.clientWidth === 0) return; const parentWidth = parentContainer.clientWidth; const parentHeight = parentContainer.clientHeight; @@ -26,12 +24,13 @@ export const NewTerminal = forwardRef(({ hostConfig, isVisible }, ref) => { terminalContainer.style.width = `${parentWidth}px`; terminalContainer.style.height = `${parentHeight}px`; - fitAddon.current.fit(); - - if (socketRef.current && terminalInstance.current) { - const { cols, rows } = terminalInstance.current; - socketRef.current.emit("resize", { cols, rows }); - } + requestAnimationFrame(() => { + fitAddon.current.fit(); + if (socketRef.current && terminalInstance.current) { + const { cols, rows } = terminalInstance.current; + socketRef.current.emit("resize", { cols, rows }); + } + }); }; useImperativeHandle(ref, () => ({ @@ -50,7 +49,6 @@ export const NewTerminal = forwardRef(({ hostConfig, isVisible }, ref) => { }, fontSize: 14, scrollback: 1000, - fontFamily: 'monospace', ignoreBracketedPasteMode: true, }); @@ -86,24 +84,29 @@ export const NewTerminal = forwardRef(({ hostConfig, isVisible }, ref) => { terminalInstance.current.write(decoder.decode(new Uint8Array(data))); }); + let isPasting = false; + terminalInstance.current.onData((data) => { socketRef.current.emit("data", data); }); terminalInstance.current.attachCustomKeyEventHandler((event) => { - if ( - (event.ctrlKey && event.key === "v") || - (event.metaKey && event.key === "v") || - (event.shiftKey && event.key === "Insert") - ) { - navigator.clipboard - .readText() - .then((text) => { - socketRef.current.emit("data", text); - }) - .catch((err) => { - console.error("Failed to read clipboard contents:", err); - }); + console.log("Event caled"); + if (isPasting) return; + + isPasting = true; + setTimeout(() => { + isPasting = false; + }, 200); + + if ((event.ctrlKey || event.metaKey) && event.key === "v") { + event.preventDefault(); + + navigator.clipboard.readText().then((text) => { + socketRef.current.emit("data", text); + }).catch((err) => { + console.error("Failed to read clipboard contents:", err); + }); return false; } return true; @@ -129,20 +132,21 @@ export const NewTerminal = forwardRef(({ hostConfig, isVisible }, ref) => { }, [hostConfig]); useEffect(() => { - if (isVisible) { - resizeTerminal(); - } + resizeTerminal(); }, [isVisible]); useEffect(() => { const terminalContainer = terminalRef.current; if (!terminalContainer) return; + const parentContainer = terminalContainer.parentElement; + if (!parentContainer) return; + const observer = new ResizeObserver(() => { resizeTerminal(); }); - observer.observe(terminalContainer); + observer.observe(parentContainer); return () => { observer.disconnect(); @@ -153,7 +157,12 @@ export const NewTerminal = forwardRef(({ hostConfig, isVisible }, ref) => {
); }); @@ -168,4 +177,4 @@ NewTerminal.propTypes = { port: PropTypes.string.isRequired, }).isRequired, isVisible: PropTypes.bool.isRequired, -}; \ No newline at end of file +}; diff --git a/src/backend/server.cjs b/src/backend/server.cjs index 03b07ed3..49fef97c 100644 --- a/src/backend/server.cjs +++ b/src/backend/server.cjs @@ -46,11 +46,10 @@ io.on("connection", (socket) => { socket.emit("error", err.message); return; } - stream = newStream; + // Set initial terminal size stream.setWindow(rows, cols, rows * 100, cols * 100); - console.log(`Initial terminal size: cols=${cols}, rows=${rows}`); // Pipe SSH output to client stream.on("data", function (data) { @@ -71,7 +70,6 @@ io.on("connection", (socket) => { socket.on("resize", ({ cols, rows }) => { if (stream && stream.setWindow) { stream.setWindow(rows, cols, rows * 100, cols * 100); - console.log(`Terminal resized: cols=${cols}, rows=${rows}`); } });