From 23bd737f6be5b8513cc91d2087f63f93d9725b0a Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Wed, 29 Mar 2023 17:47:04 +0700
Subject: [PATCH] Use chat input element to send message on Enter. No send
 button required

---
 src/interface/obsidian/src/chat_modal.ts | 32 +++++++++++++++++-------
 1 file changed, 23 insertions(+), 9 deletions(-)

diff --git a/src/interface/obsidian/src/chat_modal.ts b/src/interface/obsidian/src/chat_modal.ts
index b583702c..b1cbabf9 100644
--- a/src/interface/obsidian/src/chat_modal.ts
+++ b/src/interface/obsidian/src/chat_modal.ts
@@ -9,6 +9,19 @@ export class KhojChatModal extends Modal {
     constructor(app: App, setting: KhojSetting) {
         super(app);
         this.setting = setting;
+
+        // Register Modal Keybindings to send user message
+        this.scope.register([], 'Enter', async () => {
+            // Get text in chat input elmenet
+            let input_el = <HTMLInputElement>this.contentEl.getElementsByClassName("khoj-chat-input")[0];
+
+            // Clear text after extracting message to send
+            let user_message = input_el.value;
+            input_el.value = "";
+
+            // Get and render chat response to user message
+            await this.getChatResponse(user_message);
+        });
     }
 
     async onOpen() {
@@ -30,16 +43,17 @@ export class KhojChatModal extends Modal {
         });
 
         // Add chat input field
-        new Setting(contentEl)
-            .addText((text) => {
-                text.onChange((value) => { this.result = value });
-                text.setPlaceholder("What is the meaning of life?");
+        contentEl.createEl("input",
+            {
+                attr: {
+                    type: "text",
+                    id: "khoj-chat-input",
+                    autofocus: "autofocus",
+                    placeholder: "What is the meaning of life? [Hit Enter to send message]",
+                    class: "khoj-chat-input option"
+                }
             })
-            .addButton((btn) => btn
-                .setButtonText("Send")
-                .setClass("khoj-chat-input-button")
-                .setCta()
-                .onClick(async () => { await this.getChatResponse(this.result) }));
+            .addEventListener('change', (event) => { this.result = (<HTMLInputElement>event.target).value });
 
         // Scroll to bottom of modal, till the send message input box
         this.modalEl.scrollTop = this.modalEl.scrollHeight;