fix(editor): confirm unsaved structure changes

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"

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();