sij/khoj
1
0
Fork 0
mirror of https://github.com/khoj-ai/khoj.git synced 2024-11-23 23:48:56 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 16

Improve delete, rename chat session UX in Desktop, Web app

Browse source 
- Ask for Confirmation before deleting chat session in Desktop, Web app
- Save chat session rename on hitting enter in title edit input box
- No need to flash previous conversation cleared status message
- Move chat session delete button after rename button in Desktop app
This commit is contained in:
Debanjum Singh Solanky 2024-03-15 13:49:47 +05:30
parent 924b1215ce
commit ec0c35b7ed
2 changed files with 34 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
src/interface/desktop/chat.html
View file

@ -794,7 +794,6 @@
chatBody.dataset.conversationId = "";
chatBody.dataset.conversationTitle = "";
loadChat();
flashStatusInChatInput("🗑 Cleared previous conversation history");
})
.catch(err => {
flashStatusInChatInput("⛔️ Failed to clear conversation history");
@ -856,28 +855,6 @@
let conversationMenu = document.createElement('div');
conversationMenu.classList.add("conversation-menu");
let deleteButton = document.createElement('button');
deleteButton.innerHTML = "Delete";
deleteButton.classList.add("delete-conversation-button");
deleteButton.classList.add("three-dot-menu-button-item");
deleteButton.addEventListener('click', function() {
let deleteURL = `/api/chat/history?client=web&conversation_id=${incomingConversationId}`;
fetch(`${hostURL}${deleteURL}` , { method: "DELETE", headers })
.then(response => response.ok ? response.json() : Promise.reject(response))
.then(data => {
let chatBody = document.getElementById("chat-body");
chatBody.innerHTML = "";
chatBody.dataset.conversationId = "";
chatBody.dataset.conversationTitle = "";
loadChat();
})
.catch(err => {
return;
});
});
conversationMenu.appendChild(deleteButton);
threeDotMenu.appendChild(conversationMenu);
let editTitleButton = document.createElement('button');
editTitleButton.innerHTML = "Rename";
editTitleButton.classList.add("edit-title-button");
@ -903,12 +880,13 @@
conversationTitleInput.addEventListener('click', function(event) {
event.stopPropagation();
});
conversationTitleInput.addEventListener('keydown', function(event) {
if (event.key === "Enter") {
event.preventDefault();
conversationTitleInputButton.click();
}
});
conversationTitleInputBox.appendChild(conversationTitleInput);
let conversationTitleInputButton = document.createElement('button');
conversationTitleInputButton.innerHTML = "Save";
@ -931,8 +909,35 @@
conversationTitleInputBox.appendChild(conversationTitleInputButton);
conversationMenu.appendChild(conversationTitleInputBox);
});
conversationMenu.appendChild(editTitleButton);
threeDotMenu.appendChild(conversationMenu);
let deleteButton = document.createElement('button');
deleteButton.innerHTML = "Delete";
deleteButton.classList.add("delete-conversation-button");
deleteButton.classList.add("three-dot-menu-button-item");
deleteButton.addEventListener('click', function() {
// Ask for confirmation before deleting chat session
let confirmation = confirm('Are you sure you want to delete this chat session?');
if (!confirmation) return;
let deleteURL = `/api/chat/history?client=web&conversation_id=${incomingConversationId}`;
fetch(`${hostURL}${deleteURL}` , { method: "DELETE", headers })
.then(response => response.ok ? response.json() : Promise.reject(response))
.then(data => {
let chatBody = document.getElementById("chat-body");
chatBody.innerHTML = "";
chatBody.dataset.conversationId = "";
chatBody.dataset.conversationTitle = "";
loadChat();
})
.catch(err => {
return;
});
});
conversationMenu.appendChild(deleteButton);
threeDotMenu.appendChild(conversationMenu);
});
threeDotMenu.appendChild(threeDotMenuButton);
conversationButton.appendChild(threeDotMenu);

6
src/khoj/interface/web/chat.html
View file

@ -1008,6 +1008,8 @@ To get started, just start typing below. You can also type / to see a list of co
conversationTitleInput.addEventListener('click', function(event) {
event.stopPropagation();
});
conversationTitleInput.addEventListener('keydown', function(event) {
if (event.key === "Enter") {
event.preventDefault();
conversationTitleInputButton.click();
@ -1044,6 +1046,9 @@ To get started, just start typing below. You can also type / to see a list of co
deleteButton.classList.add("delete-conversation-button");
deleteButton.classList.add("three-dot-menu-button-item");
deleteButton.addEventListener('click', function() {
// Ask for confirmation before deleting chat session
let confirmation = confirm('Are you sure you want to delete this chat session?');
if (!confirmation) return;
let deleteURL = `/api/chat/history?client=web&conversation_id=${incomingConversationId}`;
fetch(deleteURL , { method: "DELETE" })
.then(response => response.ok ? response.json() : Promise.reject(response))
@ -1053,7 +1058,6 @@ To get started, just start typing below. You can also type / to see a list of co
chatBody.dataset.conversationId = "";
chatBody.dataset.conversationTitle = "";
loadChat();
flashStatusInChatInput("🗑 Cleared previous conversation history");
})
.catch(err => {
flashStatusInChatInput("⛔️ Failed to clear conversation history");