From 7ff4d9f804e2090bff84f1fe6d3d66b19e4a64ab Mon Sep 17 00:00:00 2001
From: ahua <50774091+ahua8522@users.noreply.github.com>
Date: Mon, 6 Jul 2026 18:47:45 +0800
Subject: [PATCH] fix(sqlfile): make folder list update reactively

---
 apps/desktop/src/App.vue                      |  18 +-
 .../src/components/layout/AppToolbar.vue      |  13 +-
 .../src/components/layout/SqlFilePanel.vue    | 235 ++++++++++++++++++
 .../desktop/src/composables/usePanelResize.ts |   4 +
 apps/desktop/src/i18n/locales/en.ts           |  13 +
 apps/desktop/src/i18n/locales/es.ts           |  13 +
 apps/desktop/src/i18n/locales/it.ts           |  13 +
 apps/desktop/src/i18n/locales/ja.ts           |  13 +
 apps/desktop/src/i18n/locales/pt-BR.ts        |  13 +
 apps/desktop/src/i18n/locales/zh-CN.ts        |  13 +
 apps/desktop/src/i18n/locales/zh-TW.ts        |  13 +
 apps/desktop/src/lib/backend/api.ts           |   2 +
 apps/desktop/src/lib/backend/http.ts          |  11 +
 apps/desktop/src/lib/backend/tauri.ts         |  11 +
 src-tauri/src/commands/list_sql_files.rs      | 118 +++++++++
 src-tauri/src/commands/mod.rs                 |   1 +
 src-tauri/src/lib.rs                          |   1 +
 17 files changed, 503 insertions(+), 2 deletions(-)
 create mode 100644 apps/desktop/src/components/layout/SqlFilePanel.vue
 create mode 100644 src-tauri/src/commands/list_sql_files.rs

diff --git a/apps/desktop/src/App.vue b/apps/desktop/src/App.vue
index 189476fe76..718cce8409 100644
--- a/apps/desktop/src/App.vue
+++ b/apps/desktop/src/App.vue
@@ -90,6 +90,7 @@ import type { AiAction } from "@/lib/ai/ai";
 const AiAssistant = defineAsyncComponent(() => import("@/components/editor/AiAssistant.vue"));
 const QueryHistory = defineAsyncComponent(() => import("@/components/editor/QueryHistory.vue"));
 const SqlLibraryPanel = defineAsyncComponent(() => import("@/components/layout/SqlLibraryPanel.vue"));
+const SqlFilePanel = defineAsyncComponent(() => import("@/components/layout/SqlFilePanel.vue"));
 const DriverStorePage = defineAsyncComponent(() => import("@/components/config/DriverStoreDialog.vue"));
 const EditorSettingsPage = defineAsyncComponent(() => import("@/components/editor/EditorSettingsDialog.vue"));
 const UpdateDialog = defineAsyncComponent(() => import("@/components/layout/UpdateDialog.vue"));
@@ -136,9 +137,10 @@ const agentDriverUpdateCount = ref(0);
 const showHistory = ref(false);
 const showAiPanel = ref(safeLocalStorageGet("dbx-ai-panel-open") === "true");
 const showSqlLibraryPanel = ref(safeLocalStorageGet("dbx-sql-library-open") === "true");
+const showSqlFilePanel = ref(safeLocalStorageGet("dbx-sql-file-panel-open") === "true");
 const sidebarOpen = ref(safeLocalStorageGet("dbx-sidebar-open") !== "false");
 const aiPanelReady = ref(false);
-const { sidebarWidth, aiPanelWidth, historyWidth, sqlLibraryWidth, startSidebarResize, startAiPanelResize, startHistoryResize, startSqlLibraryResize } = usePanelResize();
+const { sidebarWidth, aiPanelWidth, historyWidth, sqlLibraryWidth, sqlFilePanelWidth, startSidebarResize, startAiPanelResize, startHistoryResize, startSqlLibraryResize, startSqlFilePanelResize } = usePanelResize();
 const aiAssistantRef = ref<AiAssistantHandle | null>(null);
 const appSidebarRef = ref<InstanceType<typeof AppSidebar> | null>(null);
 const contentAreaRef = ref<InstanceType<typeof ContentArea> | null>(null);
@@ -465,6 +467,11 @@ function toggleSqlLibrary() {
   safeLocalStorageSet("dbx-sql-library-open", String(showSqlLibraryPanel.value));
 }
 
