refactor(app): dedupe terminal url helpers and tests

Reuse resolveTerminalApiOriginUrl from terminal.ts for image fetch URL
resolution to eliminate the duplicate origin builder, and merge the
image fetch URL test cases into terminal.test.ts so they share the
existing mock setup. Extract a same-origin location stub helper to
keep individual test bodies short. Also extract attachGlobalResizeListeners
out of mountTerminalSession to stay under the max-lines-per-function
threshold.

Author: konard

packages/app/src/web/terminal-image-url.ts

@@ -1,20 +1,12 @@
-import { resolveApiBaseUrl } from "./api-http.js"
+import { resolveTerminalApiOriginUrl } from "./terminal.js"
 
 const websocketSuffixPattern = /\/ws$/u
 
-const resolveBackendOrigin = (): URL => {
-  const configured = resolveApiBaseUrl()
-  if (configured.startsWith("http://") || configured.startsWith("https://")) {
-    return new URL(configured)
-  }
-  return new URL(configured, globalThis.location.origin)
-}
-
 export const resolveTerminalImageBasePath = (websocketPath: string): string =>
   websocketPath.replace(websocketSuffixPattern, "/image")
 
 export const resolveTerminalImageFetchUrl = (websocketPath: string, imagePath: string): string => {
-  const apiUrl = resolveBackendOrigin()
+  const apiUrl = resolveTerminalApiOriginUrl()
   apiUrl.pathname = `${apiUrl.pathname.replace(/\/$/u, "")}${resolveTerminalImageBasePath(websocketPath)}`
   apiUrl.searchParams.set("path", imagePath)
   return apiUrl.toString()

packages/app/src/web/terminal-panel-runtime.ts

@@ -57,17 +57,15 @@ const createConnectSocket = (
   return connectSocket
 }
 
+const attachGlobalResizeListeners = (sendResize: () => void): void => {
+  globalThis.addEventListener("resize", sendResize)
+  globalThis.visualViewport?.addEventListener("resize", sendResize)
+  globalThis.visualViewport?.addEventListener("scroll", sendResize)
+}
+
 const mountTerminalSession = (
-  {
-    connectionRef,
-    hostRef,
-    notifyMessage,
-    onAttachFailure,
-    onImagePaths,
-    runtimeRef,
-    session,
-    setStatus
-  }: TerminalLifecycleArgs
+  { connectionRef, hostRef, notifyMessage, onAttachFailure, onImagePaths, runtimeRef, session, setStatus }:
+    TerminalLifecycleArgs
 ): (() => void) | undefined => {
   const host = hostRef.current
   if (host === null) {
@@ -108,9 +106,7 @@ const mountTerminalSession = (
   })
 
   runtimeRef.current = terminalInputController
-  globalThis.addEventListener("resize", sendResize)
-  globalThis.visualViewport?.addEventListener("resize", sendResize)
-  globalThis.visualViewport?.addEventListener("scroll", sendResize)
+  attachGlobalResizeListeners(sendResize)
   connectSocket()
 
   return createTerminalCleanup({
@@ -122,16 +118,8 @@ const mountTerminalSession = (
 }
 
 export const useTerminalSessionLifecycle = (
-  {
-    connectionRef,
-    hostRef,
-    notifyMessage,
-    onAttachFailure,
-    onImagePaths,
-    runtimeRef,
-    session,
-    setStatus
-  }: TerminalLifecycleArgs
+  { connectionRef, hostRef, notifyMessage, onAttachFailure, onImagePaths, runtimeRef, session, setStatus }:
+    TerminalLifecycleArgs
 ): void => {
   useEffect(() => {
     return mountTerminalSession({

packages/app/src/web/terminal.ts

@@ -57,7 +57,7 @@ export const buildProjectActiveTerminalSession = (
   }
 }
 
-const resolveTerminalApiBaseUrl = (): string => {
+export const resolveTerminalApiBaseUrl = (): string => {
   const configured = import.meta.env.VITE_DOCKER_GIT_TERMINAL_API_BASE_URL
   if (configured !== undefined && configured.trim().length > 0) {
     return trimTrailingSlash(configured.trim())
@@ -66,7 +66,7 @@ const resolveTerminalApiBaseUrl = (): string => {
   return resolveApiBaseUrl()
 }
 
-const resolveApiUrl = (): URL => {
+export const resolveTerminalApiOriginUrl = (): URL => {
   const configured = resolveTerminalApiBaseUrl()
   if (configured.startsWith("http://") || configured.startsWith("https://")) {
     return new URL(configured)
@@ -75,7 +75,7 @@ const resolveApiUrl = (): URL => {
 }
 
 export const resolveTerminalWebSocketUrl = (websocketPath: string, cols: number, rows: number): string => {
-  const apiUrl = resolveApiUrl()
+  const apiUrl = resolveTerminalApiOriginUrl()
   apiUrl.protocol = apiUrl.protocol === "https:" ? "wss:" : "ws:"
   apiUrl.pathname = `${apiUrl.pathname.replace(/\/$/u, "")}${websocketPath}`
   apiUrl.searchParams.set("cols", String(cols))

packages/app/tests/docker-git/terminal-image-url.test.ts

@@ -6,6 +6,7 @@ import {
   extractTerminalImageBase64,
   isTerminalPasteShortcut
 } from "../../src/web/terminal-image-paste.js"
+import { resolveTerminalImageBasePath, resolveTerminalImageFetchUrl } from "../../src/web/terminal-image-url.js"
 import {
   resolveTerminalCompactHeaderMode,
   resolveTerminalTypingMode,
@@ -32,6 +33,15 @@ vi.mock("../../src/web/api-http.js", () => ({
   resolveApiBaseUrl: resolveApiBaseUrlMock
 }))
 
+const stubSameOriginLocation = (host: string, httpProtocol: string): void => {
+  resolveApiBaseUrlMock.mockReturnValue("/api")
+  vi.stubGlobal("location", {
+    hostname: host,
+    origin: `${httpProtocol}//${host}:4176`,
+    protocol: httpProtocol
+  })
+}
+
 describe("browser terminal helpers", () => {
   beforeEach(() => {
     resolveApiBaseUrlMock.mockReset()
@@ -54,12 +64,7 @@ describe("browser terminal helpers", () => {
     const httpProtocol = ["ht", "tp:"].join("")
     const wsProtocol = ["ws", "://"].join("")
 
-    resolveApiBaseUrlMock.mockReturnValue("/api")
-    vi.stubGlobal("location", {
-      hostname: host,
-      origin: `${httpProtocol}//${host}:4176`,
-      protocol: httpProtocol
-    })
+    stubSameOriginLocation(host, httpProtocol)
 
     expect(resolveTerminalWebSocketUrl("/projects/proj/terminal-sessions/sess/ws", 80, 24)).toBe([
       wsProtocol,
@@ -130,4 +135,34 @@ describe("browser terminal helpers", () => {
     expect(shouldShowTerminalTabs(true, 2)).toBe(true)
     expect(shouldShowTerminalTabs(false, 1)).toBe(true)
   })
+
+  it("converts /ws suffix into /image base path", () => {
+    expect(resolveTerminalImageBasePath("/projects/by-key/proj/terminal-sessions/sess/ws")).toBe(
+      "/projects/by-key/proj/terminal-sessions/sess/image"
+    )
+  })
+
+  it("builds an absolute backend image url with path query parameter", () => {
+    resolveApiBaseUrlMock.mockReturnValue("https://controller.example/api")
+
+    expect(
+      resolveTerminalImageFetchUrl(
+        "/projects/by-key/proj%201/terminal-sessions/sess%2F2/ws",
+        "/var/data/sample image.png"
+      )
+    ).toBe(
+      "https://controller.example/api/projects/by-key/proj%201/terminal-sessions/sess%2F2/image?path=%2Fvar%2Fdata%2Fsample+image.png"
+    )
+  })
+
+  it("uses same-origin api proxy for relative image fetch urls", () => {
+    const host = "terminal.example.local"
+    const httpProtocol = ["ht", "tp:"].join("")
+
+    stubSameOriginLocation(host, httpProtocol)
+
+    expect(
+      resolveTerminalImageFetchUrl("/projects/proj/terminal-sessions/sess/ws", "/var/data/file.png")
+    ).toBe(`${httpProtocol}//${host}:4176/api/projects/proj/terminal-sessions/sess/image?path=%2Fvar%2Fdata%2Ffile.png`)
+  })
 })