Explorar el Código

fix(app): avoid unintended submits during IME composition (#6952)

MogamiTsuchikawa hace 1 mes
padre
commit
6b207b09d6
Se han modificado 1 ficheros con 21 adiciones y 1 borrados
  1. 21 1
      packages/app/src/components/prompt-input.tsx

+ 21 - 1
packages/app/src/components/prompt-input.tsx

@@ -1,5 +1,17 @@
 import { useFilteredList } from "@opencode-ai/ui/hooks"
 import { useFilteredList } from "@opencode-ai/ui/hooks"
-import { createEffect, on, Component, Show, For, onMount, onCleanup, Switch, Match, createMemo } from "solid-js"
+import {
+  createEffect,
+  on,
+  Component,
+  Show,
+  For,
+  onMount,
+  onCleanup,
+  Switch,
+  Match,
+  createMemo,
+  createSignal,
+} from "solid-js"
 import { createStore, produce } from "solid-js/store"
 import { createStore, produce } from "solid-js/store"
 import { createFocusSignal } from "@solid-primitives/active-element"
 import { createFocusSignal } from "@solid-primitives/active-element"
 import { useLocal } from "@/context/local"
 import { useLocal } from "@/context/local"
@@ -246,6 +258,8 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
   })
   })
 
 
   const isFocused = createFocusSignal(() => editorRef)
   const isFocused = createFocusSignal(() => editorRef)
+  const [composing, setComposing] = createSignal(false)
+  const isImeComposing = (event: KeyboardEvent) => event.isComposing || composing() || event.keyCode === 229
 
 
   const addImageAttachment = async (file: File) => {
   const addImageAttachment = async (file: File) => {
     if (!ACCEPTED_FILE_TYPES.includes(file.type)) return
     if (!ACCEPTED_FILE_TYPES.includes(file.type)) return
@@ -868,6 +882,10 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
       }
       }
     }
     }
 
 
+    if (event.key === "Enter" && isImeComposing(event)) {
+      return
+    }
+
     if (store.popover && (event.key === "ArrowUp" || event.key === "ArrowDown" || event.key === "Enter")) {
     if (store.popover && (event.key === "ArrowUp" || event.key === "ArrowDown" || event.key === "Enter")) {
       if (store.popover === "at") {
       if (store.popover === "at") {
         atOnKeyDown(event)
         atOnKeyDown(event)
@@ -1489,6 +1507,8 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
             }}
             }}
             contenteditable="true"
             contenteditable="true"
             onInput={handleInput}
             onInput={handleInput}
+            onCompositionStart={() => setComposing(true)}
+            onCompositionEnd={() => setComposing(false)}
             onKeyDown={handleKeyDown}
             onKeyDown={handleKeyDown}
             classList={{
             classList={{
               "select-text": true,
               "select-text": true,