+function toggleSqlFilePanel() {
+  showSqlFilePanel.value = !showSqlFilePanel.value;
+  safeLocalStorageSet("dbx-sql-file-panel-open", String(showSqlFilePanel.value));
+}
+
 function fixWithAi(errorMessage: string) {
   if (!showAiPanel.value) {
     showAiPanel.value = true;
@@ -1719,6 +1726,7 @@ onUnmounted(() => {
           :show-ai-panel="showAiPanel"
           :show-history="showHistory"
           :show-sql-library="showSqlLibraryPanel"
+          :show-sql-file-panel="showSqlFilePanel"
           :show-driver-store="showDriverStore"
           :show-settings-page="showSettingsPage"
           :checking-updates="checkingUpdates"
@@ -1732,6 +1740,7 @@ onUnmounted(() => {
           @toggle-ai="toggleAiPanel"
           @toggle-history="showHistory = !showHistory"
           @toggle-sql-library="toggleSqlLibrary"
+          @toggle-sql-file-panel="toggleSqlFilePanel"
           @open-github="openGitHub"
           @open-settings="openSettings()"
           @open-driver-store="openDriverStorePage"
@@ -1923,6 +1932,13 @@ onUnmounted(() => {
               <SqlLibraryPanel @close="toggleSqlLibrary" />
             </div>
           </div>
+
+          <div v-if="showSqlFilePanel" :class="isClassicLayout ? 'h-full shrink-0 relative z-30 isolate bg-background' : 'h-full shrink-0 relative z-30 isolate rounded-md border border-border/80 bg-background'" :style="{ width: sqlFilePanelWidth + 'px' }">
+            <div class="panel-resize-handle panel-resize-handle--left" @mousedown="startSqlFilePanelResize" />
+            <div class="h-full min-h-0 overflow-hidden">
+              <SqlFilePanel @close="toggleSqlFilePanel" />
+            </div>
+          </div>
         </div>
 
         <AppDialogs
diff --git a/apps/desktop/src/components/layout/AppToolbar.vue b/apps/desktop/src/components/layout/AppToolbar.vue
index e156cfe240..5362bfd89e 100644
--- a/apps/desktop/src/components/layout/AppToolbar.vue
+++ b/apps/desktop/src/components/layout/AppToolbar.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { computed, ref, onMounted, onBeforeUnmount, h } from "vue";
 import { useI18n } from "vue-i18n";
-import { DatabaseZap, FilePlus2, Loader2, Moon, Sun, SunMoon, History, Bot, ArrowLeftRight, FileCode, BookMarked, GitCompareArrows, TableProperties, Settings, CloudDownload, Package, FileDown } from "@lucide/vue";
+import { DatabaseZap, FilePlus2, Loader2, Moon, Sun, SunMoon, History, Bot, ArrowLeftRight, FileCode, BookMarked, GitCompareArrows, TableProperties, Settings, CloudDownload, Package, FileDown, FolderTree } from "@lucide/vue";
 import { Button } from "@/components/ui/button";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import LightDropdown from "@/components/ui/LightDropdown.vue";
@@ -28,6 +28,7 @@ const props = defineProps<{
   showAiPanel: boolean;
   showHistory: boolean;
   showSqlLibrary: boolean;
+  showSqlFilePanel: boolean;
   showDriverStore: boolean;
   showSettingsPage: boolean;
   checkingUpdates: boolean;
@@ -44,6 +45,7 @@ const emit = defineEmits<{
   "toggle-ai": [];
   "toggle-history": [];
   "toggle-sql-library": [];
+  "toggle-sql-file-panel": [];
   "open-github": [];
   "open-settings": [];
   "open-driver-store": [];
@@ -449,6 +451,15 @@ const toolbarDropdownTriggerClass = `inline-flex h-8 items-center gap-1 rounded-
         <TooltipContent>{{ t("sqlLibrary.title") }}</TooltipContent>
       </Tooltip>
 
+      <Tooltip>
+        <TooltipTrigger as-child>
+          <Button variant="ghost" size="icon" class="h-8 w-8 shrink-0" :class="{ 'bg-accent': showSqlFilePanel }" @click="emit('toggle-sql-file-panel')">
+            <FolderTree class="h-4 w-4" />
+          </Button>
+        </TooltipTrigger>
+        <TooltipContent>{{ t("sqlFileTree.title") }}</TooltipContent>
+      </Tooltip>
+
       <Tooltip v-if="toolbarItems.history">
         <TooltipTrigger as-child>
           <Button v-show="isRightItemVisible('history')" variant="ghost" size="icon" class="h-8 w-8 shrink-0" :class="{ 'bg-accent': showHistory }" @click="emit('toggle-history')">
diff --git a/apps/desktop/src/components/layout/SqlFilePanel.vue b/apps/desktop/src/components/layout/SqlFilePanel.vue
new file mode 100644
index 0000000000..51913f1370
--- /dev/null
+++ b/apps/desktop/src/components/layout/SqlFilePanel.vue
@@ -0,0 +1,235 @@
+<script setup lang="ts">
+import { ref, onMounted } from "vue";
+import { useI18n } from "vue-i18n";
+import { FolderOpen, FileCode, FolderClosed, ChevronRight, ChevronDown, X, Trash2 } from "@lucide/vue";
+import { Button } from "@/components/ui/button";
+import LightTooltip from "@/components/ui/LightTooltip.vue";
+import { useQueryStore } from "@/stores/queryStore";
+import { useConnectionStore } from "@/stores/connectionStore";
+import { useToast } from "@/composables/useToast";
+import { isTauriRuntime } from "@/lib/backend/tauriRuntime";
+import { safeLocalStorageGet, safeLocalStorageSet } from "@/lib/backend/safeStorage";
+import { resolveDefaultDatabase } from "@/lib/database/defaultDatabase";
+import * as api from "@/lib/backend/api";
+import type { SqlFileEntry } from "@/lib/backend/api";
+
+const STORAGE_KEY = "dbx-sql-file-folders";
+
+const emit = defineEmits<{
+  close: [];
+}>();
+
+const { t } = useI18n();
+const queryStore = useQueryStore();
+const connectionStore = useConnectionStore();
+const { toast } = useToast();
+
+interface FolderState {
+  path: string;
+  entries: SqlFileEntry[];
+  expanded: Set<string>;
+  loading: boolean;
+  collapsed: boolean;
+}
+
+const folders = ref<FolderState[]>([]);
+
+function loadSavedFolders(): string[] {
+  try {
+    const raw = safeLocalStorageGet(STORAGE_KEY);
+    if (!raw) return [];
+    const parsed = JSON.parse(raw);
+    return Array.isArray(parsed) ? parsed.filter((p): p is string => typeof p === "string") : [];
+  } catch {
+    return [];
+  }
+}
+
+function saveFolders() {
+  const paths = folders.value.map((f) => f.path);
+  safeLocalStorageSet(STORAGE_KEY, JSON.stringify(paths));
+}
+
+async function pickFolder() {
+  if (!isTauriRuntime()) {
+    toast(t("sqlFileTree.desktopOnly"), 3000);
+    return;
+  }
+  try {
+    const { open } = await import("@tauri-apps/plugin-dialog");
+    const selected = await open({ directory: true, multiple: false });
+    if (!selected) return;
+    const folderPath = selected as string;
+    if (folders.value.some((f) => f.path === folderPath)) {
+      toast(t("sqlFileTree.folderAlreadyOpen"), 2000);
+      return;
+    }
+    await addFolder(folderPath);
+  } catch (e: any) {
+    toast(t("sqlFileTree.openFailed", { message: e?.message || String(e) }), 5000);
+  }
+}
+
+async function addFolder(folderPath: string) {
+  const folder: FolderState = {
+    path: folderPath,
+    entries: [],
+    expanded: new Set(),
+    loading: true,
+    collapsed: false,
+  };
+  folders.value.push(folder);
+  saveFolders();
+  try {
+    const entries = await api.listSqlFilesInFolder(folderPath);
+    // Mutate via the reactive proxy (folders.value[idx]) so Vue tracks the
+    // change. Mutating the local `folder` object bypasses the proxy and the
+    // view never updates until some other reactive write forces a re-render.
+    const idx = folders.value.findIndex((f) => f.path === folderPath);
+    if (idx !== -1) {
+      folders.value[idx].entries = entries;
+    }
+  } catch (e: any) {
+    toast(t("sqlFileTree.loadFailed", { message: e?.message || String(e) }), 5000);
+  } finally {
+    const idx = folders.value.findIndex((f) => f.path === folderPath);
+    if (idx !== -1) {
+      folders.value[idx].loading = false;
+    }
+  }
+}
+
+async function removeFolder(index: number) {
+  folders.value.splice(index, 1);
+  saveFolders();
+}
+
+function toggleExpand(folder: FolderState, path: string) {
+  const next = new Set(folder.expanded);
+  if (next.has(path)) {
+    next.delete(path);
+  } else {
+    next.add(path);
+  }
+  folder.expanded = next;
+}
+
+function toggleFolderCollapse(folder: FolderState) {
+  folder.collapsed = !folder.collapsed;
+}
+
+async function openFile(path: string) {
+  if (!isTauriRuntime()) return;
+  try {
+    const content = await api.readExternalSqlFile(path);
+    const connectionId = connectionStore.activeConnectionId || connectionStore.connections[0]?.id || "";
+    const connection = connectionId ? connectionStore.getConfig(connectionId) : undefined;
+    const database = connection ? resolveDefaultDatabase(connection, []) : "";
+    const name = path.split("\\").pop()?.split("/").pop() || "script.sql";
+    const tabId = queryStore.createTab(connectionId, database, name, "query");
+    queryStore.updateSql(tabId, content);
+    queryStore.linkExternalSqlPath(tabId, path, name);
+  } catch (e: any) {
+    toast(t("toolbar.sqlOpenFailed", { message: e?.message || String(e) }), 5000);
+  }
+}
+
+function folderName(path: string): string {
+  const normalized = path.replace(/\\/g, "/");
+  const parts = normalized.split("/").filter(Boolean);
+  return parts.pop() || path;
+}
+
+onMounted(async () => {
+  const saved = loadSavedFolders();
+  for (const path of saved) {
+    await addFolder(path);
+  }
+});
+
+type TreeEntry = { entry: SqlFileEntry; depth: number };
+function flatTree(entries: SqlFileEntry[], expanded: Set<string>): TreeEntry[] {
+  const result: TreeEntry[] = [];
+  function walk(items: SqlFileEntry[], depth: number) {
+    for (const item of items) {
+      result.push({ entry: item, depth });
+      if (item.is_dir && expanded.has(item.path)) {
+        walk(item.children, depth + 1);
+      }
+    }
+  }
+  walk(entries, 0);
+  return result;
+}
+</script>
+
+<template>
+  <div class="h-full flex flex-col overflow-hidden">
+    <div class="flex items-center gap-px px-3 text-xs font-medium text-muted-foreground border-b bg-muted/20 h-10 shrink-0">
+      <span class="flex self-stretch items-center truncate">{{ t("sqlFileTree.title") }}</span>
+      <span class="flex-1 self-stretch" />
+      <LightTooltip :text="t('sqlFileTree.openFolder')" side="bottom" :delay="0" :close-delay="0" nowrap>
+        <Button variant="ghost" size="icon" class="h-5 w-5" @click="pickFolder">
+          <FolderOpen class="h-3.5 w-3.5" />
+        </Button>
+      </LightTooltip>
+      <LightTooltip :text="t('sqlFileTree.closePanel')" side="bottom" :delay="0" :close-delay="0" nowrap>
+        <Button variant="ghost" size="icon" class="h-5 w-5" @click="emit('close')">
+          <X class="h-3.5 w-3.5" />
+        </Button>
+      </LightTooltip>
+    </div>
+
+    <div v-if="folders.length === 0" class="flex-1 flex flex-col items-center justify-center gap-2 p-4 text-xs text-muted-foreground">
+      <FolderOpen class="h-8 w-8 text-muted-foreground/40" />
+      <span>{{ t("sqlFileTree.noFolder") }}</span>
+      <Button variant="outline" size="sm" class="h-7 text-xs" @click="pickFolder"> <FolderOpen class="h-3.5 w-3.5 mr-1" />{{ t("sqlFileTree.openFolder") }} </Button>
+    </div>
+
+    <div v-else class="flex-1 overflow-y-auto">
+      <div v-for="(folder, fi) in folders" :key="folder.path" class="border-b last:border-b-0">
+        <div class="flex items-center gap-1 px-2 py-1.5 text-[11px] font-medium text-muted-foreground bg-muted/10 sticky top-0 cursor-pointer select-none hover:bg-muted/30" @click="toggleFolderCollapse(folder)">
+          <ChevronRight v-if="folder.collapsed" class="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
+          <ChevronDown v-else class="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
+          <FolderOpen class="h-3.5 w-3.5 shrink-0 text-amber-500" />
+          <span class="truncate shrink-0" :title="folder.path">{{ folderName(folder.path) }}</span>
+          <span class="truncate flex-1 text-[10px] text-muted-foreground/50" :title="folder.path">{{ folder.path }}</span>
+          <LightTooltip :text="t('sqlFileTree.removeFolder')" side="bottom" :delay="0" :close-delay="0" nowrap>
+            <Button variant="ghost" size="icon" class="h-4 w-4 shrink-0 text-muted-foreground hover:text-destructive" @click.stop="removeFolder(fi)">
+              <Trash2 class="h-3 w-3" />
+            </Button>
+          </LightTooltip>
+        </div>
+        <div v-show="!folder.collapsed">
+          <div v-if="folder.loading" class="px-3 py-2 text-xs text-muted-foreground">
+            {{ t("sqlFileTree.loading") }}
+          </div>
+          <div v-else-if="folder.entries.length === 0" class="px-3 py-2 text-xs text-muted-foreground">
+            {{ t("sqlFileTree.noSqlFiles") }}
+          </div>
+          <div v-else>
+            <div
+              v-for="{ entry, depth } in flatTree(folder.entries, folder.expanded)"
+              :key="entry.path"
+              class="flex items-center gap-1 px-2 py-1 cursor-pointer rounded-sm hover:bg-muted/60 text-sm"
+              :style="{ paddingLeft: depth * 16 + 8 + 'px' }"
+              @click="entry.is_dir ? toggleExpand(folder, entry.path) : openFile(entry.path)"
+            >
+              <template v-if="entry.is_dir">
+                <ChevronRight v-if="!folder.expanded.has(entry.path)" class="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
+                <ChevronDown v-else class="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
+                <FolderClosed v-if="!folder.expanded.has(entry.path)" class="h-4 w-4 shrink-0 text-amber-500" />
+                <FolderOpen v-else class="h-4 w-4 shrink-0 text-amber-500" />
+              </template>
+              <template v-else>
+                <span class="w-3.5 shrink-0" />
+                <FileCode class="h-4 w-4 shrink-0 text-blue-500" />
+              </template>
+              <span class="truncate ml-1">{{ entry.name }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/apps/desktop/src/composables/usePanelResize.ts b/apps/desktop/src/composables/usePanelResize.ts
index b9465b0600..9b4650597b 100644
--- a/apps/desktop/src/composables/usePanelResize.ts
+++ b/apps/desktop/src/composables/usePanelResize.ts
@@ -6,6 +6,7 @@ export function usePanelResize() {
   const aiPanelWidth = ref(Number(safeLocalStorageGet("dbx-ai-panel-width")) || 360);
   const historyWidth = ref(Number(safeLocalStorageGet("dbx-history-width")) || 288);
   const sqlLibraryWidth = ref(Number(safeLocalStorageGet("dbx-sql-library-width")) || 288);
+  const sqlFilePanelWidth = ref(Number(safeLocalStorageGet("dbx-sql-file-panel-width")) || 288);
 
   function startPanelResize(widthRef: Ref<number>, storageKey: string, direction: "left" | "right") {
     return (e: MouseEvent) => {
@@ -33,15 +34,18 @@ export function usePanelResize() {
   const startAiPanelResize = startPanelResize(aiPanelWidth, "dbx-ai-panel-width", "left");
   const startHistoryResize = startPanelResize(historyWidth, "dbx-history-width", "left");
   const startSqlLibraryResize = startPanelResize(sqlLibraryWidth, "dbx-sql-library-width", "left");
+  const startSqlFilePanelResize = startPanelResize(sqlFilePanelWidth, "dbx-sql-file-panel-width", "left");
 
   return {
     sidebarWidth,
     aiPanelWidth,
     historyWidth,
     sqlLibraryWidth,
+    sqlFilePanelWidth,
     startSidebarResize,
     startAiPanelResize,
     startHistoryResize,
     startSqlLibraryResize,
+    startSqlFilePanelResize,
   };
 }
diff --git a/apps/desktop/src/i18n/locales/en.ts b/apps/desktop/src/i18n/locales/en.ts
index 30a8653419..86630dc1c7 100644
--- a/apps/desktop/src/i18n/locales/en.ts
+++ b/apps/desktop/src/i18n/locales/en.ts
@@ -2443,6 +2443,19 @@ export default {
       cancelled: "Cancelled",
     },
   },
+  sqlFileTree: {
+    title: "SQL Files",
+    openFolder: "Open Folder",
+    closePanel: "Close",
+    loading: "Loading...",
+    noFolder: "No folder opened",
+    noSqlFiles: "No SQL files found",
+    folderAlreadyOpen: "This folder is already open",
+    removeFolder: "Remove folder",
+    openFailed: "Failed to open folder: {message}",
+    loadFailed: "Failed to load SQL files: {message}",
+    desktopOnly: "This feature is only available on desktop",
+  },
   diff: {
     title: "Compare Schemas",
     source: "Source",
diff --git a/apps/desktop/src/i18n/locales/es.ts b/apps/desktop/src/i18n/locales/es.ts
index c85938e366..0e94386ad4 100644
--- a/apps/desktop/src/i18n/locales/es.ts
+++ b/apps/desktop/src/i18n/locales/es.ts
@@ -3384,4 +3384,17 @@ export default withEnglishFallback({
     noAvailable: "Todas las extensiones disponibles ya están instaladas.",
     noInstalled: "Aún no hay extensiones instaladas.",
   },
+  sqlFileTree: {
+    title: "Archivos SQL",
+    openFolder: "Abrir carpeta",
+    closePanel: "Cerrar",
+    loading: "Cargando...",
+    noFolder: "Sin carpeta abierta",
+    noSqlFiles: "No se encontraron archivos SQL",
+    folderAlreadyOpen: "Esta carpeta ya está abierta",
+    removeFolder: "Eliminar carpeta",
+    openFailed: "Error al abrir la carpeta: {message}",
+    loadFailed: "Error al cargar archivos SQL: {message}",
+    desktopOnly: "Esta función solo está disponible en la versión de escritorio",
+  },
 });
diff --git a/apps/desktop/src/i18n/locales/it.ts b/apps/desktop/src/i18n/locales/it.ts
index 7edad0ae0e..9979e671f1 100644
--- a/apps/desktop/src/i18n/locales/it.ts
+++ b/apps/desktop/src/i18n/locales/it.ts
@@ -3382,4 +3382,17 @@ export default withEnglishFallback({
     noAvailable: "Tutte le estensioni disponibili sono installate.",
     noInstalled: "Nessuna estensione installata.",
   },
+  sqlFileTree: {
+    title: "File SQL",
+    openFolder: "Apri cartella",
+    closePanel: "Chiudi",
+    loading: "Caricamento in corso...",
+    noFolder: "Nessuna cartella aperta",
+    noSqlFiles: "Nessun file SQL trovato",
+    folderAlreadyOpen: "Questa cartella è già aperta",
+    removeFolder: "Rimuovi cartella",
+    openFailed: "Apertura cartella fallita: {message}",
+    loadFailed: "Caricamento file SQL fallito: {message}",
+    desktopOnly: "Questa funzionalità è disponibile solo su desktop",
+  },
 });
diff --git a/apps/desktop/src/i18n/locales/ja.ts b/apps/desktop/src/i18n/locales/ja.ts
index 9f87ea63f3..12318a554e 100644
--- a/apps/desktop/src/i18n/locales/ja.ts
+++ b/apps/desktop/src/i18n/locales/ja.ts
@@ -3382,4 +3382,17 @@ export default withEnglishFallback({
     noAvailable: "すべての利用可能な拡張機能がインストールされています。",
     noInstalled: "インストールされている拡張機能はありません。",
   },
+  sqlFileTree: {
+    title: "SQL ファイル",
+    openFolder: "フォルダを開く",
+    closePanel: "閉じる",
+    loading: "読み込み中...",
+    noFolder: "フォルダが開かれていません",
+    noSqlFiles: "SQL ファイルが見つかりません",
+    folderAlreadyOpen: "このフォルダは既に開いています",
+    removeFolder: "フォルダを削除",
+    openFailed: "フォルダを開くのに失敗しました: {message}",
+    loadFailed: "SQL ファイルの読み込みに失敗しました: {message}",
+    desktopOnly: "この機能はデスクトップ版のみで利用可能です",
+  },
 });
diff --git a/apps/desktop/src/i18n/locales/pt-BR.ts b/apps/desktop/src/i18n/locales/pt-BR.ts
index 145702466c..b20843a4f6 100644
--- a/apps/desktop/src/i18n/locales/pt-BR.ts
+++ b/apps/desktop/src/i18n/locales/pt-BR.ts
@@ -3383,4 +3383,17 @@ export default withEnglishFallback({
     noAvailable: "Todas as extensões disponíveis já estão instaladas.",
     noInstalled: "Nenhuma extensão instalada.",
   },
+  sqlFileTree: {
+    title: "Arquivos SQL",
+    openFolder: "Abrir pasta",
+    closePanel: "Fechar",
+    loading: "Carregando...",
+    noFolder: "Nenhuma pasta aberta",
+    noSqlFiles: "Nenhum arquivo SQL encontrado",
+    folderAlreadyOpen: "Esta pasta já está aberta",
+    removeFolder: "Remover pasta",
+    openFailed: "Falha ao abrir a pasta: {message}",
+    loadFailed: "Falha ao carregar arquivos SQL: {message}",
+    desktopOnly: "Recurso disponível apenas no desktop",
+  },
 });
diff --git a/apps/desktop/src/i18n/locales/zh-CN.ts b/apps/desktop/src/i18n/locales/zh-CN.ts
index 51fdd652ef..381423f9c2 100644
--- a/apps/desktop/src/i18n/locales/zh-CN.ts
+++ b/apps/desktop/src/i18n/locales/zh-CN.ts
@@ -2443,6 +2443,19 @@ export default withEnglishFallback({
       cancelled: "已取消",
     },
   },
+  sqlFileTree: {
+    title: "SQL 文件",
+    openFolder: "打开文件夹",
+    closePanel: "关闭",
+    loading: "加载中...",
+    noFolder: "未打开文件夹",
+    noSqlFiles: "未找到 SQL 文件",
+    folderAlreadyOpen: "此文件夹已打开",
+    removeFolder: "移除文件夹",
+    openFailed: "打开文件夹失败: {message}",
+    loadFailed: "加载 SQL 文件失败: {message}",
+    desktopOnly: "此功能仅在桌面端可用",
+  },
   diff: {
     title: "比较架构",
     source: "源数据库",
diff --git a/apps/desktop/src/i18n/locales/zh-TW.ts b/apps/desktop/src/i18n/locales/zh-TW.ts
index 9754d7ab0f..3e78035d30 100644
--- a/apps/desktop/src/i18n/locales/zh-TW.ts
+++ b/apps/desktop/src/i18n/locales/zh-TW.ts
@@ -3383,4 +3383,17 @@ export default withEnglishFallback({
     noAvailable: "所有可用擴展均已安裝。",
     noInstalled: "暫無已安裝的擴展。",
   },
+  sqlFileTree: {
+    title: "SQL 檔案",
+    openFolder: "開啟資料夾",
+    closePanel: "關閉",
+    loading: "載入中...",
+    noFolder: "未開啟資料夾",
+    noSqlFiles: "未找到 SQL 檔案",
+    folderAlreadyOpen: "此資料夾已開啟",
+    removeFolder: "移除資料夾",
+    openFailed: "開啟資料夾失敗: {message}",
+    loadFailed: "載入 SQL 檔案失敗: {message}",
+    desktopOnly: "此功能僅在桌面端可用",
+  },
 });
diff --git a/apps/desktop/src/lib/backend/api.ts b/apps/desktop/src/lib/backend/api.ts
index 3e98290f32..de070530a5 100644
--- a/apps/desktop/src/lib/backend/api.ts
+++ b/apps/desktop/src/lib/backend/api.ts
@@ -255,6 +255,7 @@ export const pendingOpenDbFiles = forward("pendingOpenDbFiles");
 export const pendingOpenConnectionLinks = forward("pendingOpenConnectionLinks");
 export const readExternalSqlFile = forward("readExternalSqlFile");
 export const writeExternalSqlFile = forward("writeExternalSqlFile");
+export const listSqlFilesInFolder = forward("listSqlFilesInFolder");
 
 // Nacos
 export const nacosTestConnection = forward("nacosTestConnection");
@@ -518,4 +519,5 @@ export type {
   TableExportRequest,
   QueryResultExportRequest,
   AgentEvent,
+  SqlFileEntry,
 } from "@/lib/backend/tauri";
diff --git a/apps/desktop/src/lib/backend/http.ts b/apps/desktop/src/lib/backend/http.ts
index a164f65ba7..832f06a62f 100644
--- a/apps/desktop/src/lib/backend/http.ts
+++ b/apps/desktop/src/lib/backend/http.ts
@@ -1268,6 +1268,17 @@ export async function writeExternalSqlFile(_path: string, _content: string): Pro
   throw new Error("Saving external SQL file paths is only available in the desktop app");
 }
 
+export interface SqlFileEntry {
+  name: string;
+  path: string;
+  is_dir: boolean;
+  children: SqlFileEntry[];
+}
+
+export async function listSqlFilesInFolder(_folderPath: string): Promise<SqlFileEntry[]> {
+  throw new Error("Listing SQL files in a folder is only available in the desktop app");
+}
+
 // ---------------------------------------------------------------------------
 // Data Transfer
 // ---------------------------------------------------------------------------
diff --git a/apps/desktop/src/lib/backend/tauri.ts b/apps/desktop/src/lib/backend/tauri.ts
index b17d585648..c4730be069 100644
--- a/apps/desktop/src/lib/backend/tauri.ts
+++ b/apps/desktop/src/lib/backend/tauri.ts
@@ -522,6 +522,17 @@ export async function writeExternalSqlFile(path: string, content: string): Promi
   return invoke("write_external_sql_file", { path, content });
 }
 
+export interface SqlFileEntry {
+  name: string;
+  path: string;
+  is_dir: boolean;
+  children: SqlFileEntry[];
+}
+
+export async function listSqlFilesInFolder(folderPath: string): Promise<SqlFileEntry[]> {
+  return invoke("list_sql_files_in_folder", { folderPath });
+}
+
 // --- AI Conversations ---
 
 export interface AiChatMessage {
diff --git a/src-tauri/src/commands/list_sql_files.rs b/src-tauri/src/commands/list_sql_files.rs
new file mode 100644
index 0000000000..576ea5bc48
--- /dev/null
+++ b/src-tauri/src/commands/list_sql_files.rs
@@ -0,0 +1,118 @@
+use serde::Serialize;
+use std::collections::HashSet;
+use std::path::Path;
+
+const MAX_SCAN_DEPTH: usize = 10;
+
+/// Directories that are never interesting for SQL file browsing but are huge
+/// (often tens of thousands of entries), which makes a recursive scan take
+/// long enough to freeze the UI. Skipped outright.
+const PRUNED_DIRS: &[&str] = &[
+    ".git",
+    "node_modules",
+    "target",
+    ".venv",
+    "venv",
+    "__pycache__",
+    ".idea",
+    ".vscode",
+    "dist",
+    "build",
+    ".next",
+    ".nuxt",
+    ".gradle",
+    ".m2",
+    ".cache",
+];
+
+#[derive(Debug, Serialize)]
+pub struct SqlFileEntry {
+    pub name: String,
+    pub path: String,
+    pub is_dir: bool,
+    pub children: Vec<SqlFileEntry>,
+}
+
+fn is_pruned_dir(name: &str) -> bool {
+    PRUNED_DIRS.iter().any(|d| name.eq_ignore_ascii_case(d))
+}
+
+fn scan_sql_files(dir: &Path, depth: usize, visited: &mut HashSet<String>) -> Vec<SqlFileEntry> {
+    if depth > MAX_SCAN_DEPTH {
+        return vec![];
+    }
+
+    // Canonicalize only the top-level folder once per scan to guard against
+    // symlink loops; doing it for every subdir doubled the stat cost.
+    let canonical = std::fs::canonicalize(dir).ok();
+    if let Some(ref c) = canonical {
+        let c_str = c.to_string_lossy().to_string();
+        if !visited.insert(c_str) {
+            return vec![];
+        }
+    }
+
+    let mut entries = Vec::new();
+    let dir_entries = match std::fs::read_dir(dir) {
+        Ok(entries) => entries,
+        Err(_) => return entries,
+    };
+
+    for entry in dir_entries.flatten() {
+        let file_type = match entry.file_type() {
+            Ok(ft) => ft,
+            Err(_) => continue,
+        };
+        let path = entry.path();
+        let name = match path.file_name().and_then(|n| n.to_str()) {
+            Some(name) => name.to_string(),
+            None => continue,
+        };
+
+        if file_type.is_dir() {
+            if is_pruned_dir(&name) {
+                continue;
+            }
+            let children = scan_sql_files(&path, depth + 1, visited);
+            if !children.is_empty() {
+                entries.push(SqlFileEntry { name, path: path.to_string_lossy().to_string(), is_dir: true, children });
+            }
+        } else if file_type.is_file()
+            && path.extension().and_then(|e| e.to_str()).map(|e| e.eq_ignore_ascii_case("sql")).unwrap_or(false)
+        {
+            entries.push(SqlFileEntry {
+                name,
+                path: path.to_string_lossy().to_string(),
+                is_dir: false,
+                children: vec![],
+            });
+        }
+    }
+
+    entries.sort_by(|a, b| {
+        if a.is_dir != b.is_dir {
+            b.is_dir.cmp(&a.is_dir)
+        } else {
+            a.name.to_lowercase().cmp(&b.name.to_lowercase())
+        }
+    });
+
+    entries
+}
+
+#[tauri::command]
+pub async fn list_sql_files_in_folder(folder_path: String) -> Result<Vec<SqlFileEntry>, String> {
+    let path = Path::new(&folder_path).to_path_buf();
+    // Filesystem scanning is blocking work; run it on a thread pool so the
+    // Tauri main thread (and thus the webview) does not freeze while large
+    // folders are being walked.
+    tauri::async_runtime::spawn_blocking(move || {
+        if !path.is_dir() {
+            return Err(format!("Path is not a directory: {}", folder_path));
+        }
+        let mut visited = HashSet::new();
+        Ok(scan_sql_files(&path, 0, &mut visited))
+    })
+    .await
+    .map_err(|e| format!("Failed to scan folder: {e}"))?
+}
diff --git a/src-tauri/src/commands/mod.rs b/src-tauri/src/commands/mod.rs
index ac869b3b18..622952cd86 100644
--- a/src-tauri/src/commands/mod.rs
+++ b/src-tauri/src/commands/mod.rs
@@ -16,6 +16,7 @@ pub mod external_sql;
 pub mod fs_open;
 pub mod history;
 pub mod keychain;
+pub mod list_sql_files;
 pub mod mcp;
 pub mod mcp_bridge;
 pub mod mongo_cmd;
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index 35a4b4ffcb..fd2793966f 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -879,6 +879,7 @@ pub fn run() {
             commands::external_sql::pending_open_sql_files,
             commands::external_sql::read_external_sql_file,
             commands::external_sql::write_external_sql_file,
+            commands::list_sql_files::list_sql_files_in_folder,
             commands::external_db::pending_open_db_files,
             commands::keychain::read_keychain_password,
             commands::keychain::read_keychain_passwords,