From 0d6d570ae8386ec9d89cab5ae56521da2db49623 Mon Sep 17 00:00:00 2001 From: MacRimi Date: Sun, 15 Mar 2026 16:27:37 +0100 Subject: [PATCH] Update terminal panel --- AppImage/components/lxc-terminal-modal.tsx | 20 +++++++++-- AppImage/components/script-terminal-modal.tsx | 23 ++++++++---- AppImage/components/terminal-panel.tsx | 26 +++++++++++--- AppImage/lib/api-config.ts | 35 ------------------- 4 files changed, 56 insertions(+), 48 deletions(-) diff --git a/AppImage/components/lxc-terminal-modal.tsx b/AppImage/components/lxc-terminal-modal.tsx index fde97047..c384b314 100644 --- a/AppImage/components/lxc-terminal-modal.tsx +++ b/AppImage/components/lxc-terminal-modal.tsx @@ -32,7 +32,7 @@ import { DialogHeader, DialogDescription } from "@/components/ui/dialog" import { Input } from "@/components/ui/input" import { Dialog as SearchDialog, DialogContent as SearchDialogContent, DialogTitle as SearchDialogTitle } from "@/components/ui/dialog" import "@xterm/xterm/css/xterm.css" -import { fetchApi, getWebSocketUrl } from "@/lib/api-config" +import { API_PORT, fetchApi } from "@/lib/api-config" interface LxcTerminalModalProps { open: boolean @@ -75,7 +75,21 @@ const proxmoxCommands = [ { cmd: "clear", desc: "Clear terminal screen" }, ] -// Use centralized getWebSocketUrl from api-config +function getWebSocketUrl(): string { + if (typeof window === "undefined") { + return "ws://localhost:8008/ws/terminal" + } + + const { protocol, hostname, port } = window.location + const isStandardPort = port === "" || port === "80" || port === "443" + const wsProtocol = protocol === "https:" ? "wss:" : "ws:" + + if (isStandardPort) { + return `${wsProtocol}//${hostname}/ws/terminal` + } else { + return `${wsProtocol}//${hostname}:${API_PORT}/ws/terminal` + } +} export function LxcTerminalModal({ open: isOpen, @@ -208,7 +222,7 @@ export function LxcTerminalModal({ fitAddonRef.current = fitAddon // Connect WebSocket to host terminal - const wsUrl = getWebSocketUrl("/ws/terminal") + const wsUrl = getWebSocketUrl() const ws = new WebSocket(wsUrl) wsRef.current = ws diff --git a/AppImage/components/script-terminal-modal.tsx b/AppImage/components/script-terminal-modal.tsx index f9f6844b..d72378c8 100644 --- a/AppImage/components/script-terminal-modal.tsx +++ b/AppImage/components/script-terminal-modal.tsx @@ -26,7 +26,7 @@ import { DropdownMenuLabel, } from "@/components/ui/dropdown-menu" import "@xterm/xterm/css/xterm.css" -import { getWebSocketUrl } from "@/lib/api-config" +import { API_PORT } from "@/lib/api-config" interface WebInteraction { type: "yesno" | "menu" | "msgbox" | "input" | "inputbox" @@ -96,7 +96,7 @@ export function ScriptTerminalModal({ wsRef.current.close() } - const wsUrl = getScriptWebSocketUrlLocal(sessionIdRef.current) + const wsUrl = getScriptWebSocketUrl(sessionIdRef.current) const ws = new WebSocket(wsUrl) wsRef.current = ws @@ -259,7 +259,7 @@ export function ScriptTerminalModal({ } }, 100) - const wsUrl = getScriptWebSocketUrlLocal(sessionIdRef.current) + const wsUrl = getScriptWebSocketUrl(sessionIdRef.current) const ws = new WebSocket(wsUrl) wsRef.current = ws @@ -493,9 +493,20 @@ export function ScriptTerminalModal({ } }, [isOpen, isComplete, attemptReconnect]) - // Use centralized getWebSocketUrl from api-config - const getScriptWebSocketUrlLocal = (sid: string): string => { - return getWebSocketUrl(`/ws/script/${sid}`) + const getScriptWebSocketUrl = (sid: string): string => { + if (typeof window === "undefined") { + return `ws://localhost:${API_PORT}/ws/script/${sid}` + } + + const { protocol, hostname, port } = window.location + const isStandardPort = port === "" || port === "80" || port === "443" + const wsProtocol = protocol === "https:" ? "wss:" : "ws:" + + if (isStandardPort) { + return `${wsProtocol}//${hostname}/ws/script/${sid}` + } else { + return `${wsProtocol}//${hostname}:${API_PORT}/ws/script/${sid}` + } } const handleInteractionResponse = (value: string) => { diff --git a/AppImage/components/terminal-panel.tsx b/AppImage/components/terminal-panel.tsx index 62404ca9..0e1ac0ff 100644 --- a/AppImage/components/terminal-panel.tsx +++ b/AppImage/components/terminal-panel.tsx @@ -2,7 +2,7 @@ import type React from "react" import { useEffect, useRef, useState } from "react" -import { API_PORT, fetchApi, getWebSocketUrl as getWebSocketUrlFromConfig, getApiUrl as getApiUrlFromConfig } from "@/lib/api-config" +import { API_PORT, fetchApi } from "@/lib/api-config" // Unificando importaciones de api-config en una sola línea con alias @/ import { Activity, Trash2, @@ -46,13 +46,31 @@ interface TerminalInstance { pingInterval?: ReturnType | null // Heartbeat interval to keep connection alive } -// Use centralized functions from api-config.ts for SSL/proxy support function getWebSocketUrl(): string { - return getWebSocketUrlFromConfig("/ws/terminal") + if (typeof window === "undefined") { + return "ws://localhost:8008/ws/terminal" + } + + const { protocol, hostname, port } = window.location + const isStandardPort = port === "" || port === "80" || port === "443" + + const wsProtocol = protocol === "https:" ? "wss:" : "ws:" + + if (isStandardPort) { + return `${wsProtocol}//${hostname}/ws/terminal` + } else { + return `${wsProtocol}//${hostname}:${API_PORT}/ws/terminal` + } } function getApiUrl(endpoint?: string): string { - return getApiUrlFromConfig(endpoint || "") + if (typeof window === "undefined") { + return "http://localhost:8008" + } + + const { protocol, hostname } = window.location + const apiProtocol = protocol === "https:" ? "https:" : "http:" + return `${apiProtocol}//${hostname}:${API_PORT}${endpoint || ""}` } const proxmoxCommands = [ diff --git a/AppImage/lib/api-config.ts b/AppImage/lib/api-config.ts index 880b4222..3bb0a36b 100644 --- a/AppImage/lib/api-config.ts +++ b/AppImage/lib/api-config.ts @@ -50,41 +50,6 @@ export function getApiUrl(endpoint: string): string { return `${baseUrl}${normalizedEndpoint}` } -/** - * Gets the base URL for WebSocket connections - * Automatically handles ws:// vs wss:// based on page protocol (SSL support) - * - * @param path - WebSocket endpoint path (e.g., '/ws/terminal') - * @returns Full WebSocket URL - */ -export function getWebSocketUrl(path: string): string { - if (typeof window === "undefined") { - return `ws://localhost:${API_PORT}${path}` - } - - const { protocol, hostname, port } = window.location - const isStandardPort = port === "" || port === "80" || port === "443" - - // Use wss:// when page is served over https:// - const wsProtocol = protocol === "https:" ? "wss:" : "ws:" - - // Ensure path starts with / - const normalizedPath = path.startsWith("/") ? path : `/${path}` - - let wsUrl: string - if (isStandardPort) { - // Behind a proxy - WebSocket goes through same host - wsUrl = `${wsProtocol}//${hostname}${normalizedPath}` - } else { - // Direct access - use API port - wsUrl = `${wsProtocol}//${hostname}:${API_PORT}${normalizedPath}` - } - - console.log(`[v0] getWebSocketUrl: protocol=${protocol}, hostname=${hostname}, port=${port}, isStandardPort=${isStandardPort}, wsUrl=${wsUrl}`) - - return wsUrl -} - /** * Gets the JWT token from localStorage *