xiaoxue_admin
/
dbx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(sidebar): use available width for table names

This commit is contained in:
t8y2 2026-07-13 20:34:27 +08:00
parent dabbb58b0e
commit 99b84cbc92
3 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/desktop/src/components/sidebar/TreeItem.vue
View File

@ -73,7 +73,7 @@ import type { ColumnInfo, ConnectionConfig, DatabaseType, ObjectSourceKind, Tree
import * as api from "@/lib/backend/api";
import { uuid } from "@/lib/common/utils";
import { resolveDefaultDatabase } from "@/lib/database/defaultDatabase";
import { canTreeNodePin, canTreeNodeShowExpander, treeItemPaddingLeft, usesFullWidthTreeLabel } from "@/lib/sidebar/sidebarTreeItemLayout";
import { canTreeNodePin, canTreeNodeShowExpander, treeItemPaddingLeft, treeLabelWidthClass, usesFullWidthTreeLabel } from "@/lib/sidebar/sidebarTreeItemLayout";
import { buildTableSelectSql } from "@/lib/table/tableSelectSql";
import { buildTableDeleteTemplate, buildTableInsertTemplate, buildTableSelectTemplate, buildTableUpdateTemplate } from "@/lib/table/tableSqlTemplates";
import { connectionFilePath, defaultSqliteBackupFileName, isMemorySqlitePath, sqliteBackupSourcePath } from "@/lib/connection/connectionFile";
@ -280,7 +280,6 @@ const emit = defineEmits<{
const usesFullWidthLabel = computed(() => usesFullWidthTreeLabel(props.node.type, settingsStore.editorSettings.sidebarAllowHorizontalScroll));
const sidebarTreeContext = inject(sidebarTreeContextKey, null);
const rowWidthClass = computed(() => (usesFullWidthLabel.value ? "w-max min-w-full" : "w-full min-w-0"));
const labelWidthClass = computed(() => (usesFullWidthLabel.value ? "shrink-0 whitespace-nowrap" : "min-w-0 truncate"));
const nodeProductionContext = computed(() => {
const connectionId = props.node.connectionId;
return productionContextForDatabase(connectionId ? connectionStore.getConfig(connectionId) : undefined, props.node.database);
@ -4192,6 +4191,7 @@ const tableComment = computed(() =>
? props.node.comment
: null,
);
const labelWidthClass = computed(() => treeLabelWidthClass({ fullWidth: usesFullWidthLabel.value, hasTrailingComment: !!columnComment.value || !!tableComment.value }));
const paddingLeft = computed(() => treeItemPaddingLeft(props.depth));
const tableSearchParentId = computed(() => props.node.tableSearchParentId || "");
const tableSearchValue = computed(() => {

5
apps/desktop/src/lib/sidebar/sidebarTreeItemLayout.ts
View File

@ -56,6 +56,11 @@ export function usesFullWidthTreeLabel(type: TreeNodeType, allowHorizontalScroll
return allowHorizontalScroll && fullWidthLabelTypes.has(type);
}
export function treeLabelWidthClass({ fullWidth, hasTrailingComment }: { fullWidth: boolean; hasTrailingComment: boolean }): string {
if (fullWidth) return "shrink-0 whitespace-nowrap";
return hasTrailingComment ? "min-w-0 flex-1 truncate" : "min-w-0 truncate";
}
export function canTreeNodeExpand(type: TreeNodeType): boolean {
return !leafTypes.has(type);
}

11
packages/app-tests/sidebarTreeItemLayout.test.ts vendored
View File

@ -1,6 +1,6 @@
import { test } from "vitest";
import assert from "node:assert/strict";
import { canTreeNodePin, canTreeNodeShowExpander } from "../../apps/desktop/src/lib/sidebar/sidebarTreeItemLayout.ts";
import { canTreeNodePin, canTreeNodeShowExpander, treeLabelWidthClass } from "../../apps/desktop/src/lib/sidebar/sidebarTreeItemLayout.ts";
test("mongodb collection rows can show an expander for metadata groups", () => {
assert.equal(canTreeNodeShowExpander({ type: "mongo-collection", childCount: 0 }), true);
@ -13,3 +13,12 @@ test("ZooKeeper root rows do not show an empty expander", () => {
test("Nacos namespace rows can show the pin action", () => {
assert.equal(canTreeNodePin("nacos-namespace"), true);
});
test("labels with trailing comments consume the available row width", () => {
assert.equal(treeLabelWidthClass({ fullWidth: false, hasTrailingComment: true }), "min-w-0 flex-1 truncate");
assert.equal(treeLabelWidthClass({ fullWidth: false, hasTrailingComment: false }), "min-w-0 truncate");
});
test("horizontal-scroll labels keep their intrinsic width", () => {
assert.equal(treeLabelWidthClass({ fullWidth: true, hasTrailingComment: true }), "shrink-0 whitespace-nowrap");
});