From 310cc22b376cb8eb8139c16137f78208542ac2e5 Mon Sep 17 00:00:00 2001 From: Abeautifulsnow Date: Fri, 29 May 2026 12:29:50 +0800 Subject: [PATCH] Fix/disable table comment for unsupported db (#518) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(structure-editor): disable table comment input for databases that don't support comments (e.g. SQLite) ## 背景说明 SQLite 不支持表注释（COMMENT），但表注释输入框始终可编辑。用户修改注释后，SQL 预览显示暂无变更且应用变更按钮不可用，造成困惑的 UX。 ## 修改内容 - 新增 isTableCommentDisabled 计算属性，基于 structureCapabilities.comment 控制禁用状态 - 表注释 Input 添加 :disabled 绑定，禁用时输入框变灰不可编辑 - 禁用时在输入框右侧显示 Info 图标，hover 显示 Tooltip 说明 - 三语言（zh-CN / en / es）新增 tableCommentUnsupported 翻译 ## 影响范围 - SQLite、DuckDB 及未知数据库类型：输入框被禁用 + Tooltip 提示 - MySQL、PostgreSQL、ClickHouse 等支持注释的数据库：完全不受影响 - 后端 generate_comment_ddl 已有对等过滤（仅 Postgres/Oracle/ClickHouse 生成 COMMENT SQL） ## 测试 - 建议补充：dbType 为 sqlite 时 isTableCommentDisabled 为 true 的单元测试 * test(structure-editor): add tests for table comment disabled state and unsupported DB capabilities --- .../src/components/structure/TableStructureEditor.vue | 10 ++++++++++ apps/desktop/src/i18n/locales/en.ts | 1 + apps/desktop/src/i18n/locales/es.ts | 1 + apps/desktop/src/i18n/locales/zh-CN.ts | 1 + packages/app-tests/tableStructureCapabilities.test.ts | 8 ++++++++ .../app-tests/tableStructureEditorPresentation.test.ts | 8 ++++++++ 6 files changed, 29 insertions(+) diff --git a/apps/desktop/src/components/structure/TableStructureEditor.vue b/apps/desktop/src/components/structure/TableStructureEditor.vue index 54d42d5b6e..a3c914920a 100644 --- a/apps/desktop/src/components/structure/TableStructureEditor.vue +++ b/apps/desktop/src/components/structure/TableStructureEditor.vue @@ -12,6 +12,7 @@ import { ChevronDown, ChevronUp, Database, + Info, KeyRound, Loader2, Maximize2, @@ -28,6 +29,7 @@ import { DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"; +import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"; import { SearchableSelect } from "@/components/ui/searchable-select"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"; import { useConnectionStore } from "@/stores/connectionStore"; @@ -134,6 +136,7 @@ function onIndexColResize(e: MouseEvent, col: number) { const connection = computed(() => (props.connectionId ? store.getConfig(props.connectionId) : undefined)); const databaseType = computed(() => connection.value?.db_type); const structureCapabilities = computed(() => getTableStructureCapabilities(databaseType.value)); +const isTableCommentDisabled = computed(() => !structureCapabilities.value.comment); const dataTypeOptions = computed(() => DATA_TYPE_OPTIONS[databaseType.value ?? ""] ?? []); const indexTypesByDb: Record = { @@ -509,7 +512,14 @@ watch( v-model="tableComment" :placeholder="t('structureEditor.tableCommentPlaceholder')" class="h-6 max-w-[320px] text-[11px]" + :disabled="isTableCommentDisabled" /> + + + + + {{ t("structureEditor.tableCommentUnsupported") }} +
diff --git a/apps/desktop/src/i18n/locales/en.ts b/apps/desktop/src/i18n/locales/en.ts index 235150e9ca..7afdab5d63 100644 --- a/apps/desktop/src/i18n/locales/en.ts +++ b/apps/desktop/src/i18n/locales/en.ts @@ -989,6 +989,7 @@ export default { editComment: "Edit comment", commentPlaceholder: "Enter column comment...", tableCommentPlaceholder: "Enter table comment...", + tableCommentUnsupported: "Table comments are not supported by this database", actions: "Actions", indexName: "Index", indexColumns: "Columns", diff --git a/apps/desktop/src/i18n/locales/es.ts b/apps/desktop/src/i18n/locales/es.ts index fe41a9cb2b..6441037649 100644 --- a/apps/desktop/src/i18n/locales/es.ts +++ b/apps/desktop/src/i18n/locales/es.ts @@ -883,6 +883,7 @@ export default { editComment: "Editar comentario", commentPlaceholder: "Ingresar comentario de columna...", tableCommentPlaceholder: "Ingresar comentario de tabla...", + tableCommentUnsupported: "La base de datos no admite comentarios de tabla", actions: "Acciones", indexName: "Índice", indexColumns: "Columnas", diff --git a/apps/desktop/src/i18n/locales/zh-CN.ts b/apps/desktop/src/i18n/locales/zh-CN.ts index 6b89897d6f..5a7764f3fe 100644 --- a/apps/desktop/src/i18n/locales/zh-CN.ts +++ b/apps/desktop/src/i18n/locales/zh-CN.ts @@ -967,6 +967,7 @@ export default { editComment: "编辑注释", commentPlaceholder: "输入字段注释...", tableCommentPlaceholder: "输入表注释...", + tableCommentUnsupported: "当前数据库不支持表注释", actions: "操作", indexName: "索引名", indexColumns: "字段列表", diff --git a/packages/app-tests/tableStructureCapabilities.test.ts b/packages/app-tests/tableStructureCapabilities.test.ts index 560c2caf14..b8483b5214 100644 --- a/packages/app-tests/tableStructureCapabilities.test.ts +++ b/packages/app-tests/tableStructureCapabilities.test.ts @@ -5,6 +5,14 @@ import { getTableStructureCapabilities, } from "../../apps/desktop/src/lib/tableStructureCapabilities.ts"; +test("sqlite and duckdb do not support table comments", () => { + for (const dbType of ["sqlite", "duckdb"] as const) { + const caps = getTableStructureCapabilities(dbType); + assert.equal(caps.comment, false, `${dbType} should not support comments`); + assert.equal(caps.createTable, true, `${dbType} should still support creating tables`); + } +}); + test("postgres-like databases expose safe structure editing capabilities", () => { for (const dbType of ["postgres", "gaussdb", "opengauss", "highgo", "vastbase", "kingbase"] as const) { const caps = getTableStructureCapabilities(dbType); diff --git a/packages/app-tests/tableStructureEditorPresentation.test.ts b/packages/app-tests/tableStructureEditorPresentation.test.ts index 55947217bf..2955fb42e4 100644 --- a/packages/app-tests/tableStructureEditorPresentation.test.ts +++ b/packages/app-tests/tableStructureEditorPresentation.test.ts @@ -80,3 +80,11 @@ test("new column input is focused after adding a field", () => { assert.match(source, /data-column-name-input/); assert.match(source, /input\?\.focus\(\)/); }); + +test("table comment input is disabled and shows tooltip when database does not support comments", () => { + assert.match(source, /isTableCommentDisabled/); + assert.match(source, /:disabled="isTableCommentDisabled"/); + assert.match(source, /v-if="isTableCommentDisabled"/); + assert.match(source, /Tooltip/); + assert.match(source, /tableCommentUnsupported/); +});