From 8f619fb79145518fad073ffd4b7334626fffba51 Mon Sep 17 00:00:00 2001
From: t8y2 <1156263951@qq.com>
Date: Mon, 13 Jul 2026 21:26:39 +0800
Subject: [PATCH] fix(editor): confirm unsaved structure changes

---
 apps/desktop/src/App.vue                      |  21 +++-
 .../src/components/layout/ContentArea.vue     |   8 +-
 .../structure/TableStructureEditor.vue        |  11 +-
 .../queryStore.structure-close.spec.ts        | 107 ++++++++++++++++++
 apps/desktop/src/stores/queryStore.ts         |  25 +++-
 apps/desktop/src/types/database.ts            |   1 +
 6 files changed, 161 insertions(+), 12 deletions(-)
 create mode 100644 apps/desktop/src/stores/__tests__/queryStore.structure-close.spec.ts

diff --git a/apps/desktop/src/App.vue b/apps/desktop/src/App.vue
index aaa0779108..b6cf52dfef 100644
--- a/apps/desktop/src/App.vue
+++ b/apps/desktop/src/App.vue
@@ -687,9 +687,15 @@ async function saveExternalSqlPath(tab: QueryTab, options: { closeAfterSave?: bo
 
 async function saveTabForCloseAll(tabId: string): Promise<boolean> {
   const tab = queryStore.tabs.find((t) => t.id === tabId);
-  if (!tab || !canSaveSqlTab(tab)) return true;
+  if (!tab) return true;
   queryStore.activeTabId = tabId;
 
+  if (tab.mode === "structure") {
+    await nextTick();
+    return (await contentAreaRef.value?.applyTableStructureChanges?.()) === true;
+  }
+  if (!canSaveSqlTab(tab)) return true;
+
   if (tab.objectSource) return saveActiveObjectSource(tab);
 
   if (await saveExternalSqlPath(tab)) return !queryStore.isTabDirty(tab);
@@ -735,7 +741,18 @@ async function handleSaveAllPendingTabClose() {
 
 async function handleSaveTab(tabId: string) {
   const tab = queryStore.tabs.find((t) => t.id === tabId);
-  if (!tab || !canSaveSqlTab(tab)) return;
+  if (!tab) return;
+  if (tab.mode === "structure") {
+    queryStore.activeTabId = tabId;
+    await nextTick();
+    if (await contentAreaRef.value?.applyTableStructureChanges?.()) {
+      completePendingTabSave(tabId);
+    } else {
+      queryStore.resumeCloseConfirm();
+    }
+    return;
+  }
+  if (!canSaveSqlTab(tab)) return;
   const closeAfterSave = pendingAppCloseAction.value === null;
   pendingSaveShouldCloseTab.value = closeAfterSave;
   if (tab.objectSource) {
diff --git a/apps/desktop/src/components/layout/ContentArea.vue b/apps/desktop/src/components/layout/ContentArea.vue
index e579eae727..837392b303 100644
--- a/apps/desktop/src/components/layout/ContentArea.vue
+++ b/apps/desktop/src/components/layout/ContentArea.vue
@@ -192,6 +192,7 @@ const columnInfoLoading = ref(false);
 const columnInfoError = ref<string | undefined>(undefined);
 const dataGridRef = ref<DataGridHandle>();
 const queryEditorRef = ref<InstanceType<typeof QueryEditor>>();
+const tableStructureEditorRef = ref<{ applyChanges: () => Promise<boolean> }>();
 const standaloneResultToolbarRef = ref<HTMLElement | null>(null);
 const standaloneResultToolbarWidth = ref(0);
 const resultTabsScrollerRef = ref<HTMLElement | null>(null);
@@ -754,7 +755,11 @@ function pasteClipboardAsSqlInCondition() {
   return queryEditorRef.value?.pasteClipboardAsSqlInCondition();
 }
 
-defineExpose({ focusSearch, refreshData, handleModRTarget, requestQueryEditorExecute, pasteClipboardAsSqlInCondition });
+function applyTableStructureChanges() {
+  return tableStructureEditorRef.value?.applyChanges() ?? Promise.resolve(false);
+}
+
+defineExpose({ focusSearch, refreshData, handleModRTarget, requestQueryEditorExecute, pasteClipboardAsSqlInCondition, applyTableStructureChanges });
 </script>
 
 <template>
@@ -1559,6 +1564,7 @@ defineExpose({ focusSearch, refreshData, handleModRTarget, requestQueryEditorExe
     <!-- Structure mode: table structure editor -->
     <template v-else-if="activeTab.mode === 'structure'">
       <TableStructureEditor
+        ref="tableStructureEditorRef"
         :key="activeTab.id"
         :connection-id="activeTab.connectionId"
         :database="activeTab.database"
diff --git a/apps/desktop/src/components/structure/TableStructureEditor.vue b/apps/desktop/src/components/structure/TableStructureEditor.vue
index 3c4f191a91..0e08d633fd 100644
--- a/apps/desktop/src/components/structure/TableStructureEditor.vue
+++ b/apps/desktop/src/components/structure/TableStructureEditor.vue
@@ -893,6 +893,7 @@ function onStructureContentScroll(tab: TableInfoTab, event: Event) {
 
 function createCurrentDraft(initialized = true): TableStructureEditorDraft {
   return {
+    dirty: hasPendingStructureChanges(),
     activeTab: activeTab.value as TableStructureEditorDraft["activeTab"],
     newTableName: newTableName.value,
     tableComment: tableComment.value,
@@ -2145,7 +2146,7 @@ function toggleSqlPreviewCollapsed() {
 }
 
 async function applyChanges() {
-  if (!canApply.value || !props.connectionId || !props.database) return;
+  if (!canApply.value || !props.connectionId || !props.database) return false;
   const sql = previewSqlText.value;
   const connection = store.getConfig(props.connectionId);
   const productionContext = productionContextForDatabase(connection, props.database);
@@ -2157,7 +2158,7 @@ async function applyChanges() {
       productionDatabases: productionContext.databases,
       source: t("production.sourceStructure"),
     });
-    if (!confirmed) return;
+    if (!confirmed) return false;
   }
   saving.value = true;
   errorMessage.value = "";
@@ -2185,16 +2186,20 @@ async function applyChanges() {
       postSaveRefreshing.value = true;
       skipNextRefreshVersion = true;
       emit("saved", tableComment.value !== originalTableComment.value);
-      void refreshStructureAfterSave(refreshScope);
+      await refreshStructureAfterSave(refreshScope);
     }
+    return true;
   } catch (e: any) {
     errorMessage.value = e?.message || String(e);
     await recordStructureHistory(sql, startedAt, false, undefined, errorMessage.value);
+    return false;
   } finally {
     saving.value = false;
   }
 }
 
+defineExpose({ applyChanges });
+
 function addItemForActiveTab(): boolean {
   if (activeTab.value === "columns" && canAddColumn.value) {
     void addColumn();
diff --git a/apps/desktop/src/stores/__tests__/queryStore.structure-close.spec.ts b/apps/desktop/src/stores/__tests__/queryStore.structure-close.spec.ts
new file mode 100644
index 0000000000..79fb81ca30
--- /dev/null
+++ b/apps/desktop/src/stores/__tests__/queryStore.structure-close.spec.ts
@@ -0,0 +1,107 @@
+import { createPinia, setActivePinia } from "pinia";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+
+function installLocalStorage() {
+  const data = new Map<string, string>();
+  vi.stubGlobal("localStorage", {
+    getItem: vi.fn((key: string) => data.get(key) ?? null),
+    setItem: vi.fn((key: string, value: string) => data.set(key, value)),
+    removeItem: vi.fn((key: string) => data.delete(key)),
+  });
+}
+
+describe("queryStore structure editor close protection", () => {
+  beforeEach(() => {
+    vi.resetModules();
+    vi.unstubAllGlobals();
+    installLocalStorage();
+    setActivePinia(createPinia());
+  });
+
+  it("prompts before closing a dirty structure tab", async () => {
+    const { useQueryStore } = await import("@/stores/queryStore");
+    const store = useQueryStore();
+    const tabId = store.openTableStructure("mysql-1", "app", undefined, "users");
+    const tab = store.tabs.find((item) => item.id === tabId)!;
+    tab.structureDraft = { dirty: true } as typeof tab.structureDraft;
+
+    store.closeTab(tabId);
+
+    expect(store.showCloseConfirm).toBe(true);
+    expect(store.pendingCloseTabId).toBe(tabId);
+    expect(store.tabs.some((item) => item.id === tabId)).toBe(true);
+  });
+
+  it("closes a clean structure tab without prompting", async () => {
+    const { useQueryStore } = await import("@/stores/queryStore");
+    const store = useQueryStore();
+    const tabId = store.openTableStructure("mysql-1", "app", undefined, "users");
+    const tab = store.tabs.find((item) => item.id === tabId)!;
+    tab.structureDraft = { dirty: false } as typeof tab.structureDraft;
+
+    store.closeTab(tabId);
+
+    expect(store.showCloseConfirm).toBe(false);
+    expect(store.tabs.some((item) => item.id === tabId)).toBe(false);
+  });
+
+  it("protects legacy persisted structure drafts without a dirty flag", async () => {
+    const { useQueryStore } = await import("@/stores/queryStore");
+    const store = useQueryStore();
+    const tabId = store.openTableStructure("mysql-1", "app", undefined, "users");
+    const tab = store.tabs.find((item) => item.id === tabId)!;
+    tab.structureDraft = { initialized: true } as typeof tab.structureDraft;
+
+    store.closeTab(tabId);
+
+    expect(store.showCloseConfirm).toBe(true);
+    expect(store.pendingCloseTabId).toBe(tabId);
+  });
+
+  it("protects dirty structure tabs during batch and app close", async () => {
+    const { useSettingsStore } = await import("@/stores/settingsStore");
+    const { useQueryStore } = await import("@/stores/queryStore");
+    const settingsStore = useSettingsStore();
+    settingsStore.editorSettings.confirmUnsavedSqlClose = false;
+    const store = useQueryStore();
+    const tabId = store.openTableStructure("mysql-1", "app", undefined, "users");
+    const tab = store.tabs.find((item) => item.id === tabId)!;
+    tab.structureDraft = { dirty: true } as typeof tab.structureDraft;
+
+    store.closeAllTabs();
+    expect(store.showCloseConfirm).toBe(true);
+    expect(store.closeConfirmContext).toBe("batch");
+
+    store.cancelClosePendingTab();
+    expect(store.requestAppCloseConfirmation()).toBe(true);
+    expect(store.closeConfirmContext).toBe("app");
+  });
+
+  it("discards a structure draft before force closing", async () => {
+    const { useQueryStore } = await import("@/stores/queryStore");
+    const store = useQueryStore();
+    const tabId = store.openTableStructure("mysql-1", "app", undefined, "users");
+    const tab = store.tabs.find((item) => item.id === tabId)!;
+    tab.structureDraft = { dirty: true } as typeof tab.structureDraft;
+
+    store.closeTab(tabId);
+    store.forceClosePendingTab();
+
+    expect(store.tabs.some((item) => item.id === tabId)).toBe(false);
+  });
+
+  it("preserves the disabled SQL close-confirm behavior", async () => {
+    const { useSettingsStore } = await import("@/stores/settingsStore");
+    const { useQueryStore } = await import("@/stores/queryStore");
+    const settingsStore = useSettingsStore();
+    settingsStore.editorSettings.confirmUnsavedSqlClose = false;
+    const store = useQueryStore();
+    const tabId = store.createTab("mysql-1", "app", "Query", "query");
+    store.updateSql(tabId, "select 1");
+
+    store.closeTab(tabId);
+
+    expect(store.showCloseConfirm).toBe(false);
+    expect(store.tabs.some((item) => item.id === tabId)).toBe(false);
+  });
+});
diff --git a/apps/desktop/src/stores/queryStore.ts b/apps/desktop/src/stores/queryStore.ts
index 81342be559..5b0ad9492c 100644
--- a/apps/desktop/src/stores/queryStore.ts
+++ b/apps/desktop/src/stores/queryStore.ts
@@ -1204,6 +1204,10 @@ export const useQueryStore = defineStore("query", () => {
   }
 
   function isTabDirty(tab: QueryTab): boolean {
+    if (tab.mode === "structure") {
+      // Legacy persisted structure drafts predate the dirty flag; treat them as dirty until the editor rehydrates them.
+      return !!tab.structureDraft && tab.structureDraft.dirty !== false;
+    }
     if (tab.mode !== "query") return false;
     if (!tab.externalSqlPath && !tab.sql.trim()) return false;
     const original = tab.originalSql;
@@ -1269,7 +1273,12 @@ export const useQueryStore = defineStore("query", () => {
 
   function discardTabChanges(id: string) {
     const tab = tabs.value.find((item) => item.id === id);
-    if (!tab || tab.mode !== "query") return false;
+    if (!tab) return false;
+    if (tab.mode === "structure") {
+      tab.structureDraft = undefined;
+      return true;
+    }
+    if (tab.mode !== "query") return false;
     if (tab.originalSql !== undefined) {
       tab.sql = tab.originalSql;
       return true;
@@ -1303,9 +1312,9 @@ export const useQueryStore = defineStore("query", () => {
       return;
     }
 
-    const dirtyTab = shouldConfirmUnsavedSqlClose.value ? remainingIds.map((id) => tabs.value.find((tab) => tab.id === id)).find((tab): tab is QueryTab => !!tab && isTabDirty(tab)) : undefined;
+    const dirtyTab = remainingIds.map((id) => tabs.value.find((tab) => tab.id === id)).find((tab): tab is QueryTab => !!tab && shouldConfirmTabClose(tab));
     if (dirtyTab) {
-      // Batch close must pause before dropping dirty query tabs so the existing save/discard dialog can protect unsaved SQL.
+      // Batch close must pause before dropping dirty tabs so the shared save/discard dialog protects every editable surface.
       showDirtyTabCloseConfirm(dirtyTab, "batch");
       return;
     }
@@ -1332,7 +1341,7 @@ export const useQueryStore = defineStore("query", () => {
   function closeTab(id: string, { force = false }: { force?: boolean } = {}) {
     const tab = tabs.value.find((t) => t.id === id);
     if (!tab) return;
-    if (!force && shouldConfirmUnsavedSqlClose.value && isTabDirty(tab)) {
+    if (!force && shouldConfirmTabClose(tab)) {
       showDirtyTabCloseConfirm(tab, "tab");
       return;
     }
@@ -1355,6 +1364,11 @@ export const useQueryStore = defineStore("query", () => {
     if (force) resumePendingBatchCloseAfter(id);
   }
 
+  function shouldConfirmTabClose(tab: QueryTab): boolean {
+    if (tab.mode === "structure") return isTabDirty(tab);
+    return shouldConfirmUnsavedSqlClose.value && isTabDirty(tab);
+  }
+
   function forceClosePendingTab() {
     const id = pendingCloseTabId.value;
     const confirmingAppClose = isConfirmingAppClose.value;
@@ -1500,8 +1514,7 @@ export const useQueryStore = defineStore("query", () => {
   }
 
   function requestAppCloseConfirmation() {
-    if (!shouldConfirmUnsavedSqlClose.value) return false;
-    const dirtyTab = tabs.value.find((tab) => isTabDirty(tab));
+    const dirtyTab = tabs.value.find((tab) => shouldConfirmTabClose(tab));
     if (!dirtyTab) return false;
     isConfirmingAppClose.value = true;
     showDirtyTabCloseConfirm(dirtyTab, "app");
diff --git a/apps/desktop/src/types/database.ts b/apps/desktop/src/types/database.ts
index e15bdbebc6..84cd830a0f 100644
--- a/apps/desktop/src/types/database.ts
+++ b/apps/desktop/src/types/database.ts
@@ -692,6 +692,7 @@ export interface TableStructureEditorTarget {
 }
 
 export interface TableStructureEditorDraft {
+  dirty?: boolean;
   activeTab: TableInfoTab;
   newTableName: string;
   tableComment: string;