lobstakit-cloud 1.3.13 → 1.3.14

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "lobstakit-cloud",
-  "version": "1.3.13",
-  "description": "LobstaKit Cloud — Setup wizard and management for LobstaCloud gateways",
+  "version": "1.3.14",
+  "description": "LobstaKit Cloud \u2014 Setup wizard and management for LobstaCloud gateways",
   "main": "server.js",
   "bin": {
     "lobstakit-cloud": "./bin/lobstakit.js"
@@ -12,6 +12,8 @@
   "dependencies": {
     "better-sqlite3": "^12.6.2",
     "express": "^4.21.0",
-    "http-proxy-middleware": "^3.0.0"
+    "http-proxy-middleware": "^3.0.0",
+    "node-pty": "^1.1.0",
+    "ws": "^8.19.0"
   }
-}
+}

package/public/js/manage.js

@@ -96,8 +96,8 @@ const SETTINGS_PROVIDER_FALLBACK = {
 
 let settingsProviders = SETTINGS_PROVIDER_FALLBACK;
 let currentAiSettings = null;
-let terminalHistory = [];
-let terminalHistoryIndex = -1;
+let xtermInstance = null;
+let terminalWs = null;
 
 async function logout() {
     const token = localStorage.getItem('lobstakit_token');
@@ -255,103 +255,86 @@ function escapeHtml(value) {
         .replace(/'/g, ''');
 }
 
-function appendTerminalOutput(html) {
-    const outputEl = document.getElementById('terminal-output');
-    if (!outputEl) return;
-    outputEl.insertAdjacentHTML('beforeend', html);
-    outputEl.scrollTop = outputEl.scrollHeight;
-}
-
-function setTerminalRunning(isRunning) {
-    const runBtn = document.getElementById('terminal-run-btn');
-    if (!runBtn) return;
-    runBtn.disabled = isRunning;
-    runBtn.textContent = isRunning ? 'Running...' : 'Run';
-}
-
-function terminalHistoryUp(inputEl) {
-    if (!terminalHistory.length) return;
-    if (terminalHistoryIndex <= 0) {
-        terminalHistoryIndex = 0;
-    } else {
-        terminalHistoryIndex -= 1;
-    }
-    inputEl.value = terminalHistory[terminalHistoryIndex];
-}
+function initTerminal() {
+    const container = document.getElementById('terminal-container');
+    if (!container || typeof Terminal === 'undefined') return;
+
+    // Clean up previous instance if any
+    if (terminalWs) { try { terminalWs.close(); } catch (e) {} terminalWs = null; }
+    if (xtermInstance) { try { xtermInstance.dispose(); } catch (e) {} xtermInstance = null; }
+
+    const term = new Terminal({
+        cursorBlink: true,
+        fontSize: 13,
+        fontFamily: "'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'Menlo', monospace",
+        theme: {
+            background: '#0d1117',
+            foreground: '#e6edf3',
+            cursor: '#58a6ff',
+            selectionBackground: '#264f78',
+            black: '#0d1117',
+            red: '#f85149',
+            green: '#56d364',
+            yellow: '#e3b341',
+            blue: '#58a6ff',
+            magenta: '#bc8cff',
+            cyan: '#39c5cf',
+            white: '#e6edf3'
+        },
+        allowProposedApi: true
+    });
 
-function terminalHistoryDown(inputEl) {
-    if (!terminalHistory.length) return;
-    if (terminalHistoryIndex >= terminalHistory.length - 1) {
-        terminalHistoryIndex = terminalHistory.length;
-        inputEl.value = '';
-        return;
-    }
-    terminalHistoryIndex += 1;
-    inputEl.value = terminalHistory[terminalHistoryIndex];
-}
+    const fitAddon = new FitAddon.FitAddon();
+    term.loadAddon(fitAddon);
+    term.open(container);
+    fitAddon.fit();
+    xtermInstance = term;
 
-async function runTerminalCommand() {
-    const inputEl = document.getElementById('terminal-input');
-    if (!inputEl) return;
+    // Connect WebSocket with auth token
+    const token = localStorage.getItem('lobstakit_token');
+    const proto = location.protocol === 'https:' ? 'wss:' : 'ws:';
+    const wsUrl = `${proto}//${location.host}/ws/terminal${token ? '?token=' + encodeURIComponent(token) : ''}`;
+    const ws = new WebSocket(wsUrl);
+    terminalWs = ws;
+
+    ws.onopen = () => {
+        // Send initial resize
+        ws.send(JSON.stringify({ type: 'resize', cols: term.cols, rows: term.rows }));
+    };
 
-    const command = inputEl.value.trim();
-    if (!command) return;
+    ws.onmessage = (event) => {
+        term.write(event.data);
+    };
 
-    terminalHistory.push(command);
-    terminalHistoryIndex = terminalHistory.length;
-    inputEl.value = '';
-    setTerminalRunning(true);
+    ws.onclose = () => {
+        term.write('\r\n\x1b[31m[Connection closed]\x1b[0m\r\n');
+    };
 
-    try {
-        const res = await fetch('/api/run-command', authFetchOpts({
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify({ command: command })
-        }));
-        const data = await res.json();
+    ws.onerror = () => {
+        term.write('\r\n\x1b[31m[WebSocket error]\x1b[0m\r\n');
+    };
 
-        if (!res.ok) {
-            const requestError = escapeHtml(data.error || 'Request failed');
-            appendTerminalOutput(`$ ${escapeHtml(command)}\n<span style="color:#f85149">${requestError}</span>\n\n`);
-            return;
+    term.onData((data) => {
+        if (ws.readyState === WebSocket.OPEN) {
+            ws.send(data);
         }
+    });
 
-        const stdout = escapeHtml(data.stdout || '');
-        const stderr = escapeHtml(data.stderr || '');
-        const hasError = Number(data.exitCode) !== 0;
-        const stderrBlock = stderr
-            ? (hasError ? `<span style="color:#f85149">${stderr}</span>` : stderr)
-            : '';
+    term.onResize(({ cols, rows }) => {
+        if (ws.readyState === WebSocket.OPEN) {
+            ws.send(JSON.stringify({ type: 'resize', cols, rows }));
+        }
+    });
 
-        appendTerminalOutput(`$ ${escapeHtml(command)}\n${stdout}${stderrBlock}\n\n`);
-    } catch (err) {
-        appendTerminalOutput(`$ ${escapeHtml(command)}\n<span style="color:#f85149">${escapeHtml(err.message || 'Connection error')}</span>\n\n`);
-    } finally {
-        setTerminalRunning(false);
-    }
-}
+    // Responsive resize
+    const resizeObserver = new ResizeObserver(() => {
+        try { fitAddon.fit(); } catch (e) {}
+    });
+    resizeObserver.observe(container);
 
-function initTerminal() {
-    const inputEl = document.getElementById('terminal-input');
-    const runBtn = document.getElementById('terminal-run-btn');
-    if (!inputEl || !runBtn) return;
-
-    runBtn.addEventListener('click', runTerminalCommand);
-    inputEl.addEventListener('keydown', (event) => {
-        if (event.key === 'Enter' && (event.ctrlKey || event.metaKey)) {
-            event.preventDefault();
-            runTerminalCommand();
-            return;
-        }
-        if (event.key === 'ArrowUp') {
-            event.preventDefault();
-            terminalHistoryUp(inputEl);
-            return;
-        }
-        if (event.key === 'ArrowDown') {
-            event.preventDefault();
-            terminalHistoryDown(inputEl);
-        }
+    // Clean up on page unload
+    window.addEventListener('beforeunload', () => {
+        if (terminalWs) { try { terminalWs.close(); } catch (e) {} }
     });
 }
 

package/public/manage.html

@@ -189,12 +189,11 @@
 
                     <div class="card" id="terminal-section">
                         <h3>🖥️ Terminal</h3>
-                        <div class="terminal-output" id="terminal-output" style="min-height:120px;max-height:300px;overflow-y:auto;background:#0d1117;color:#e6edf3;font-family:monospace;font-size:13px;padding:12px;border-radius:6px;margin-bottom:10px;white-space:pre-wrap;"></div>
-                        <div style="display:flex;gap:8px;">
-                            <textarea id="terminal-input" placeholder="Enter command... (Ctrl+Enter to run)" rows="2" style="flex:1;font-family:monospace;font-size:13px;color:#e6edf3;background:#0d1117;border:1px solid #30363d;padding:6px 10px;border-radius:6px;outline:none;resize:vertical;"></textarea>
-                            <button id="terminal-run-btn" class="btn btn-secondary">Run</button>
-                        </div>
+                        <div id="terminal-container" style="height:400px;background:#0d1117;border-radius:6px;overflow:hidden;"></div>
                     </div>
+                    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/xterm@5.3.0/css/xterm.css">
+                    <script src="https://cdn.jsdelivr.net/npm/xterm@5.3.0/lib/xterm.min.js"></script>
+                    <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-fit@0.10.0/lib/addon-fit.min.js"></script>
 
                     <!-- Channels Management -->
                     <div class="card" id="channels-card">

package/server.js

@@ -16,6 +16,8 @@ const crypto = require('crypto');
 const config = require('./lib/config');
 const gateway = require('./lib/gateway');
 const proxyMiddleware = require('./lib/proxy');
+const pty = require('node-pty');
+const { WebSocketServer } = require('ws');
 
 // Timing-safe string comparison to prevent timing attacks on secrets
 function timingSafeCompare(a, b) {
@@ -2257,8 +2259,92 @@ const server = app.listen(PORT, () => {
   }
 });
 
-// WebSocket upgrade support for proxy
+// ─── Interactive Terminal (xterm.js + node-pty over WebSocket) ───────────────
+
+const terminalWss = new WebSocketServer({ noServer: true });
+
+terminalWss.on('connection', (ws) => {
+  const shell = process.env.SHELL || '/bin/bash';
+  const cwd = process.env.HOME || '/root';
+  const ptyProcess = pty.spawn(shell, [], {
+    name: 'xterm-256color',
+    cols: 80,
+    rows: 24,
+    cwd: cwd,
+    env: Object.assign({}, process.env, { TERM: 'xterm-256color' })
+  });
+
+  ptyProcess.onData((data) => {
+    try { ws.send(data); } catch (e) { /* ws closed */ }
+  });
+
+  ptyProcess.onExit(() => {
+    try { ws.close(); } catch (e) { /* already closed */ }
+  });
+
+  ws.on('message', (msg) => {
+    const data = msg.toString();
+    // Check for resize messages: JSON { type: 'resize', cols, rows }
+    if (data.startsWith('{')) {
+      try {
+        const parsed = JSON.parse(data);
+        if (parsed.type === 'resize' && parsed.cols && parsed.rows) {
+          ptyProcess.resize(Math.max(1, parsed.cols), Math.max(1, parsed.rows));
+          return;
+        }
+      } catch (e) { /* not JSON, treat as input */ }
+    }
+    ptyProcess.write(data);
+  });
+
+  ws.on('close', () => {
+    try { ptyProcess.kill(); } catch (e) { /* already dead */ }
+  });
+
+  ws.on('error', () => {
+    try { ptyProcess.kill(); } catch (e) { /* already dead */ }
+  });
+});
+
+// WebSocket upgrade support — terminal + proxy
 server.on('upgrade', (req, socket, head) => {
+  const url = new URL(req.url, `http://${req.headers.host}`);
+
+  if (url.pathname === '/ws/terminal') {
+    // Auth check: require valid session token as query param
+    const token = url.searchParams.get('token');
+    const lobstaConfig = getLobstaKitConfig();
+
+    // If no password set yet, allow with setupToken
+    if (!lobstaConfig.passwordHash) {
+      if (!verifySetupToken(req)) {
+        socket.write('HTTP/1.1 401 Unauthorized\r\n\r\n');
+        socket.destroy();
+        return;
+      }
+    } else {
+      // Require valid session token
+      if (!token || !activeSessions.has(token)) {
+        socket.write('HTTP/1.1 401 Unauthorized\r\n\r\n');
+        socket.destroy();
+        return;
+      }
+      const session = activeSessions.get(token);
+      if (Date.now() - session.created > SESSION_MAX_LIFETIME_MS) {
+        activeSessions.delete(token);
+        socket.write('HTTP/1.1 401 Unauthorized\r\n\r\n');
+        socket.destroy();
+        return;
+      }
+    }
+
+    terminalWss.handleUpgrade(req, socket, head, (ws) => {
+      terminalWss.emit('connection', ws, req);
+    });
+    return;
+  }
+
+  // All other upgrades — proxy if configured
   if (config.isConfigured()) {
     proxyMiddleware.upgrade(req, socket, head);
   } else {