klbr/khoj
1
0
Fork 0
mirror of https://github.com/khoaliber/khoj.git synced 2026-03-06 13:22:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Pass auth headers to fix lazy load of chat messages on Desktop app

Browse Source
This commit is contained in:
Debanjum Singh Solanky
2024-04-23 10:59:49 +05:30
parent 4d5d3e6433
commit cd05f262a6
1 changed files with 13 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/interface/desktop/chat.html
View File

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