sqlite-hub 1.1.0 → 1.1.2

package/frontend/js/store.js

@@ -19,12 +19,10 @@ import {
     suggestQueryChartType,
     validateQueryChartConfig,
 } from './lib/queryCharts.js';
-import {
-    MEDIA_TAGGING_DEFAULT_MAPPING_TABLE,
-    MEDIA_TAGGING_DEFAULT_TAG_TABLE,
-} from './lib/mediaTaggingDefaults.js';
+import { MEDIA_TAGGING_DEFAULT_MAPPING_TABLE, MEDIA_TAGGING_DEFAULT_TAG_TABLE } from './lib/mediaTaggingDefaults.js';
 import { buildTextExportFilename } from './utils/exportFilenames.js';
 import { toggleMarkdownTodoLine } from './utils/markdownDocuments.js';
+import { buildRiskySqlBackupContext, detectRiskySqlOperations } from './utils/riskySql.js';
 
 const listeners = new Set();
 const DEFAULT_SETTINGS = {
@@ -51,9 +49,13 @@ const UI_PREFERENCE_STORAGE_KEYS = {
     chartsHistoryVisible: 'sqlite_hub_charts_history_visible',
     chartsQueryVisible: 'sqlite_hub_charts_query_visible',
     chartsResultsVisible: 'sqlite_hub_charts_results_visible',
+    chartsHeightPreset: 'sqlite_hub_charts_height_preset',
+    tableDesignerTablesVisible: 'sqlite_hub_table_designer_tables_visible',
     tableDesignerSqlPreviewVisible: 'sqlite_hub_table_designer_sql_preview_visible',
+    documentsVisible: 'sqlite_hub_documents_visible',
     documentsEditorVisible: 'sqlite_hub_documents_editor_visible',
     documentsPreviewVisible: 'sqlite_hub_documents_preview_visible',
+    mediaTaggingViewerVisible: 'sqlite_hub_media_tagging_viewer_visible',
 };
 const QUERY_HISTORY_PAGE_SIZE = 30;
 const QUERY_HISTORY_RUN_LIMIT = 8;
@@ -226,6 +228,15 @@ function storeChartsHistoryTab(tab) {
     }
 }
 
+function readStoredChartsHeightPreset(fallback = 'medium') {
+    return normalizeChartsHeightPreset(readStoredString(UI_PREFERENCE_STORAGE_KEYS.chartsHeightPreset, fallback));
+}
+
+function storeChartsHeightPreset(preset) {
+    const normalizedPreset = normalizeChartsHeightPreset(preset);
+    storeString(UI_PREFERENCE_STORAGE_KEYS.chartsHeightPreset, normalizedPreset);
+}
+
 function readStoredQueryHistoryTab(fallback = 'recent') {
     try {
         return normalizeQueryHistoryTab(globalThis.localStorage?.getItem(QUERY_HISTORY_TAB_STORAGE_KEY) ?? fallback);
@@ -254,6 +265,12 @@ const state = {
         backupLoading: false,
         error: null,
     },
+    backups: {
+        items: [],
+        loading: false,
+        operationLoading: false,
+        error: null,
+    },
     settings: {
         data: { ...DEFAULT_SETTINGS },
         section: 'information',
@@ -342,7 +359,7 @@ const state = {
         historyPanelVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.chartsHistoryVisible, true),
         detailPanelVisible: false,
         selectedHistoryId: null,
-        chartHeightPreset: 'medium',
+        chartHeightPreset: readStoredChartsHeightPreset(),
         queryVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.chartsQueryVisible, true),
         resultsVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.chartsResultsVisible, true),
         detail: null,
@@ -356,9 +373,11 @@ const state = {
         items: [],
         selectedId: null,
         selected: null,
+        searchQuery: '',
         draftFilename: '',
         draftContent: '',
         dirty: false,
+        documentsVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.documentsVisible, true),
         editorVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.documentsEditorVisible, true),
         previewVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.documentsPreviewVisible, true),
         loading: false,
