From 6ba0d8e379bdb1f8140ee31c95c1a6d2e9f6fef5 Mon Sep 17 00:00:00 2001
From: sabaimran <narmiabas@gmail.com>
Date: Wed, 20 Mar 2024 20:53:28 +0530
Subject: [PATCH] Add a connected notification if the websocket is connected

---
 src/khoj/interface/web/chat.html | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/khoj/interface/web/chat.html b/src/khoj/interface/web/chat.html
index 6b8ef694..50e7c0f9 100644
--- a/src/khoj/interface/web/chat.html
+++ b/src/khoj/interface/web/chat.html
@@ -929,14 +929,19 @@ To get started, just start typing below. You can also type / to see a list of co
             };
             websocket.onclose = function(event) {
                 websocket = null;
-                console.log("WebSocket is closed now.")
+                console.log("WebSocket is closed now.");
+                let greenDot = document.getElementById("connected-green-dot");
+                greenDot.style.display = "none";
             }
             websocket.onerror = function(event) {
-                console.log("WebSocket error observed:", event)
+                console.log("WebSocket error observed:", event);
             }
 
             websocket.onopen = function(event) {
                 console.log("WebSocket is open now.")
+                let greenDot = document.getElementById("connected-green-dot");
+                greenDot.style.display = "flex";
+
             }
         }
 
@@ -1514,6 +1519,10 @@ To get started, just start typing below. You can also type / to see a list of co
             <div id="side-panel-wrapper">
                 <div id="side-panel">
                     <div id="new-conversation">
+                        <div id="connected-green-dot" style="display: none; align-items: center; margin-bottom: 10px;">
+                            <div style="width: 10px; height: 10px; background-color: green; border-radius: 50%; margin-right: 5px;"></div>
+                            <div>Connected</div>
+                        </div>
                         <button class="side-panel-button" id="new-conversation-button" onclick="createNewConversation()">
                             New Topic
                             <svg class="new-convo-button" viewBox="0 0 35 35" fill="#000000" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">