fix: stabilize sql execution shortcuts (#29)

Co-authored-by: zihan.wu <zihan.wu@erry.com>

src/App.vue

@@ -45,6 +45,7 @@ import { getCurrentWebview } from "@tauri-apps/api/webview";
 import * as api from "@/lib/tauri";
 import { resolveExecutableSql } from "@/lib/sqlExecutionTarget";
 import type { SqlFormatDialect } from "@/lib/sqlFormatter";
+import { isCloseTabShortcut, isExecuteSqlShortcut } from "@/lib/keyboardShortcuts";
 
 const { t } = useI18n();
 const connectionStore = useConnectionStore();
@@ -508,12 +509,27 @@ function openLatestRelease() {
   open(url);
 }
 
+function isQueryEditorTarget(target: EventTarget | null): boolean {
+  return target instanceof Element && !!target.closest("[data-query-editor-root]");
+}
+
 function handleKeydown(e: KeyboardEvent) {
-  if (e.metaKey && e.key === "w") {
+  if (isCloseTabShortcut(e)) {
     e.preventDefault();
     if (queryStore.activeTabId) {
       queryStore.closeTab(queryStore.activeTabId);
     }
+    return;
+  }
+
+  if (
+    activeTab.value?.mode === "query"
+    && isExecuteSqlShortcut(e)
+    && isQueryEditorTarget(e.target)
+  ) {
+    e.preventDefault();
+    e.stopPropagation();
+    tryExecute();
   }
 }
 
@@ -521,13 +537,13 @@ onMounted(() => {
   applyTheme();
   connectionStore.initFromDisk();
   settingsStore.initAiConfig();
-  window.addEventListener("keydown", handleKeydown);
+  window.addEventListener("keydown", handleKeydown, true);
   setupFileDrop();
   checkUpdates({ silent: true });
 });
 
 onUnmounted(() => {
-  window.removeEventListener("keydown", handleKeydown);
+  window.removeEventListener("keydown", handleKeydown, true);
 });
 
 const DB_EXTENSIONS = [".db", ".sqlite", ".sqlite3", ".duckdb"];

src/components/editor/QueryEditor.vue

@@ -212,5 +212,5 @@ onBeforeUnmount(() => {
 </script>
 
 <template>
-  <div ref="editorRef" class="h-full w-full overflow-hidden" />
+  <div ref="editorRef" data-query-editor-root class="h-full w-full overflow-hidden" />
 </template>

src/lib/keyboardShortcuts.ts

@@ -0,0 +1,20 @@
+export interface ShortcutLikeEvent {
+  key: string;
+  metaKey?: boolean;
+  ctrlKey?: boolean;
+  altKey?: boolean;
+  isComposing?: boolean;
+}
+
+export function isExecuteSqlShortcut(event: ShortcutLikeEvent): boolean {
+  if (event.isComposing) return false;
+  if (event.altKey) return false;
+  if (!event.metaKey && !event.ctrlKey) return false;
+  return event.key === "Enter";
+}
+
+export function isCloseTabShortcut(event: ShortcutLikeEvent): boolean {
+  if (event.isComposing) return false;
+  if (!event.metaKey) return false;
+  return event.key.toLowerCase() === "w";
+}