reusable conversations

Zaki-1052 · Jun 29, 2024 · 6d0d5d7 · 6d0d5d7
1 parent 77ea733
commit 6d0d5d7
Show file tree

Hide file tree

Showing 5 changed files with 157 additions and 61 deletions.
diff --git a/public/chat.css b/public/chat.css
@@ -431,28 +431,32 @@ body {
 /* Styles for the hidden sidebar */
 #sidebar {
   display: none;
-  width: 250px;
+  width: 300px;
   position: fixed;
   top: 0;
   left: 0;
   height: 100%;
   background-color: #2c2c2c; /* Dark mode background */
   color: #fff; /* Dark mode text color */
-  overflow-x: hidden;
-  padding-top: 20px;
+  overflow-x: auto;
+  overflow-y: auto; /* Enable vertical scroll if content overflows */
+  padding-top: 10px;
   transition: 0.3s;
   z-index: 1000; /* Ensure sidebar is above other elements */
 }
+
 #sidebar a {
-  padding: 10px 15px;
+  padding: 5px 10px;
   text-decoration: none;
-  font-size: 18px;
+  font-size: 16px;
   color: #fff;
   display: block;
 }
+
 #sidebar a:hover {
   background-color: #575757;
 }
+
 #toggleArrow {
   position: fixed;
   top: 50%;
@@ -468,6 +472,38 @@ body {
   transition: 0.3s;
   z-index: 1001; /* Ensure arrow is above other elements */
 }
+
 #toggleArrow:hover {
   background-color: rgba(0, 0, 0, 0.7);
-}
+}
+
+#summariesButton {
+  position: absolute;
+  bottom: 20px;
+  left: 10px;
+  width: calc(100% - 20px);
+  background-color: #4CAF50;
+  color: white;
+  border: none;
+  padding: 10px 20px;
+  text-align: center;
+  text-decoration: none;
+  display: block;
+  font-size: 16px;
+  margin: 4px 2px;
+  cursor: pointer;
+  border-radius: 12px;
+  }
+
+#summariesButton:hover {
+  background-color: #45a049;
+}
+
+#chatList {
+  list-style-type: none; /* Remove bullet points */
+  font-size: 9px;
+}
+
+#chatList li {
+  padding: 5px 10px; /* Add some padding to list items */
+}
diff --git a/public/portal.html b/public/portal.html
@@ -13,7 +13,11 @@
 <body>
 <div>
   <div id="toggleArrow">&#x25B6;</div>
-  <div id="sidebar"></div>
+  <div id="sidebar">
+     <!-- Chat list will be dynamically populated here -->
+     <div id="chatList"></div>
+     <button id="summariesButton">Summaries Only</button>
+  </div>
   <div id="model-selector-container">
     <div class="custom-select" id="selected-model">Select a Model</div>
       <div id="model-options" class="select-options">

diff --git a/public/script.js b/public/script.js
@@ -1277,42 +1277,52 @@ document.getElementById('open-router-model-cohere-command-r-plus').addEventListe
 
       const sidebar = document.getElementById('sidebar');
       const toggleArrow = document.getElementById('toggleArrow');
+      const summariesButton = document.getElementById('summariesButton');
+      let summariesOnly = true;
 
       // Fetch the list of chats from the backend and display them in the sidebar
       async function fetchChatList() {
         try {
           const response = await fetch('/listChats');
           const data = await response.json();
-          sidebar.innerHTML = data.files.map(file => {
-            const fileNameWithoutExt = file.replace('.txt', '');
-            return `<a href="#" data-chat="${fileNameWithoutExt}">${fileNameWithoutExt}</a>`;
+          const chatList = document.getElementById('chatList');
+          chatList.innerHTML = data.files.map(file => {
+            // Remove the .txt extension
+            let fileNameWithoutExt = file.replace('.txt', '');
+            // Replace underscores with spaces
+            let displayName = fileNameWithoutExt.replace(/_/g, ' ');
+            return `<li><a href="#" data-chat="${fileNameWithoutExt}">${displayName}</a></li>`;
           }).join('');
         } catch (error) {
           console.error('Error fetching chat list:', error);
         }
       }
 
       // Handle chat selection
-      sidebar.addEventListener('click', async (event) => {
-        const chatName = event.target.getAttribute('data-chat');
-        if (chatName) {
-          try {
-            await fetch('/setChat', {
-              method: 'POST',
-              headers: { 'Content-Type': 'application/json' },
-              body: JSON.stringify({ chosenChat: `${chatName}` })
-            });
-
-            const summaryResponse = await fetch(`/getSummary/${chatName}`);
-            const summaryData = await summaryResponse.json();
-
-            if (summaryData.summary) {
-              displayMessage(summaryData.summary, 'response', false);
-            } else {
-              console.error('Summary not found.');
+      document.getElementById('chatList').addEventListener('click', async (event) => {
+        if (event.target.tagName === 'A') {
+          event.preventDefault();
+          const chatName = event.target.getAttribute('data-chat');
+          if (chatName) {
+            try {
+              console.log("clicked");
+              await fetch('/setChat', {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ chosenChat: `${chatName}` })
+              });
+
+              const summaryResponse = await fetch(`/getSummary/${chatName}`);
+              const summaryData = await summaryResponse.json();
+
+              if (summaryData.summary) {
+                displayMessage(summaryData.summary, 'response');
+              } else {
+                console.error('Summary not found.');
+              }
+            } catch (error) {
+              console.error('Error setting chat:', error);
             }
-          } catch (error) {
-            console.error('Error setting chat:', error);
           }
         }
       });
@@ -1328,6 +1338,24 @@ document.getElementById('open-router-model-cohere-command-r-plus').addEventListe
         }
       });
 
+      // Handle summariesButton click
+      summariesButton.addEventListener('click', async () => {
+        summariesOnly = !summariesOnly;
+        summariesButton.textContent = summariesOnly ? 'Summaries Only' : 'Whole Conversations';
+
+        try {
+          await fetch('/setSummariesOnly', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ summariesOnly })
+          });
+        } catch (error) {
+          console.error('Error setting summaries only:', error);
+        }
+      });
+
+
+
       document.addEventListener('keydown', (event) => {
 
         // SHIFT+ESC for focusing the chat input

diff --git a/...chats/"Automated_Daily_Email_Reports".txt → ...s/chats/Automated_Daily_Email_Reports.txt b/...chats/"Automated_Daily_Email_Reports".txt → ...s/chats/Automated_Daily_Email_Reports.txt