Fixed cursor location when navigating through previous commands. (#684)

microsoft · Feb 7, 2025 · 94f2808 · 94f2808
1 parent 23465b9
commit 94f2808
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 19 deletions.
diff --git a/ts/packages/shell/src/main/index.ts b/ts/packages/shell/src/main/index.ts
@@ -697,12 +697,28 @@ async function initialize() {
         ShellSettings.getinstance().save();
     });
 
+    ipcMain.on("open-image-file", async () => {
+        // TODO: imeplement
+        const result = await dialog.showOpenDialog(mainWindow);
+        if (result && !result.canceled) {
+            let paths = result.filePaths;
+            if (paths && paths.length > 0) {
+                const content = readFileSync(paths[0], "utf-8").toString();
+                console.log(content);
+                return content;
+            }
+        }
+
+        return null;
+    });
+
     ipcMain.on(
         "send-to-browser-ipc",
         async (_event, data: WebSocketMessageV2) => {
             await BrowserAgentIpc.getinstance().send(data);
         },
     );
+
     globalShortcut.register("Alt+Right", () => {
         chatView.webContents.send("send-demo-event", "Alt+Right");
     });

diff --git a/ts/packages/shell/src/renderer/src/chatInput.ts b/ts/packages/shell/src/renderer/src/chatInput.ts
@@ -80,10 +80,18 @@ export class ExpandableTextarea {
             this.textEntry.textContent = content;
         }
 
+        this.moveCursorToEnd();
+    }
+
+    public moveCursorToEnd() {
         // Set the cursor to the end of the text
         const r = document.createRange();
         if (this.textEntry.childNodes.length > 0) {
-            r.setEnd(this.textEntry.childNodes[0], content?.length ?? 0);
+            r.selectNode(this.textEntry);
+            r.setStartBefore(this.textEntry.childNodes[0]);
+            r.setEndAfter(
+                this.textEntry.childNodes[this.textEntry.childNodes.length - 1],
+            );
             r.collapse(false);
             const s = document.getSelection();
             if (s) {
@@ -151,14 +159,14 @@ export class ExpandableTextarea {
 
 export class ChatInput {
     private inputContainer: HTMLDivElement;
-    textarea: ExpandableTextarea;
+    public textarea: ExpandableTextarea;
     private micButton: HTMLButtonElement;
-    attachButton: HTMLLabelElement;
-    camButton: HTMLButtonElement;
+    public attachButton: HTMLButtonElement;
+    public camButton: HTMLButtonElement;
     private dragTemp: string | undefined = undefined;
-    private fileInput: HTMLInputElement;
+    //private fileInput: HTMLInputElement;
     public dragEnabled: boolean = true;
-    sendButton: HTMLButtonElement;
+    public sendButton: HTMLButtonElement;
     private separator: HTMLDivElement;
     private separatorContainer: HTMLDivElement;
     constructor(
@@ -255,17 +263,17 @@ export class ChatInput {
             e.preventDefault();
         };
 
-        this.fileInput = document.createElement("input");
-        this.fileInput.type = "file";
-        this.fileInput.classList.add("chat-message-hidden");
-        this.fileInput.id = "image_upload";
-        this.inputContainer.append(this.fileInput);
-        this.fileInput.accept = "image/*,.jpg,.png,.gif";
-        this.fileInput.onchange = () => {
-            if (this.fileInput.files && this.fileInput.files?.length > 0) {
-                this.loadImageFile(this.fileInput.files[0]);
-            }
-        };
+        // this.fileInput = document.createElement("input");
+        // this.fileInput.type = "file";
+        // this.fileInput.classList.add("chat-message-hidden");
+        // this.fileInput.id = "image_upload";
+        // this.inputContainer.append(this.fileInput);
+        // this.fileInput.accept = "image/*,.jpg,.png,.gif";
+        // this.fileInput.onchange = () => {
+        //     if (this.fileInput.files && this.fileInput.files?.length > 0) {
+        //         this.loadImageFile(this.fileInput.files[0]);
+        //     }
+        // };
 
         this.micButton = document.createElement("button");
         this.micButton.appendChild(iconMicrophone());
@@ -304,8 +312,8 @@ export class ChatInput {
         this.camButton.appendChild(iconCamera());
         this.camButton.className = "chat-input-button";
 
-        this.attachButton = document.createElement("label");
-        this.attachButton.htmlFor = this.fileInput.id;
+        this.attachButton = document.createElement("button");
+        //this.attachButton.htmlFor = this.fileInput.id;
         this.attachButton.appendChild(iconAttach());
         this.attachButton.className = "chat-input-button";
 

diff --git a/ts/packages/shell/src/renderer/src/chatView.ts b/ts/packages/shell/src/renderer/src/chatView.ts
@@ -153,6 +153,8 @@ export class ChatView {
                         this.chatInput.textarea.getTextEntry().innerHTML =
                             content;
 
+                        this.chatInput.textarea.moveCursorToEnd();
+
                         return false;
                     }
                 }

diff --git a/ts/packages/shell/src/renderer/src/main.ts b/ts/packages/shell/src/renderer/src/main.ts
@@ -446,6 +446,12 @@ document.addEventListener("DOMContentLoaded", async function () {
         cameraView.toggleVisibility();
     };
 
+    chatView.chatInput.attachButton.onclick = () => {
+        if ((window as any).electron) {
+            (window as any).electron.ipcRenderer.send("open-image-file");
+        }
+    };
+
     const settingsView = new SettingsView(chatView);
     chatView.settingsView = settingsView;
     tabs.getTabContainerByName("Settings").append(settingsView.getContainer());