diff --git a/apps/client/src/widgets/view_widgets/table_view/columns.spec.ts b/apps/client/src/widgets/view_widgets/table_view/columns.spec.ts index 2c4685892..9745f2849 100644 --- a/apps/client/src/widgets/view_widgets/table_view/columns.spec.ts +++ b/apps/client/src/widgets/view_widgets/table_view/columns.spec.ts @@ -119,4 +119,15 @@ describe("restoreExistingData", () => { const restored = restoreExistingData(newDefs, oldDefs); expect(restored[0].visible).toStrictEqual(false); }); + + it("enforces size for non-resizable columns", () => { + const newDefs: ColumnDefinition[] = [ + { title: "#", resizable: false, width: "100px" }, + ] + const oldDefs: ColumnDefinition[] = [ + { title: "#", resizable: false, width: "120px" }, + ]; + const restored = restoreExistingData(newDefs, oldDefs); + expect(restored[0].width).toStrictEqual("100px"); + }); }); diff --git a/apps/client/src/widgets/view_widgets/table_view/columns.ts b/apps/client/src/widgets/view_widgets/table_view/columns.ts index f75e5499f..b99c4b86d 100644 --- a/apps/client/src/widgets/view_widgets/table_view/columns.ts +++ b/apps/client/src/widgets/view_widgets/table_view/columns.ts @@ -41,7 +41,7 @@ const labelTypeMappings: Record> = { } }; -export function buildColumnDefinitions(info: AttributeDefinitionInformation[], movableRows: boolean, existingColumnData: ColumnDefinition[] | undefined, position?: number) { +export function buildColumnDefinitions(info: AttributeDefinitionInformation[], movableRows: boolean, existingColumnData: ColumnDefinition[] | undefined, rowNumberHint: number, position?: number) { let columnDefs: ColumnDefinition[] = [ { title: "#", @@ -50,6 +50,7 @@ export function buildColumnDefinitions(info: AttributeDefinitionInformation[], m resizable: false, frozen: true, rowHandle: movableRows, + width: calculateIndexColumnWidth(rowNumberHint, movableRows), formatter: RowNumberFormatter(movableRows) }, { @@ -66,6 +67,7 @@ export function buildColumnDefinitions(info: AttributeDefinitionInformation[], m width: 400 } ]; + console.log("Log ", rowNumberHint, columnDefs[0].width); const seenFields = new Set(); for (const { name, title, type } of info) { @@ -102,7 +104,7 @@ export function restoreExistingData(newDefs: ColumnDefinition[], oldDefs: Column .filter(item => (item.field && newItemsByField.has(item.field!)) || item.title === "#") .map(oldItem => { const data = newItemsByField.get(oldItem.field!)!; - if (oldItem.width !== undefined) { + if (oldItem.resizable && oldItem.width !== undefined) { data.width = oldItem.width; } if (oldItem.visible !== undefined) { @@ -128,3 +130,11 @@ export function restoreExistingData(newDefs: ColumnDefinition[], oldDefs: Column ...existingColumns.slice(insertPos) ]; } + +function calculateIndexColumnWidth(rowNumberHint: number, movableRows: boolean): number { + let columnWidth = 16 * (rowNumberHint.toString().length || 1); + if (movableRows) { + columnWidth += 32; + } + return columnWidth; +} diff --git a/apps/client/src/widgets/view_widgets/table_view/index.ts b/apps/client/src/widgets/view_widgets/table_view/index.ts index 3e2f42e6b..49f9d5409 100644 --- a/apps/client/src/widgets/view_widgets/table_view/index.ts +++ b/apps/client/src/widgets/view_widgets/table_view/index.ts @@ -105,6 +105,7 @@ export default class TableView extends ViewMode { private colEditing?: TableColumnEditing; private rowEditing?: TableRowEditing; private maxDepth: number = -1; + private rowNumberHint: number = 1; constructor(args: ViewModeArgs) { super(args, "table"); @@ -137,9 +138,10 @@ export default class TableView extends ViewMode { this.persistentData = viewStorage?.tableData || {}; this.maxDepth = parseInt(this.parentNote.getLabelValue("maxNestingDepth") ?? "-1", 10); - const { definitions: rowData, hasSubtree: hasChildren } = await buildRowDefinitions(this.parentNote, info, this.maxDepth); + const { definitions: rowData, hasSubtree: hasChildren, rowNumber } = await buildRowDefinitions(this.parentNote, info, this.maxDepth); + this.rowNumberHint = rowNumber; const movableRows = canReorderRows(this.parentNote) && !hasChildren; - const columnDefs = buildColumnDefinitions(info, movableRows, this.persistentData.columns); + const columnDefs = buildColumnDefinitions(info, movableRows, this.persistentData.columns, this.rowNumberHint); let opts: Options = { layout: "fitDataFill", index: "branchId", @@ -226,7 +228,7 @@ export default class TableView extends ViewMode { } const info = getAttributeDefinitionInformation(this.parentNote); - const columnDefs = buildColumnDefinitions(info, !!this.api.options.movableRows, this.persistentData?.columns, this.colEditing?.getNewAttributePosition()); + const columnDefs = buildColumnDefinitions(info, !!this.api.options.movableRows, this.persistentData?.columns, this.colEditing?.getNewAttributePosition(), this.rowNumberHint); this.api.setColumns(columnDefs); this.colEditing?.resetNewAttributePosition(); } @@ -243,7 +245,8 @@ export default class TableView extends ViewMode { } const info = getAttributeDefinitionInformation(this.parentNote); - const { definitions, hasSubtree } = await buildRowDefinitions(this.parentNote, info, this.maxDepth); + const { definitions, hasSubtree, rowNumber } = await buildRowDefinitions(this.parentNote, info, this.maxDepth); + this.rowNumberHint = rowNumber; // Force a refresh if the data tree needs enabling/disabling. if (this.api.options.dataTree !== hasSubtree) { diff --git a/apps/client/src/widgets/view_widgets/table_view/rows.ts b/apps/client/src/widgets/view_widgets/table_view/rows.ts index 3ab5cda9c..a3efca0c6 100644 --- a/apps/client/src/widgets/view_widgets/table_view/rows.ts +++ b/apps/client/src/widgets/view_widgets/table_view/rows.ts @@ -14,8 +14,11 @@ export type TableData = { export async function buildRowDefinitions(parentNote: FNote, infos: AttributeDefinitionInformation[], maxDepth = -1, currentDepth = 0) { const definitions: TableData[] = []; + const childBranches = parentNote.getChildBranches(); let hasSubtree = false; - for (const branch of parentNote.getChildBranches()) { + let rowNumber = childBranches.length; + + for (const branch of childBranches) { const note = await branch.getNote(); if (!note) { continue; // Skip if the note is not found @@ -41,8 +44,10 @@ export async function buildRowDefinitions(parentNote: FNote, infos: AttributeDef } if (note.hasChildren() && (maxDepth < 0 || currentDepth < maxDepth)) { - def._children = (await buildRowDefinitions(note, infos, maxDepth, currentDepth + 1)).definitions; + const { definitions, rowNumber: subRowNumber } = (await buildRowDefinitions(note, infos, maxDepth, currentDepth + 1)); + def._children = definitions; hasSubtree = true; + rowNumber += subRowNumber; } definitions.push(def); @@ -50,7 +55,8 @@ export async function buildRowDefinitions(parentNote: FNote, infos: AttributeDef return { definitions, - hasSubtree + hasSubtree, + rowNumber }; }