diff --git a/src/interface/desktop/assets/icons/chat.svg b/src/interface/desktop/assets/icons/chat.svg
deleted file mode 100644
index a5cbf3af..00000000
--- a/src/interface/desktop/assets/icons/chat.svg
+++ /dev/null
@@ -1,24 +0,0 @@
-
-
-
-
-
diff --git a/src/interface/desktop/assets/icons/circular-add.svg b/src/interface/desktop/assets/icons/circular-add.svg
deleted file mode 100644
index 9e6ac67b..00000000
--- a/src/interface/desktop/assets/icons/circular-add.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-
-
-
-
-
diff --git a/src/interface/desktop/assets/icons/clock.svg b/src/interface/desktop/assets/icons/clock.svg
new file mode 100644
index 00000000..e9ac78df
--- /dev/null
+++ b/src/interface/desktop/assets/icons/clock.svg
@@ -0,0 +1 @@
+
diff --git a/src/interface/desktop/assets/icons/confirm-icon.svg b/src/interface/desktop/assets/icons/confirm-icon.svg
deleted file mode 100644
index 98d30500..00000000
--- a/src/interface/desktop/assets/icons/confirm-icon.svg
+++ /dev/null
@@ -1 +0,0 @@
-confirm
diff --git a/src/interface/desktop/assets/icons/file-not-synced.svg b/src/interface/desktop/assets/icons/file-not-synced.svg
index 227d51d3..62d1425c 100644
--- a/src/interface/desktop/assets/icons/file-not-synced.svg
+++ b/src/interface/desktop/assets/icons/file-not-synced.svg
@@ -1,9 +1 @@
-
-
-
-
-
-
-
-
-
+
diff --git a/src/interface/desktop/assets/icons/file-synced.svg b/src/interface/desktop/assets/icons/file-synced.svg
index c584a86d..c19d8446 100644
--- a/src/interface/desktop/assets/icons/file-synced.svg
+++ b/src/interface/desktop/assets/icons/file-synced.svg
@@ -1,9 +1 @@
-
-
-
-
-
-
-
-
-
+
diff --git a/src/interface/desktop/assets/icons/folder.svg b/src/interface/desktop/assets/icons/folder.svg
deleted file mode 100644
index c7003a64..00000000
--- a/src/interface/desktop/assets/icons/folder.svg
+++ /dev/null
@@ -1,28 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/interface/desktop/assets/icons/key.svg b/src/interface/desktop/assets/icons/key.svg
deleted file mode 100644
index 437688fb..00000000
--- a/src/interface/desktop/assets/icons/key.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
-
-
-
diff --git a/src/interface/desktop/assets/icons/khoj-logo-sideways-200.png b/src/interface/desktop/assets/icons/khoj-logo-sideways-200.png
deleted file mode 100644
index 52ccdfa4..00000000
Binary files a/src/interface/desktop/assets/icons/khoj-logo-sideways-200.png and /dev/null differ
diff --git a/src/interface/desktop/assets/icons/khoj-logo-sideways-500.png b/src/interface/desktop/assets/icons/khoj-logo-sideways-500.png
deleted file mode 100644
index 765d6e33..00000000
Binary files a/src/interface/desktop/assets/icons/khoj-logo-sideways-500.png and /dev/null differ
diff --git a/src/interface/desktop/assets/icons/khoj_logo.png b/src/interface/desktop/assets/icons/khoj_logo.png
new file mode 100644
index 00000000..a3301e62
Binary files /dev/null and b/src/interface/desktop/assets/icons/khoj_logo.png differ
diff --git a/src/interface/desktop/assets/icons/link.svg b/src/interface/desktop/assets/icons/link.svg
deleted file mode 100644
index 43852d95..00000000
--- a/src/interface/desktop/assets/icons/link.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-
-
-
-
diff --git a/src/interface/desktop/assets/icons/microphone-solid.svg b/src/interface/desktop/assets/icons/microphone-solid.svg
deleted file mode 100644
index 3fc4b91d..00000000
--- a/src/interface/desktop/assets/icons/microphone-solid.svg
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/src/interface/desktop/assets/icons/open-link.svg b/src/interface/desktop/assets/icons/open-link.svg
new file mode 100644
index 00000000..abaa88ad
--- /dev/null
+++ b/src/interface/desktop/assets/icons/open-link.svg
@@ -0,0 +1 @@
+
diff --git a/src/interface/desktop/assets/icons/plaintext.svg b/src/interface/desktop/assets/icons/plaintext.svg
deleted file mode 100644
index 92233c24..00000000
--- a/src/interface/desktop/assets/icons/plaintext.svg
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/src/interface/desktop/assets/icons/question-mark-icon.svg b/src/interface/desktop/assets/icons/question-mark-icon.svg
deleted file mode 100644
index fde2e972..00000000
--- a/src/interface/desktop/assets/icons/question-mark-icon.svg
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/src/interface/desktop/assets/icons/search.svg b/src/interface/desktop/assets/icons/search.svg
deleted file mode 100644
index f0e463f2..00000000
--- a/src/interface/desktop/assets/icons/search.svg
+++ /dev/null
@@ -1,25 +0,0 @@
-
-
-
-
-
diff --git a/src/interface/desktop/assets/icons/stop-solid.svg b/src/interface/desktop/assets/icons/stop-solid.svg
deleted file mode 100644
index a9aaba28..00000000
--- a/src/interface/desktop/assets/icons/stop-solid.svg
+++ /dev/null
@@ -1,37 +0,0 @@
-
-
-
-
-
-
-
diff --git a/src/interface/desktop/assets/icons/trash-solid.svg b/src/interface/desktop/assets/icons/trash-solid.svg
index 768d80f8..3b67fe45 100644
--- a/src/interface/desktop/assets/icons/trash-solid.svg
+++ b/src/interface/desktop/assets/icons/trash-solid.svg
@@ -1 +1 @@
-
+
diff --git a/src/interface/desktop/assets/icons/upload.svg b/src/interface/desktop/assets/icons/upload.svg
new file mode 100644
index 00000000..2fe72e20
--- /dev/null
+++ b/src/interface/desktop/assets/icons/upload.svg
@@ -0,0 +1 @@
+
diff --git a/src/interface/desktop/assets/khoj.css b/src/interface/desktop/assets/khoj.css
index 1f1594d5..9781902f 100644
--- a/src/interface/desktop/assets/khoj.css
+++ b/src/interface/desktop/assets/khoj.css
@@ -8,13 +8,12 @@
--primary-hover: #fee285;
--primary-focus: rgba(255, 179, 0, 0.125);
--primary-inverse: rgba(0, 0, 0, 0.75);
- --background-color: #f5f4f3;
+ --background-color: #fff;
--main-text-color: #475569;
--summer-sun: #fcc50b;
--water: #44b9da;
--leaf: #7b990a;
--flower: #d1684e;
- --font-family: "Noto Sans", "Noto Sans Arabic", sans-serif !important;
}
/* Amber Dark scheme (Auto) */
@@ -25,13 +24,12 @@
--primary-hover: #fee285;
--primary-focus: rgba(255, 179, 0, 0.25);
--primary-inverse: rgba(0, 0, 0, 0.75);
- --background-color: #f5f4f3;
+ --background-color: #fff;
--main-text-color: #475569;
--summer-sun: #fcc50b;
--water: #44b9da;
--leaf: #7b990a;
--flower: #d1684e;
- --font-family: "Noto Sans", "Noto Sans Arabic", sans-serif !important;
}
}
/* Amber Dark scheme (Forced) */
@@ -41,13 +39,12 @@
--primary-hover: #fcc50b;
--primary-focus: rgba(255, 179, 0, 0.25);
--primary-inverse: rgba(0, 0, 0, 0.75);
- --background-color: #f5f4f3;
+ --background-color: #fff;
--main-text-color: #475569;
--summer-sun: #fcc50b;
--water: #44b9da;
--leaf: #7b990a;
--flower: #d1684e;
- --font-family: "Noto Sans", "Noto Sans Arabic", sans-serif !important;
}
/* Amber (Common styles) */
:root {
@@ -90,36 +87,46 @@ nav.khoj-nav {
grid-gap: 32px;
justify-self: right;
align-items: center;
- }
+}
- .khoj-status-box {
+.khoj-status-box {
display: flex;
align-items: center;
- justify-content: center;
- min-width: 52px;
- gap: 4px;
- -webkit-app-region: no-drag;
+ padding: 8px 12px;
+ border-radius: 16px;
+ font-size: 14px;
+ font-weight: 500;
+ background-color: #f5f5f5; /* Neutral background */
+ color: #333; /* Neutral text color */
+ box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow */
+ transition: background-color 0.3s ease, color 0.3s ease;
}
- .khoj-status-box .khoj-status-connected {
- height: 12px;
- width: 12px;
+.khoj-status-connected {
+ width: 10px;
+ height: 10px;
border-radius: 50%;
- background-color: rgb(90, 235, 90);
- }
- .khoj-status-box .khoj-status-not-connected {
- height: 12px;
- width: 12px;
- border-radius: 50%;
- background-color: rgb(235, 90, 90);
- }
-
- .khoj-status-box .khoj-status-text {
- display: none;
+ background-color: #4CAF50; /* Green for connected */
+ margin-right: 8px;
+}
+
+.khoj-status-not-connected {
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ background-color: #F44336; /* Red for not connected */
+ margin-right: 8px;
+}
+
+.khoj-status-text {
+ color: #333; /* Neutral text color */
+ font-family: inherit;
+}
+
+.khoj-status-box:hover {
+ background-color: #e0e0e0; /* Slightly darker background on hover */
+ color: #000; /* Darker text on hover */
}
-.khoj-status-box:hover .khoj-status-text {
- display: block;
- }
a.khoj-nav {
display: flex;
@@ -188,18 +195,18 @@ img.khoj-logo {
.khoj-nav-dropdown-content.show {
opacity: 1;
pointer-events: auto;
- border-radius: 20px;
+ border-radius: 8px;
}
.khoj-nav-dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
- border-radius: 20px;
}
.khoj-nav-dropdown-content a:hover {
- background-color: var(--primary-hover);
+ background-color: hsla(24.6 95% 53.1% / 0.125);
}
+
.khoj-nav-username {
padding: 12px 16px;
text-decoration: none;
@@ -233,6 +240,17 @@ img.khoj-logo {
border: 3px solid var(--primary-hover);
}
+.khoj-nav-icon {
+ width: 20px;
+ height: 20px;
+}
+
+a.khoj-nav-link {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+}
+
@media screen and (max-width: 600px) {
.khoj-nav-dropdown-content {
display: block;
diff --git a/src/interface/desktop/chat.html b/src/interface/desktop/chat.html
deleted file mode 100644
index 4c2258cc..00000000
--- a/src/interface/desktop/chat.html
+++ /dev/null
@@ -1,1744 +0,0 @@
-
-
-
-
- Khoj - Chat
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/interface/desktop/main.js b/src/interface/desktop/main.js
index 7c7bf4fc..a2d382de 100644
--- a/src/interface/desktop/main.js
+++ b/src/interface/desktop/main.js
@@ -440,7 +440,7 @@ let titleBarStyle = process.platform === 'win32' ? 'default' : 'hidden';
const {globalShortcut, clipboard} = require('electron'); // global shortcut and clipboard dependencies for shortcut window
const openShortcutWindowKeyBind = 'CommandOrControl+Shift+K'
-const createWindow = (tab = 'chat.html') => {
+const createWindow = (tab = 'settings.html') => {
win = new BrowserWindow({
width: 800,
height: 800,
@@ -602,6 +602,14 @@ app.whenReady().then(() => {
});
ipcMain.handle('deleteAllFiles', deleteAllFiles);
+ ipcMain.handle('openFile', async (_, path) => {
+ try {
+ await shell.openPath(path);
+ } catch (error) {
+ console.error('Error opening file:', error);
+ }
+ });
+
const mainWindow = createWindow();
app.setAboutPanelOptions({
@@ -652,7 +660,7 @@ app.whenReady().then(() => {
globalShortcut.unregister('Escape');
});
ipcMain.on('continue-conversation-button-clicked', () => {
- openWindow('chat.html');
+ openWindow('settings.html');
if (shortcutWin && !shortcutWin.isDestroyed()) {
shortcutWin.close();
}
@@ -727,8 +735,6 @@ app.whenReady().then(() => {
tray = new Tray(icon)
const contextMenu = Menu.buildFromTemplate([
- { label: 'Chat', type: 'normal', click: () => { openWindow('chat.html'); }},
- { label: 'Search', type: 'normal', click: () => { openWindow('search.html') }},
{ label: 'Configure', type: 'normal', click: () => { openWindow('settings.html') }},
{ type: 'separator' },
{ label: 'About Khoj', type: 'normal', click: () => { openAboutWindow(); } },
diff --git a/src/interface/desktop/preload.js b/src/interface/desktop/preload.js
index e8f13ff3..a2649609 100644
--- a/src/interface/desktop/preload.js
+++ b/src/interface/desktop/preload.js
@@ -83,4 +83,9 @@ contextBridge.exposeInMainWorld('appInfoAPI', {
contextBridge.exposeInMainWorld('navigateAPI', {
navigateToSettings: () => ipcRenderer.send('navigate', 'settings.html'),
navigateToWebSettings: () => ipcRenderer.send('navigateToWebApp', 'settings'),
+ navigateToWebHome: () => ipcRenderer.send('navigateToWebApp', ''),
})
+
+contextBridge.exposeInMainWorld('openFileAPI', {
+ openFile: (path) => ipcRenderer.invoke('openFile', path)
+});
diff --git a/src/interface/desktop/renderer.js b/src/interface/desktop/renderer.js
index 78387813..aa359274 100644
--- a/src/interface/desktop/renderer.js
+++ b/src/interface/desktop/renderer.js
@@ -26,37 +26,10 @@ async function removeFolder(folderPath) {
}
}
-const toggleFilesButton = document.getElementById('toggle-files');
const currentFiles = document.getElementById('current-files');
-const toggleFilesSVG = document.getElementById('toggle-files-svg');
-
-toggleFilesButton.addEventListener('click', () => {
- if (currentFiles.style.display === 'none') {
- currentFiles.style.display = 'block';
- toggleFilesSVG.style.transform = 'rotate(0deg)';
- } else {
- currentFiles.style.display = 'none';
- toggleFilesSVG.style.transform = 'rotate(180deg)';
- }
-});
-
-const toggleFoldersButton = document.getElementById('toggle-folders');
const currentFolders = document.getElementById('current-folders');
-const toggleFoldersSVG = document.getElementById('toggle-folders-svg');
-
-
-toggleFoldersButton.addEventListener('click', () => {
- if (currentFolders.style.display === 'none') {
- currentFolders.style.display = 'block';
- toggleFoldersSVG.style.transform = 'rotate(0deg)';
- } else {
- currentFolders.style.display = 'none';
- toggleFoldersSVG.style.transform = 'rotate(180deg)';
- }
-});
-
function makeFileElement(file) {
let fileElement = document.createElement("div");
fileElement.classList.add("file-element");
@@ -64,20 +37,34 @@ function makeFileElement(file) {
let fileNameElement = document.createElement("div");
fileNameElement.classList.add("content-name");
fileNameElement.innerHTML = file.path;
+ fileNameElement.style.cursor = "pointer";
+
+ fileNameElement.addEventListener("click", () => {
+ window.openFileAPI.openFile(file.path);
+ });
+
fileElement.appendChild(fileNameElement);
let buttonContainer = document.createElement("div");
buttonContainer.classList.add("remove-button-container");
let removeFileButton = document.createElement("button");
- let fileSyncedImage = document.createElement("img")
+ let fileSyncedImage = document.createElement("img");
fileSyncedImage.classList.add("file-synced-image");
+ fileSyncedImage.src = "./assets/icons/file-synced.svg";
+
+ // Create trash icon image
+ let trashIcon = document.createElement("img");
+ trashIcon.src = "./assets/icons/trash-solid.svg";
+ trashIcon.classList.add("trash-icon");
+
removeFileButton.classList.add("remove-file-button");
- removeFileButton.innerHTML = "🗑️";
+ removeFileButton.appendChild(trashIcon);
removeFileButton.addEventListener("click", () => {
removeFile(file.path);
});
+
buttonContainer.appendChild(removeFileButton);
- buttonContainer.insertAdjacentElement("afterbegin",fileSyncedImage);
+ buttonContainer.insertAdjacentElement("afterbegin", fileSyncedImage);
fileElement.appendChild(buttonContainer);
return fileElement;
}
@@ -89,13 +76,26 @@ function makeFolderElement(folder) {
let folderNameElement = document.createElement("div");
folderNameElement.classList.add("content-name");
folderNameElement.innerHTML = folder.path;
+ folderNameElement.style.cursor = "pointer";
+
+ folderNameElement.addEventListener("click", () => {
+ window.openFileAPI.openFile(folder.path);
+ });
+
folderElement.appendChild(folderNameElement);
let buttonContainer = document.createElement("div");
buttonContainer.classList.add("remove-button-container");
let removeFolderButton = document.createElement("button");
removeFolderButton.classList.add("remove-folder-button");
- removeFolderButton.innerHTML = "🗑️";
+
+ // Create trash icon image
+ let trashIcon = document.createElement("img");
+ trashIcon.src = "./assets/icons/trash-solid.svg";
+ trashIcon.classList.add("trash-icon");
+
+ removeFolderButton.appendChild(trashIcon);
+
removeFolderButton.addEventListener("click", () => {
removeFolder(folder.path);
});
@@ -104,7 +104,7 @@ function makeFolderElement(folder) {
return folderElement;
}
-(async function() {
+(async function () {
const files = await window.getFilesAPI.getFiles();
let currentFilesElement = document.getElementById("current-files");
for (const file of files) {
@@ -157,26 +157,35 @@ window.updateStateAPI.onUpdateState((event, state) => {
console.log("state was updated", state);
loadingBar.style.display = 'none';
let syncStatusElement = document.getElementById("sync-status");
+ syncStatusElement.innerHTML = '';
const currentTime = new Date();
nextSyncTime = new Date();
nextSyncTime.setMinutes(Math.ceil((nextSyncTime.getMinutes() + 1) / 10) * 10);
if (state.completed == false) {
- fileSyncedImage.forEach((image)=> {
+ fileSyncedImage.forEach((image) => {
image.style.display = "block"
image.src = "./assets/icons/file-not-synced.svg"
})
if (state.error) syncStatusElement.innerHTML = state.error;
return;
} else {
- fileSyncedImage.forEach((image)=> {
+ fileSyncedImage.forEach((image) => {
image.style.display = "block"
image.src = "./assets/icons/file-synced.svg"
})
}
const options = { hour: '2-digit', minute: '2-digit' };
- syncStatusElement.innerHTML = `⏱️ Synced at ${currentTime.toLocaleTimeString(undefined, options)}. Next sync at ${nextSyncTime.toLocaleTimeString(undefined, options)}.`;
+
+ const clockElement = document.createElement("div");
+ const clockIcon = document.createElement("img");
+ clockIcon.src = "./assets/icons/clock.svg";
+ clockIcon.classList.add("clock-icon");
+
+ clockElement.appendChild(clockIcon);
+ syncStatusElement.appendChild(clockElement);
+ syncStatusElement.innerHTML += ` Synced at ${currentTime.toLocaleTimeString(undefined, options)}. Next sync at ${nextSyncTime.toLocaleTimeString(undefined, options)}.`;
});
window.needsSubscriptionAPI.onNeedsSubscription((event, needsSubscription) => {
@@ -188,7 +197,7 @@ window.needsSubscriptionAPI.onNeedsSubscription((event, needsSubscription) => {
});
const urlInput = document.getElementById('khoj-host-url');
-(async function() {
+(async function () {
const url = await window.hostURLAPI.getURL();
urlInput.value = url;
})();
@@ -210,7 +219,7 @@ urlInput.addEventListener('blur', async () => {
});
const khojKeyInput = document.getElementById('khoj-access-key');
-(async function() {
+(async function () {
const token = await window.tokenAPI.getToken();
khojKeyInput.value = token;
})();
diff --git a/src/interface/desktop/search.html b/src/interface/desktop/search.html
deleted file mode 100644
index 792470a6..00000000
--- a/src/interface/desktop/search.html
+++ /dev/null
@@ -1,458 +0,0 @@
-
-
-
-
-
- Khoj - Search
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/src/interface/desktop/settings.html b/src/interface/desktop/settings.html
index f6a283d3..cc28627c 100644
--- a/src/interface/desktop/settings.html
+++ b/src/interface/desktop/settings.html
@@ -1,16 +1,264 @@
-
-
-
-
- Khoj - Settings
+
+
-
-
-
-
+
+
+
+ Khoj - Settings
+
+
+
+
-
-
+
+
+
-
-
-
-
-
- Server URL
-
-
-
-
-
-
-
-
- API Key
-
-
-
-
-
+
+
+ Server URL
+
+
+
+
+
+ API Key
+
+
+
+
+
-
-
-
-
-
- Files
-
-
-
-
-
-
-
-
- Add
-
-
-
-
+
-
-
-
-
-
- Folders
-
-
-
-
-
-
-
-
- Add
-
-
-
-
-
-
-
- 💾 Save
-
-
- 🗑️ Delete All
-
-
-
-
+
+
+
+
+
+ Force
+
+
+
+ Delete All
+
+
-
-
-
-
+
+
+
diff --git a/src/interface/desktop/utils.js b/src/interface/desktop/utils.js
index 84e50460..8d244ff1 100644
--- a/src/interface/desktop/utils.js
+++ b/src/interface/desktop/utils.js
@@ -31,7 +31,7 @@ function toggleNavMenu() {
}
// Close the dropdown menu if the user clicks outside of it
-document.addEventListener('click', function(event) {
+document.addEventListener('click', function (event) {
let menu = document.getElementById("khoj-nav-menu");
let menuContainer = document.getElementById("khoj-nav-menu-container");
let isClickOnMenu = menuContainer?.contains(event.target) || menuContainer === event.target;
@@ -56,25 +56,19 @@ async function populateHeaderPane() {
// Populate the header element with the navigation pane
return `
-
+
- ${
- userInfo && userInfo.email
- ? `
+ ${userInfo && userInfo.email
+ ? `
Connected to server
`
- : `
+ : `
Not connected to server
`
- }
-
-
- Chat
-
- ${has_documents ? '
Search ' : ''}
+ }
${username ? `
` : ''}