From 73bcd3143a9e704be0c9d5d3f974f356c887f008 Mon Sep 17 00:00:00 2001
From: jaakko <jaakko@kipina.tech>
Date: Tue, 7 Apr 2026 07:14:52 +0300
Subject: [PATCH] WebSocket auto-reconnect: yhteys palautuu 3s kuluttua
 katkoksesta
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

connectHub() luo uuden WebSocketin ja asettaa onopen/onclose/onmessage.
onclose käynnistää 3s timerin joka kutsuu connectHub() uudelleen.
Terminaaliin tulee '↻ Yhdistetään uudelleen...' -viesti.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 network-poc/static/index.html | 32 ++++++++++++++++++++++++++++----
 1 file changed, 28 insertions(+), 4 deletions(-)

diff --git a/network-poc/static/index.html b/network-poc/static/index.html
index dba2e1b..f4b8a1a 100644
--- a/network-poc/static/index.html
+++ b/network-poc/static/index.html
@@ -1672,9 +1672,19 @@
             if (e.key === 'Enter') sendUserText();
         });
 
-        // Kytkemme sivuston UI-puolen (JS) omaan passiiviseen WebSocket-kuuntelijaan.
-        const uiSocket = new WebSocket(`${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.host}/ws`);
-        window._uiSocket = uiSocket;
+        // WebSocket-yhteys hubiin — automaattinen reconnect
+        const wsUrl = `${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.host}/ws`;
+        let uiSocket = null;
+        let wsReconnectTimer = null;
+
+        function connectHub() {
+            if (uiSocket && (uiSocket.readyState === 0 || uiSocket.readyState === 1)) return;
+            uiSocket = new WebSocket(wsUrl);
+            window._uiSocket = uiSocket;
+            // Kytketään onmessage uudelleen (handler määritellään myöhemmin, asetetaan kun valmis)
+            setTimeout(() => {
+                if (window._wsMessageHandler) uiSocket.onmessage = window._wsMessageHandler;
+            }, 0);
         uiSocket.onopen = async () => {
             // Päivitetään agents-näkymän hub-status
             const hubDot = document.getElementById('agent-hub-dot');
@@ -1746,7 +1756,18 @@
                 coderEl.textContent = 'Disconnected';
                 coderEl.style.color = '#f85149';
             }
+            // Automaattinen reconnect 3s kuluttua
+            if (!wsReconnectTimer) {
+                wsReconnectTimer = setTimeout(() => {
+                    wsReconnectTimer = null;
+                    termLog('  <span style="color:#d29922">↻ Yhdistetään uudelleen...</span>');
+                    connectHub();
+                }, 3000);
+            }
         };
+        } // connectHub()
+        connectHub();
+
         // Terminaalin komentorivi
         const termInput = document.getElementById('term-input');
         const termPanel = document.getElementById('agent-terminal');
@@ -2753,7 +2774,8 @@ Files: ${Object.keys(generatedFiles).join(', ')}`;
         // Klikkaa terminaalipaneelia → fokusoi input
         termPanel?.addEventListener('click', () => termInput?.focus());
 
-        uiSocket.onmessage = (event) => {
+        // Tallennetaan message-handler funktioon jotta reconnect voi käyttää samaa
+        const _wsHandler = (event) => {
             try {
                 const raw = event.data;
                 if (raw.includes('"single_tokenize"')) return;
@@ -3115,6 +3137,8 @@ Files: ${Object.keys(generatedFiles).join(', ')}`;
                 }
             } catch(e) {}
         };
+        window._wsMessageHandler = _wsHandler;
+        if (uiSocket) uiSocket.onmessage = _wsHandler;
 
         btn.addEventListener('click', async () => {
             // Käytetään viewer-authissa jo tunnistettua WebGPU-tilaa