Fix UI connectivity issues in v2.3.4

- Update iframe URLs to use relative paths for ingress compatibility
- Add proxy server to route /chat and /terminal to correct services
- Add http-proxy dependency for proxying
- Fix WebSocket support for terminal

Author: cabinlab

claude-home/Dockerfile

@@ -32,7 +32,7 @@ RUN ARCH="$(dpkg --print-architecture)" && \
     chmod +x /usr/local/bin/ttyd
 
 # Install Claude Code globally - it just works on Debian!
-RUN npm install -g @anthropic-ai/claude-code http-server
+RUN npm install -g @anthropic-ai/claude-code http-server http-proxy
 
 # Copy and install hass-mcp in a virtual environment
 COPY hass-mcp-lite /opt/hass-mcp

claude-home/config.yaml

@@ -1,6 +1,6 @@
 name: "Claude Home"
 description: "AI-powered terminal and chat interface with Claude Code CLI"
-version: "2.3.3"
+version: "2.3.4"
 slug: "claude_home"
 init: false
 

claude-home/ui/index.html

@@ -164,7 +164,7 @@
     <div class="container">
         <!-- Chat Panel -->
         <div class="chat-panel">
-            <iframe id="chat-frame" src="http://localhost:3000" title="Chat Interface">
+            <iframe id="chat-frame" src="/chat" title="Chat Interface">
                 <div class="loading">Loading chat...</div>
             </iframe>
             <button class="toggle-terminal" onclick="toggleTerminal()" title="Open Terminal">
@@ -178,7 +178,7 @@
         <!-- Terminal Panel -->
         <div class="terminal-panel" id="terminal-panel">
             <button class="close-terminal" onclick="toggleTerminal()" style="display:none;">✕</button>
-            <iframe id="terminal-frame" src="http://localhost:7681" title="Terminal Interface">
+            <iframe id="terminal-frame" src="/terminal" title="Terminal Interface">
                 <div class="loading">Loading terminal...</div>
             </iframe>
         </div>

claude-home/ui/server.js

@@ -1,11 +1,19 @@
 const http = require('http');
+const httpProxy = require('http-proxy');
 const fs = require('fs');
 const path = require('path');
 
 const PORT = 8080;
 
+// Create proxy instances
+const chatProxy = httpProxy.createProxyServer({target: 'http://localhost:3000'});
+const terminalProxy = httpProxy.createProxyServer({target: 'http://localhost:7681', ws: true});
+const gatewayProxy = httpProxy.createProxyServer({target: 'http://localhost:8001'});
+
 const server = http.createServer((req, res) => {
+    // Route based on path
     if (req.url === '/' || req.url === '/index.html') {
+        // Serve the main UI
         fs.readFile(path.join(__dirname, 'index.html'), (err, data) => {
             if (err) {
                 res.writeHead(500);
@@ -15,12 +23,52 @@ const server = http.createServer((req, res) => {
             res.writeHead(200, {'Content-Type': 'text/html'});
             res.end(data);
         });
+    } else if (req.url.startsWith('/chat')) {
+        // Proxy to Anse chat UI
+        chatProxy.web(req, res, {}, (err) => {
+            console.error('Chat proxy error:', err);
+            res.writeHead(502);
+            res.end('Chat service unavailable');
+        });
+    } else if (req.url.startsWith('/terminal')) {
+        // Proxy to ttyd terminal
+        terminalProxy.web(req, res, {}, (err) => {
+            console.error('Terminal proxy error:', err);
+            res.writeHead(502);
+            res.end('Terminal service unavailable');
+        });
+    } else if (req.url.startsWith('/v1/')) {
+        // Proxy to gateway API
+        gatewayProxy.web(req, res, {}, (err) => {
+            console.error('Gateway proxy error:', err);
+            res.writeHead(502);
+            res.end('Gateway service unavailable');
+        });
     } else {
         res.writeHead(404);
         res.end('Not found');
     }
 });
 
+// Handle WebSocket upgrade for terminal
+server.on('upgrade', (req, socket, head) => {
+    if (req.url.startsWith('/terminal')) {
+        terminalProxy.ws(req, socket, head, {}, (err) => {
+            console.error('Terminal WebSocket error:', err);
+            socket.destroy();
+        });
+    }
+});
+
+// Error handling
+chatProxy.on('error', (err) => console.error('Chat proxy error:', err));
+terminalProxy.on('error', (err) => console.error('Terminal proxy error:', err));
+gatewayProxy.on('error', (err) => console.error('Gateway proxy error:', err));
+
 server.listen(PORT, '0.0.0.0', () => {
     console.log(`Responsive UI server running on port ${PORT}`);
+    console.log('Proxying:');
+    console.log('  /chat -> localhost:3000 (Anse)');
+    console.log('  /terminal -> localhost:7681 (ttyd)');
+    console.log('  /v1/* -> localhost:8001 (Gateway)');
 });