Convert snake case to camel case in chat view of obsidian plugin

This commit is contained in:
Debanjum Singh Solanky
2024-07-23 14:36:53 +05:30
parent b224d7ffad
commit 8303b09129

View File

@@ -409,16 +409,16 @@ export class KhojChatView extends KhojPaneView {
message = DOMPurify.sanitize(message); message = DOMPurify.sanitize(message);
// Convert the message to html, sanitize the message html and render it to the real DOM // Convert the message to html, sanitize the message html and render it to the real DOM
let chat_message_body_text_el = this.contentEl.createDiv(); let chatMessageBodyTextEl = this.contentEl.createDiv();
chat_message_body_text_el.className = "chat-message-text-response"; chatMessageBodyTextEl.className = "chat-message-text-response";
chat_message_body_text_el.innerHTML = this.markdownTextToSanitizedHtml(message, this); chatMessageBodyTextEl.innerHTML = this.markdownTextToSanitizedHtml(message, this);
// Add a copy button to each chat message, if it doesn't already exist // Add a copy button to each chat message, if it doesn't already exist
if (willReplace === true) { if (willReplace === true) {
this.renderActionButtons(message, chat_message_body_text_el); this.renderActionButtons(message, chatMessageBodyTextEl);
} }
return chat_message_body_text_el; return chatMessageBodyTextEl;
} }
markdownTextToSanitizedHtml(markdownText: string, component: ItemView): string { markdownTextToSanitizedHtml(markdownText: string, component: ItemView): string {
@@ -502,23 +502,23 @@ export class KhojChatView extends KhojPaneView {
class: `khoj-chat-message ${sender}` class: `khoj-chat-message ${sender}`
}, },
}) })
let chat_message_body_el = chatMessageEl.createDiv(); let chatMessageBodyEl = chatMessageEl.createDiv();
chat_message_body_el.addClasses(["khoj-chat-message-text", sender]); chatMessageBodyEl.addClasses(["khoj-chat-message-text", sender]);
let chat_message_body_text_el = chat_message_body_el.createDiv(); let chatMessageBodyTextEl = chatMessageBodyEl.createDiv();
// Sanitize the markdown to render // Sanitize the markdown to render
message = DOMPurify.sanitize(message); message = DOMPurify.sanitize(message);
if (raw) { if (raw) {
chat_message_body_text_el.innerHTML = message; chatMessageBodyTextEl.innerHTML = message;
} else { } else {
// @ts-ignore // @ts-ignore
chat_message_body_text_el.innerHTML = this.markdownTextToSanitizedHtml(message, this); chatMessageBodyTextEl.innerHTML = this.markdownTextToSanitizedHtml(message, this);
} }
// Add action buttons to each chat message element // Add action buttons to each chat message element
if (willReplace === true) { if (willReplace === true) {
this.renderActionButtons(message, chat_message_body_text_el); this.renderActionButtons(message, chatMessageBodyTextEl);
} }
// Remove user-select: none property to make text selectable // Remove user-select: none property to make text selectable
@@ -531,14 +531,14 @@ export class KhojChatView extends KhojPaneView {
} }
createKhojResponseDiv(dt?: Date): HTMLDivElement { createKhojResponseDiv(dt?: Date): HTMLDivElement {
let message_time = this.formatDate(dt ?? new Date()); let messageTime = this.formatDate(dt ?? new Date());
// Append message to conversation history HTML element. // Append message to conversation history HTML element.
// The chat logs should display above the message input box to follow standard UI semantics // The chat logs should display above the message input box to follow standard UI semantics
let chat_body_el = this.contentEl.getElementsByClassName("khoj-chat-body")[0]; let chatBodyEl = this.contentEl.getElementsByClassName("khoj-chat-body")[0];
let chat_message_el = chat_body_el.createDiv({ let chatMessageEl = chatBodyEl.createDiv({
attr: { attr: {
"data-meta": `🏮 Khoj at ${message_time}`, "data-meta": `🏮 Khoj at ${messageTime}`,
class: `khoj-chat-message khoj` class: `khoj-chat-message khoj`
}, },
}).createDiv({ }).createDiv({
@@ -550,7 +550,7 @@ export class KhojChatView extends KhojPaneView {
// Scroll to bottom after inserting chat messages // Scroll to bottom after inserting chat messages
this.scrollChatToBottom(); this.scrollChatToBottom();
return chat_message_el; return chatMessageEl;
} }
async renderIncrementalMessage(htmlElement: HTMLDivElement, additionalMessage: string) { async renderIncrementalMessage(htmlElement: HTMLDivElement, additionalMessage: string) {
@@ -566,7 +566,7 @@ export class KhojChatView extends KhojPaneView {
this.scrollChatToBottom(); this.scrollChatToBottom();
} }
renderActionButtons(message: string, chat_message_body_text_el: HTMLElement) { renderActionButtons(message: string, chatMessageBodyTextEl: HTMLElement) {
let copyButton = this.contentEl.createEl('button'); let copyButton = this.contentEl.createEl('button');
copyButton.classList.add("chat-action-button"); copyButton.classList.add("chat-action-button");
copyButton.title = "Copy Message to Clipboard"; copyButton.title = "Copy Message to Clipboard";
@@ -593,10 +593,10 @@ export class KhojChatView extends KhojPaneView {
} }
// Append buttons to parent element // Append buttons to parent element
chat_message_body_text_el.append(copyButton, pasteToFile); chatMessageBodyTextEl.append(copyButton, pasteToFile);
if (speechButton) { if (speechButton) {
chat_message_body_text_el.append(speechButton); chatMessageBodyTextEl.append(speechButton);
} }
} }
@@ -895,16 +895,16 @@ export class KhojChatView extends KhojPaneView {
let chatBodyEl = this.contentEl.getElementsByClassName("khoj-chat-body")[0] as HTMLElement; let chatBodyEl = this.contentEl.getElementsByClassName("khoj-chat-body")[0] as HTMLElement;
this.renderMessage(chatBodyEl, query, "you"); this.renderMessage(chatBodyEl, query, "you");
let conversationID = chatBodyEl.dataset.conversationId; let conversationId = chatBodyEl.dataset.conversationId;
if (!conversationID) { if (!conversationId) {
let chatUrl = `${this.setting.khojUrl}/api/chat/sessions?client=obsidian`; let chatUrl = `${this.setting.khojUrl}/api/chat/sessions?client=obsidian`;
let response = await fetch(chatUrl, { let response = await fetch(chatUrl, {
method: "POST", method: "POST",
headers: { "Authorization": `Bearer ${this.setting.khojApiKey}` }, headers: { "Authorization": `Bearer ${this.setting.khojApiKey}` },
}); });
let data = await response.json(); let data = await response.json();
conversationID = data.conversation_id; conversationId = data.conversation_id;
chatBodyEl.dataset.conversationId = conversationID; chatBodyEl.dataset.conversationId = conversationId;
} }
// Get chat response from Khoj backend // Get chat response from Khoj backend