From 325cb0f7fbf919c25963929eb0286c53908e75c8 Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Sat, 11 Nov 2023 00:46:16 -0800
Subject: [PATCH] Show message in Save button of Github, Notion config save in
 web app

Show the success, failure message only temporarily. Previously it
stuck around after clicking save until page refresh
---
 .../web/content_source_github_input.html      | 29 ++++++++++++++++---
 .../web/content_source_notion_input.html      | 26 ++++++++++++++---
 2 files changed, 47 insertions(+), 8 deletions(-)

diff --git a/src/khoj/interface/web/content_source_github_input.html b/src/khoj/interface/web/content_source_github_input.html
index 705e5672..cce0d083 100644
--- a/src/khoj/interface/web/content_source_github_input.html
+++ b/src/khoj/interface/web/content_source_github_input.html
@@ -46,6 +46,9 @@
     </div>
 </div>
 <style>
+    td {
+        padding: 10px 0;
+    }
     div.repo {
         width: 100%;
         height: 100%;
@@ -124,6 +127,10 @@
             return;
         }
 
+        const submitButton = document.getElementById("submit");
+        submitButton.disabled = true;
+        submitButton.innerHTML = "Saving...";
+
         // Save Github config on server
         const csrfToken = document.cookie.split('; ').find(row => row.startsWith('csrftoken'))?.split('=')[1];
         fetch('/api/config/data/content-source/github', {
@@ -140,8 +147,13 @@
         .then(response => response.json())
         .then(data => { data["status"] === "ok" ? data : Promise.reject(data) })
         .catch(error => {
-            document.getElementById("success").innerHTML = "⚠️ Failed to update settings";
+            document.getElementById("success").innerHTML = "⚠️ Failed to save Github settings.";
             document.getElementById("success").style.display = "block";
+            submitButton.innerHTML = "⚠️ Failed to save settings";
+            setTimeout(function() {
+                submitButton.innerHTML = "Save";
+                submitButton.disabled = false;
+            }, 2000);
             return;
         });
 
@@ -150,12 +162,21 @@
         .then(response => response.json())
         .then(data => { data["status"] == "ok" ? data : Promise.reject(data) })
         .then(data => {
-            document.getElementById("success").innerHTML = "✅ Successfully updated";
-            document.getElementById("success").style.display = "block";
+            document.getElementById("success").style.display = "none";
+            submitButton.innerHTML = "✅ Successfully updated";
+            setTimeout(function() {
+                submitButton.innerHTML = "Save";
+                submitButton.disabled = false;
+            }, 2000);
         })
         .catch(error => {
-            document.getElementById("success").innerHTML = "⚠️ Failed to update settings";
+            document.getElementById("success").innerHTML = "⚠️ Failed to save Github content.";
             document.getElementById("success").style.display = "block";
+            submitButton.innerHTML = "⚠️ Failed to save content";
+            setTimeout(function() {
+                submitButton.innerHTML = "Save";
+                submitButton.disabled = false;
+            }, 2000);
         });
 
     });
diff --git a/src/khoj/interface/web/content_source_notion_input.html b/src/khoj/interface/web/content_source_notion_input.html
index 4bc4a20d..d5427ab3 100644
--- a/src/khoj/interface/web/content_source_notion_input.html
+++ b/src/khoj/interface/web/content_source_notion_input.html
@@ -41,6 +41,10 @@
             return;
         }
 
+        const submitButton = document.getElementById("submit");
+        submitButton.disabled = true;
+        submitButton.innerHTML = "Saving...";
+
         // Save Notion config on server
         const csrfToken = document.cookie.split('; ').find(row => row.startsWith('csrftoken'))?.split('=')[1];
         fetch('/api/config/data/content-source/notion', {
@@ -56,8 +60,13 @@
         .then(response => response.json())
         .then(data => { data["status"] === "ok" ? data : Promise.reject(data) })
         .catch(error => {
-            document.getElementById("success").innerHTML = "⚠️ Failed to update settings";
+            document.getElementById("success").innerHTML = "⚠️ Failed to save Notion settings.";
             document.getElementById("success").style.display = "block";
+            submitButton.innerHTML = "⚠️ Failed to save settings";
+            setTimeout(function() {
+                submitButton.innerHTML = "Save";
+                submitButton.disabled = false;
+            }, 2000);
             return;
         });
 
@@ -66,12 +75,21 @@
         .then(response => response.json())
         .then(data => { data["status"] == "ok" ? data : Promise.reject(data) })
         .then(data => {
-            document.getElementById("success").innerHTML = "✅ Successfully updated";
-            document.getElementById("success").style.display = "block";
+            document.getElementById("success").style.display = "none";
+            submitButton.innerHTML = "✅ Successfully updated";
+            setTimeout(function() {
+                submitButton.innerHTML = "Save";
+                submitButton.disabled = false;
+            }, 2000);
         })
         .catch(error => {
-            document.getElementById("success").innerHTML = "⚠️ Failed to update settings";
+            document.getElementById("success").innerHTML = "⚠️ Failed to save Notion content.";
             document.getElementById("success").style.display = "block";
+            submitButton.innerHTML = "⚠️ Failed to save content";
+            setTimeout(function() {
+                submitButton.innerHTML = "Save";
+                submitButton.disabled = false;
+            }, 2000);
         });
     });
 </script>