Fix Chat UI and Indexing on Desktop App (#723)

- Make valid file extension checking case insensitive on Desktop app
- Skip indexing non-existent folders on Desktop app
- Pass auth headers to fix lazy load of chat messages on Desktop app
- Set chat-message height to height of content in web, desktop

src/interface/desktop/chat.html

@@ -675,28 +675,35 @@
             await loadChat();
         });
 
-        async function loadChat() {
+        async function getChatHistoryUrl() {
-            // Load chat history
             const hostURL = await window.hostURLAPI.getURL();
             const khojToken = await window.tokenAPI.getToken();
             const headers = { 'Authorization': `Bearer ${khojToken}` };
 
-            let firstRunSetupMessageRendered = false;
             let chatBody = document.getElementById("chat-body");
             chatBody.innerHTML = "";
             let chatHistoryUrl = `${hostURL}/api/chat/history?client=desktop`;
             if (chatBody.dataset.conversationId) {
                 chatHistoryUrl += `&conversation_id=${chatBody.dataset.conversationId}`;
             }
+            return { chatHistoryUrl, headers };
+        }
+
+        async function loadChat() {
+            // Load chat history and body
+            const hostURL = await window.hostURLAPI.getURL();
+            const { chatHistoryUrl, headers } = await getChatHistoryUrl();
 
             // Create loading screen and add it to chat-body
             let loadingScreen = document.createElement('div');
             loadingScreen.classList.add("loading-spinner");
             let yellowOrb = document.createElement('div');
             loadingScreen.appendChild(yellowOrb);
+            let chatBody = document.getElementById("chat-body");
             chatBody.appendChild(loadingScreen);
 
             // Get the most recent 10 chat messages from conversation history
+            let firstRunSetupMessageRendered = false;
             fetch(`${chatHistoryUrl}&n=10`, { headers })
                 .then(response => response.json())
                 .then(data => {
@@ -722,7 +729,7 @@
                         entries.forEach(entry => {
                             // If the element is in the viewport, fetch the remaining message and unobserve the element
                             if (entry.isIntersecting) {
-                                fetchRemainingChatMessages(chatHistoryUrl);
+                                fetchRemainingChatMessages(chatHistoryUrl, headers);
                                 observer.unobserve(entry.target);
                             }
                         });
@@ -817,7 +824,7 @@
             }
         }
 
-        function fetchRemainingChatMessages(chatHistoryUrl) {
+        function fetchRemainingChatMessages(chatHistoryUrl, headers) {
             // Create a new IntersectionObserver
             let observer = new IntersectionObserver((entries, observer) => {
                 entries.forEach(entry => {
@@ -842,7 +849,7 @@
             }, {rootMargin: '0px 0px 200px 0px'});  // Trigger when the element is within 200px of the viewport
 
             // Fetch remaining chat messages from conversation history
-            fetch(`${chatHistoryUrl}&n=-10`, { method: "GET" })
+            fetch(`${chatHistoryUrl}&n=-10`, { headers })
                 .then(response => response.json())
                 .then(data => {
                     if (data.status != "ok") {
@@ -1395,11 +1402,13 @@
         .chat-message.khoj {
             margin-left: auto;
             text-align: left;
+            height: fit-content;
         }
         /* move message by you to right */
         .chat-message.you {
             margin-right: auto;
             text-align: right;
+            height: fit-content;
         }
         /* basic style chat message text */
         .chat-message-text {

src/interface/desktop/main.js

@@ -116,29 +116,41 @@ function filenameToMimeType (filename) {
 }
 
 function isSupportedFileType(filePath) {
-    const fileExtension = filePath.split('.').pop();
+    const fileExtension = filePath.split('.').pop().toLowerCase();
     return validFileTypes.includes(fileExtension);
 }
 
 function processDirectory(filesToPush, folder) {
-    const files = fs.readdirSync(folder.path, { withFileTypes: true });
+    try {
+        const files = fs.readdirSync(folder.path, { withFileTypes: true });
 
-    for (const file of files) {
+        for (const file of files) {
-        const filePath = path.join(file.path, file.name || '');
+            const filePath = path.join(file.path, file.name || '');
-        // Skip hidden files and folders
+            // Skip hidden files and folders
-        if (file.name.startsWith('.')) {
+            if (file.name.startsWith('.')) {
-            continue;
+                continue;
+            }
+            // Add supported files to index
+            if (file.isFile() && isSupportedFileType(filePath)) {
+                console.log(`Add ${file.name} in ${file.path} for indexing`);
+                filesToPush.push(filePath);
+            }
+            // Recursively process subdirectories
+            if (file.isDirectory()) {
+                processDirectory(filesToPush, {'path': filePath});
+            }
         }
-        // Add supported files to index
+    } catch (err) {
-        if (file.isFile() && isSupportedFileType(filePath)) {
+        if (err.code === 'EACCES') {
-            console.log(`Add ${file.name} in ${file.path} for indexing`);
+            console.error(`Access denied to ${folder.path}`);
-            filesToPush.push(filePath);
+        } else if (err.code === 'ENOENT') {
-        }
+            console.error(`${folder.path} does not exist`);
-        // Recursively process subdirectories
+        } else {
-        if (file.isDirectory()) {
+            console.error(`An error occurred while reading directory: ${error.message}`);
-            processDirectory(filesToPush, {'path': filePath});
         }
+        return;
     }
+
 }
 
 function pushDataToKhoj (regenerate = false) {

src/khoj/interface/web/chat.html

@@ -2055,11 +2055,13 @@ To get started, just start typing below. You can also type / to see a list of co
         .chat-message.khoj {
             margin-left: auto;
             text-align: left;
+            height: fit-content;
         }
         /* move message by you to right */
         .chat-message.you {
             margin-right: auto;
             text-align: right;
+            height: fit-content;
         }
         /* basic style chat message text */
         .chat-message-text {