@@ -372,6 +391,7 @@ const state = {
         tables: [],
         selectedTableName: null,
         draft: null,
+        tablesVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.tableDesignerTablesVisible, true),
         sqlPreviewVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.tableDesignerSqlPreviewVisible, true),
         pendingImportedDraft: null,
         loading: false,
@@ -424,7 +444,7 @@ const state = {
         issues: [],
         dismissedIssueKeys: [],
         selectedTagKeys: [],
-        workflowMediaDetailsVisible: true,
+        workflowMediaDetailsVisible: readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.mediaTaggingViewerVisible, true),
         workflowMediaRotationDegrees: 0,
         skippedMediaKeys: [],
         tagFormValues: {},
@@ -569,6 +589,7 @@ function clearQueryHistoryDetailState() {
 function requiresActiveDatabase(routeName) {
     return [
         'overview',
+        'backups',
         'data',
         'editor',
         'editorResults',
@@ -607,7 +628,7 @@ function normalizeMediaTaggingRotationDegrees(value) {
         return 0;
     }
 
-    return ((Math.round(numericValue / 90) * 90) % 360 + 360) % 360;
+    return (((Math.round(numericValue / 90) * 90) % 360) + 360) % 360;
 }
 
 function normalizeDataPageSize(value, fallback = 50) {
@@ -814,8 +835,10 @@ function areRowIdentitiesEqual(left, right) {
         return false;
     }
 
-    return JSON.stringify(left.columns ?? []) === JSON.stringify(right.columns ?? [])
-        && JSON.stringify(left.values ?? null) === JSON.stringify(right.values ?? null);
+    return (
+        JSON.stringify(left.columns ?? []) === JSON.stringify(right.columns ?? []) &&
+        JSON.stringify(left.values ?? null) === JSON.stringify(right.values ?? null)
+    );
 }
 
 function getSelectedDataBrowserRow(snapshot = state) {
@@ -847,9 +870,7 @@ function clearDataBrowserRowSelectionState() {
 
 function resolveDataBrowserRowSelection(rowIndex, identity = null) {
     const hasRowIndex =
-        rowIndex !== null &&
-        rowIndex !== undefined &&
-        (typeof rowIndex !== 'string' || rowIndex.trim() !== '');
+        rowIndex !== null && rowIndex !== undefined && (typeof rowIndex !== 'string' || rowIndex.trim() !== '');
     const numericIndex = hasRowIndex ? Number(rowIndex) : NaN;
 
     if (Number.isInteger(numericIndex) && numericIndex >= 0) {
@@ -867,7 +888,11 @@ function resolveDataBrowserRowSelection(rowIndex, identity = null) {
     const selectedRow = getSelectedDataBrowserRow();
     const selectedIdentity = identity ?? selectedRow?.__identity ?? null;
 
-    if (!selectedRow?.__identity || !selectedIdentity || !areRowIdentitiesEqual(selectedRow.__identity, selectedIdentity)) {
+    if (
+        !selectedRow?.__identity ||
+        !selectedIdentity ||
+        !areRowIdentitiesEqual(selectedRow.__identity, selectedIdentity)
+    ) {
         return {
             row: null,
             rowIndex: null,
@@ -943,7 +968,7 @@ function resetChartsState() {
     state.charts.historyPanelVisible = readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.chartsHistoryVisible, true);
     state.charts.detailPanelVisible = false;
     state.charts.selectedHistoryId = null;
-    state.charts.chartHeightPreset = 'medium';
+    state.charts.chartHeightPreset = readStoredChartsHeightPreset(state.charts.chartHeightPreset);
     state.charts.queryVisible = readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.chartsQueryVisible, true);
     state.charts.resultsVisible = readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.chartsResultsVisible, true);
     state.charts.detail = null;
@@ -959,6 +984,7 @@ function resetDocumentsState() {
     state.documents.items = [];
     state.documents.selectedId = null;
     state.documents.selected = null;
+    state.documents.searchQuery = '';
     state.documents.draftFilename = '';
     state.documents.draftContent = '';
     state.documents.dirty = false;
@@ -1061,7 +1087,9 @@ function syncQueryHistoryItem(updatedItem) {
 
     const updatedItemId = String(updatedItem.id);
 
-    state.editor.history = state.editor.history.map(entry => (String(entry.id) === updatedItemId ? updatedItem : entry));
+    state.editor.history = state.editor.history.map(entry =>
+        String(entry.id) === updatedItemId ? updatedItem : entry,
+    );
 
     if (String(state.editor.historyDetail?.id ?? '') === updatedItemId) {
         state.editor.historyDetail = updatedItem;
@@ -1189,7 +1217,11 @@ function setMissingDatabaseState() {
     state.tableDesigner.tables = [];
     state.tableDesigner.selectedTableName = null;
     state.tableDesigner.draft = null;
-    state.tableDesigner.sqlPreviewVisible = readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.tableDesignerSqlPreviewVisible, true);
+    state.tableDesigner.tablesVisible = readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.tableDesignerTablesVisible, true);
+    state.tableDesigner.sqlPreviewVisible = readStoredBoolean(
+        UI_PREFERENCE_STORAGE_KEYS.tableDesignerSqlPreviewVisible,
+        true,
+    );
     state.tableDesigner.pendingImportedDraft = null;
     state.tableDesigner.saving = false;
     state.tableDesigner.searchQuery = '';
@@ -1338,6 +1370,30 @@ async function refreshSettingsState() {
     }
 }
 
+async function refreshBackupsState() {
+    if (!state.connections.active) {
+        state.backups.items = [];
+        state.backups.error = null;
+        emitChange();
+        return;
+    }
+
+    state.backups.loading = true;
+    state.backups.error = null;
+    emitChange();
+
+    try {
+        const response = await api.getBackups();
+        state.backups.items = response.data ?? [];
+        state.backups.error = null;
+    } catch (error) {
+        state.backups.error = normalizeError(error);
+    } finally {
+        state.backups.loading = false;
+        emitChange();
+    }
+}
+
 export async function createSettingsApiToken(name) {
     state.settings.tokenSaving = true;
     state.settings.error = null;
@@ -1381,9 +1437,7 @@ export async function checkSettingsAppVersion() {
 
         state.settings.versionCheck = result;
         pushToast(
-            result?.updateAvailable
-                ? `SQLite Hub v${result.latestVersion} is available.`
-                : 'SQLite Hub is up to date.',
+            result?.updateAvailable ? `SQLite Hub v${result.latestVersion} is available.` : 'SQLite Hub is up to date.',
             'success',
         );
         return result;
@@ -1665,11 +1719,17 @@ function getRequestedChartsHistoryId(route) {
 function resolveLoadableChartsHistoryId(route) {
     const requestedHistoryId = getRequestedChartsHistoryId(route);
 
-    if (!requestedHistoryId) {
-        return null;
+    if (requestedHistoryId) {
+        return state.charts.queries.some(item => item.id === requestedHistoryId) ? requestedHistoryId : null;
     }
 
-    return state.charts.queries.some(item => item.id === requestedHistoryId) ? requestedHistoryId : null;
+    const selectedHistoryId = Number(state.charts.selectedHistoryId);
+
+    return Number.isInteger(selectedHistoryId) &&
+        selectedHistoryId > 0 &&
+        state.charts.queries.some(item => item.id === selectedHistoryId)
+        ? selectedHistoryId
+        : null;
 }
 
 function hasSettledChartsDetail(historyId) {
@@ -2384,7 +2444,11 @@ function invalidateDatabaseCaches(options = {}) {
     state.tableDesigner.tables = [];
     state.tableDesigner.selectedTableName = null;
     state.tableDesigner.draft = null;
-    state.tableDesigner.sqlPreviewVisible = readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.tableDesignerSqlPreviewVisible, true);
+    state.tableDesigner.tablesVisible = readStoredBoolean(UI_PREFERENCE_STORAGE_KEYS.tableDesignerTablesVisible, true);
+    state.tableDesigner.sqlPreviewVisible = readStoredBoolean(
+        UI_PREFERENCE_STORAGE_KEYS.tableDesignerSqlPreviewVisible,
+        true,
+    );
     state.tableDesigner.pendingImportedDraft = null;
     state.tableDesigner.saving = false;
     state.tableDesigner.searchQuery = '';
@@ -2428,6 +2492,10 @@ function invalidateDatabaseCaches(options = {}) {
     state.mediaTagging.issues = [];
     state.mediaTagging.dismissedIssueKeys = [];
     state.mediaTagging.selectedTagKeys = [];
+    state.mediaTagging.workflowMediaDetailsVisible = readStoredBoolean(
+        UI_PREFERENCE_STORAGE_KEYS.mediaTaggingViewerVisible,
+        true,
+    );
     state.mediaTagging.workflowMediaRotationDegrees = 0;
     state.mediaTagging.skippedMediaKeys = [];
     state.mediaTagging.tagFormValues = {};
@@ -2457,6 +2525,9 @@ async function loadRouteData(route, options = {}) {
         case 'overview':
             await loadOverview(version);
             return;
+        case 'backups':
+            await refreshBackupsState();
+            return;
         case 'data':
             await loadData(version, route);
             return;
@@ -2494,7 +2565,7 @@ function pushToast(message, tone = 'muted') {
 
     window.setTimeout(() => {
         dismissToast(id);
-    }, 3600);
+    }, 4500);
 }
 
 function withModalError(error) {
@@ -2834,7 +2905,9 @@ function normalizeDocumentInsertionRange(range = null) {
     const start = Number(range?.start);
     const end = Number(range?.end);
     const normalizedStart = Number.isInteger(start) ? Math.max(0, Math.min(contentLength, start)) : contentLength;
-    const normalizedEnd = Number.isInteger(end) ? Math.max(normalizedStart, Math.min(contentLength, end)) : normalizedStart;
+    const normalizedEnd = Number.isInteger(end)
+        ? Math.max(normalizedStart, Math.min(contentLength, end))
+        : normalizedStart;
 
     return {
         start: normalizedStart,
@@ -3143,7 +3216,8 @@ export async function deleteCurrentDocument(options = {}) {
     try {
         await api.deleteDocument(documentId);
         state.documents.items = state.documents.items.filter(item => item.id !== documentId);
-        const nextDocument = state.documents.items[Math.max(0, Math.min(deletedIndex, state.documents.items.length - 1))] ?? null;
+        const nextDocument =
+            state.documents.items[Math.max(0, Math.min(deletedIndex, state.documents.items.length - 1))] ?? null;
         if (isSelectedDocument) {
             applyCurrentDocument(null);
         }
@@ -3233,9 +3307,7 @@ export function openDeleteDataRowModal(rowIndex) {
     const tableName = state.dataBrowser.selectedTable;
     const numericIndex = Number(rowIndex);
     const hasNumericIndex = Number.isInteger(numericIndex) && numericIndex >= 0;
-    const row = hasNumericIndex
-        ? state.dataBrowser.table?.rows?.[numericIndex] ?? null
-        : getSelectedDataBrowserRow();
+    const row = hasNumericIndex ? (state.dataBrowser.table?.rows?.[numericIndex] ?? null) : getSelectedDataBrowserRow();
     const rowPreview = buildDeleteRowPreview(
         (state.dataBrowser.table?.columnMeta ?? [])
             .filter(column => column.visible)
@@ -3530,6 +3602,7 @@ export function setChartsHeightPreset(preset) {
     }
 
     state.charts.chartHeightPreset = nextPreset;
+    storeChartsHeightPreset(nextPreset);
     emitChange();
 }
 
@@ -3680,10 +3753,36 @@ export async function chooseCreateDatabasePath() {
 }
 
 export async function submitImportSql(payload) {
+    if (!payload?.skipSafety && !payload?.createNew && !payload?.targetConnectionId && !payload?.targetPath) {
+        try {
+            const preview = await api.previewImportSql(payload);
+
+            if (preview.data?.requiresSafetyBackup) {
+                state.modal = {
+                    kind: 'backup-safety',
+                    operation: 'import',
+                    importPayload: payload,
+                    backupType: 'pre_import',
+                    backupName: 'Before import',
+                    notes: `SQL import, ${preview.data.statementCount ?? 0} statements, ${preview.data.sizeBytes ?? 0} bytes`,
+                    description: 'This SQL dump is large enough to change substantial data. Creating a backup allows you to restore the current state if the import goes wrong.',
+                    error: null,
+                    submitting: false,
+                };
+                emitChange();
+                return null;
+            }
+        } catch (error) {
+            withModalError(error);
+            return null;
+        }
+    }
+
     startModalSubmission();
 
     try {
-        const response = await api.importSql(payload);
+        const { skipSafety, ...requestPayload } = payload ?? {};
+        const response = await api.importSql(requestPayload);
         closeModalInternal();
         pushToast(response.message || 'SQL dump imported.', 'success');
         await refreshConnectionsState();
@@ -3759,28 +3858,257 @@ export async function removeConnection(id) {
 }
 
 export async function createActiveConnectionBackup() {
+    openCreateBackupModal();
+    return null;
+}
+
+export function openCreateBackupModal(defaults = {}) {
     if (!state.connections.active) {
         pushToast('No active SQLite database selected for backup.', 'alert');
+        return;
+    }
+
+    state.modal = {
+        kind: 'create-backup',
+        name: defaults.name ?? '',
+        notes: defaults.notes ?? '',
+        backupType: defaults.type ?? 'manual',
+        error: null,
+        submitting: false,
+    };
+    emitChange();
+}
+
+export async function submitCreateBackupConfirmation({ name = '', notes = '', type = 'manual' } = {}) {
+    if (state.modal?.kind !== 'create-backup') {
         return null;
     }
 
+    startModalSubmission();
     state.connections.backupLoading = true;
-    emitChange();
+    state.backups.operationLoading = true;
 
     try {
-        const response = await api.createActiveConnectionBackup();
-        await refreshConnectionsState();
+        const response = await api.createBackup({ name, notes, type });
+        state.backups.items = [
+            response.data,
+            ...state.backups.items.filter(item => item.id !== response.data.id),
+        ];
+        closeModalInternal();
         pushToast(response.message || 'Backup created.', 'success');
+        if (state.route.name === 'backups') {
+            await refreshBackupsState();
+        }
         return response.data;
     } catch (error) {
-        pushToast(normalizeError(error)?.message || 'Backup could not be created.', 'alert');
+        withModalError(error);
         return null;
     } finally {
         state.connections.backupLoading = false;
+        state.backups.operationLoading = false;
         emitChange();
     }
 }
 
+export function openEditBackupNotesModal(backupId) {
+    const backup = state.backups.items.find(item => String(item.id) === String(backupId));
+
+    if (!backup) {
+        pushToast('The selected backup could not be loaded.', 'alert');
+        return;
+    }
+
+    state.modal = {
+        kind: 'edit-backup-notes',
+        backupId: backup.id,
+        backupName: backup.name,
+        notes: backup.notes ?? '',
+        error: null,
+        submitting: false,
+    };
+    emitChange();
+}
+
+export async function submitEditBackupNotesConfirmation(notes = '') {
+    if (state.modal?.kind !== 'edit-backup-notes') {
+        return null;
+    }
+
+    const backupId = state.modal.backupId;
+    startModalSubmission();
+    state.backups.operationLoading = true;
+
+    try {
+        const response = await api.updateBackup(backupId, { notes });
+        state.backups.items = state.backups.items.map(item =>
+            String(item.id) === String(response.data.id) ? response.data : item
+        );
+        closeModalInternal();
+        pushToast(response.message || 'Backup notes updated.', 'success');
+        return response.data;
+    } catch (error) {
+        withModalError(error);
+        return null;
+    } finally {
+        state.backups.operationLoading = false;
+        emitChange();
+    }
+}
+
+export function openDeleteBackupModal(backupId) {
+    const backup = state.backups.items.find(item => String(item.id) === String(backupId));
+
+    if (!backup) {
+        pushToast('The selected backup could not be loaded.', 'alert');
+        return;
+    }
+
+    state.modal = {
+        kind: 'delete-backup',
+        backupId: backup.id,
+        backupName: backup.name,
+        fileName: backup.fileName,
+        error: null,
+        submitting: false,
+    };
+    emitChange();
+}
+
+export async function submitDeleteBackupConfirmation() {
+    if (state.modal?.kind !== 'delete-backup') {
+        return false;
+    }
+
+    const backupId = state.modal.backupId;
+    startModalSubmission();
+    state.backups.operationLoading = true;
+
+    try {
+        const response = await api.deleteBackup(backupId);
+        state.backups.items = state.backups.items.filter(item => String(item.id) !== String(backupId));
+        closeModalInternal();
+        pushToast(response.message || 'Backup deleted.', 'muted');
+        return true;
+    } catch (error) {
+        withModalError(error);
+        return false;
+    } finally {
+        state.backups.operationLoading = false;
+        emitChange();
+    }
+}
+
+export async function downloadBackup(backupId) {
+    state.backups.operationLoading = true;
+    emitChange();
+
+    try {
+        await api.downloadBackup(backupId);
+        pushToast('Backup download started.', 'success');
+        return true;
+    } catch (error) {
+        state.backups.error = normalizeError(error);
+        pushToast(state.backups.error.message || 'Backup could not be downloaded.', 'alert');
+        return false;
+    } finally {
+        state.backups.operationLoading = false;
+        emitChange();
+    }
+}
+
+export function openRestoreBackupModal(backupId) {
+    const backup = state.backups.items.find(item => String(item.id) === String(backupId));
+
+    if (!backup) {
+        pushToast('The selected backup could not be loaded.', 'alert');
+        return;
+    }
+
+    state.modal = {
+        kind: 'backup-safety',
+        operation: 'restore',
+        backupId: backup.id,
+        backupName: backup.name,
+        backupType: 'pre_restore',
+        backupNameBeforeOperation: `Before restore of ${backup.name}`,
+        description: 'Restoring replaces the current database file with this backup.',
+        error: null,
+        submitting: false,
+    };
+    emitChange();
+}
+
+async function restoreBackupById(backupId) {
+    state.backups.operationLoading = true;
+
+    try {
+        const response = await api.restoreBackup(backupId);
+        pushToast(response.message || 'Backup restored.', 'success');
+        await Promise.all([refreshConnectionsState(), refreshBackupsState()]);
+        invalidateDatabaseCaches();
+        return response.data;
+    } finally {
+        state.backups.operationLoading = false;
+        emitChange();
+    }
+}
+
+async function createSafetyBackupFromModal(modal) {
+    const response = await api.createBackup({
+        name: modal.backupNameBeforeOperation ?? modal.backupName,
+        notes: modal.notes,
+        type: modal.backupType,
+    });
+
+    if (state.route.name === 'backups') {
+        await refreshBackupsState();
+    }
+
+    return response.data;
+}
+
+export async function submitBackupSafetyChoice(choice) {
+    const modal = state.modal;
+
+    if (modal?.kind !== 'backup-safety') {
+        return false;
+    }
+
+    if (choice === 'cancel') {
+        closeModalInternal();
+        return false;
+    }
+
+    startModalSubmission();
+
+    try {
+        if (choice === 'create') {
+            await createSafetyBackupFromModal(modal);
+        }
+
+        if (modal.operation === 'restore') {
+            await restoreBackupById(modal.backupId);
+        } else if (modal.operation === 'sql') {
+            await executeCurrentQuery({ skipSafety: true });
+        } else if (modal.operation === 'import') {
+            await submitImportSql({
+                ...(modal.importPayload ?? {}),
+                skipSafety: true,
+            });
+        }
+
+        closeModalInternal();
+        return true;
+    } catch (error) {
+        withModalError(error);
+        return false;
+    }
+}
+
+export async function refreshBackups() {
+    await refreshBackupsState();
+}
+
 export async function openOverviewInFinder() {
     try {
         const response = await api.openOverviewInFinder();
@@ -3853,7 +4181,26 @@ export function setEditorTab(tab) {
     emitChange();
 }
 
-export async function executeCurrentQuery() {
+export async function executeCurrentQuery(options = {}) {
+    const riskyOperations = detectRiskySqlOperations(state.editor.sqlText);
+
+    if (!options.skipSafety && riskyOperations.length) {
+        const context = buildRiskySqlBackupContext(riskyOperations);
+        state.modal = {
+            kind: 'backup-safety',
+            operation: 'sql',
+            backupType: context.type,
+            backupName: context.name,
+            notes: state.editor.sqlText.slice(0, 600),
+            description: context.description,
+            sqlText: state.editor.sqlText,
+            error: null,
+            submitting: false,
+        };
+        emitChange();
+        return false;
+    }
+
     state.editor.executing = true;
     state.editor.lastExecutedSql = state.editor.sqlText;
     state.editor.error = null;
@@ -4108,6 +4455,12 @@ export function setTableDesignerSearchQuery(query) {
     emitChange();
 }
 
+export function toggleTableDesignerTablesPanel() {
+    state.tableDesigner.tablesVisible = state.tableDesigner.tablesVisible === false;
+    storeBoolean(UI_PREFERENCE_STORAGE_KEYS.tableDesignerTablesVisible, state.tableDesigner.tablesVisible);
+    emitChange();
+}
+
 export function setDataTableSearchQuery(query) {
     state.dataBrowser.tableSearchQuery = String(query ?? '');
     emitChange();
@@ -4118,6 +4471,17 @@ export function setStructureTableSearchQuery(query) {
     emitChange();
 }
 
+export function setDocumentsSearchQuery(query) {
+    state.documents.searchQuery = String(query ?? '');
+    emitChange();
+}
+
+export function toggleDocumentsPanel() {
+    state.documents.documentsVisible = state.documents.documentsVisible === false;
+    storeBoolean(UI_PREFERENCE_STORAGE_KEYS.documentsVisible, state.documents.documentsVisible);
+    emitChange();
+}
+
 export function setTableDesignerSqlPreviewVisibility(visible) {
     const nextValue = typeof visible === 'boolean' ? visible : !Boolean(state.tableDesigner.sqlPreviewVisible);
 
@@ -4359,6 +4723,7 @@ export function setMediaTaggingWorkflowMediaDetailsVisible(value, options = {})
     }
 
     state.mediaTagging.workflowMediaDetailsVisible = nextValue;
+    storeBoolean(UI_PREFERENCE_STORAGE_KEYS.mediaTaggingViewerVisible, nextValue);
 
     if (options.notify !== false) {
         emitChange();
@@ -4684,8 +5049,7 @@ export function openDataRowByIdentity(tableName, identity) {
 export function preserveCurrentDataRowSelectionForReload() {
     const tableName = state.dataBrowser.selectedTable ?? state.dataBrowser.table?.name ?? '';
     const row = getSelectedDataBrowserRow();
-    const rowIndex =
-        typeof state.dataBrowser.selectedRowIndex === 'number' ? state.dataBrowser.selectedRowIndex : null;
+    const rowIndex = typeof state.dataBrowser.selectedRowIndex === 'number' ? state.dataBrowser.selectedRowIndex : null;
 
     if (!tableName || !row) {
         return false;
@@ -5494,7 +5858,12 @@ export function getQueryMessages(snapshot = state) {
 
     return [
         ...snapshot.editor.result.statements.map(statement => ({
-            tone: statement.kind === 'resultSet' && statement.truncated ? 'warning' : statement.kind === 'resultSet' ? 'success' : inferStatusTone(statement.keyword),
+            tone:
+                statement.kind === 'resultSet' && statement.truncated
+                    ? 'warning'
+                    : statement.kind === 'resultSet'
+                      ? 'success'
+                      : inferStatusTone(statement.keyword),
             label: `${statement.keyword} #${statement.index + 1}`,
             value:
                 statement.kind === 'resultSet'