Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-29 17:26:38 +01:00
Code Issues Packages Projects Releases Activity

feat(views/table): basic implementation for inserting columns at position

Browse Source
This commit is contained in:
Elian Doran
2025-07-14 19:14:10 +03:00
parent d4a4f15416
commit 2d4ac93221
3 changed files with 47 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
apps/client/src/widgets/view_widgets/table_view/columns.ts
View File

@@ -41,8 +41,8 @@ const labelTypeMappings: Record<ColumnType, Partial<ColumnDefinition>> = {
}
};
export function buildColumnDefinitions(info: AttributeDefinitionInformation[], movableRows: boolean, existingColumnData?: ColumnDefinition[]) {
const columnDefs: ColumnDefinition[] = [
export function buildColumnDefinitions(info: AttributeDefinitionInformation[], movableRows: boolean, existingColumnData?: ColumnDefinition[], position?: number) {
let columnDefs: ColumnDefinition[] = [
{
title: "#",
headerSort: false,
@@ -86,25 +86,40 @@ export function buildColumnDefinitions(info: AttributeDefinitionInformation[], m
}
if (existingColumnData) {
restoreExistingData(columnDefs, existingColumnData);
columnDefs = restoreExistingData(columnDefs, existingColumnData, position);
}
return columnDefs;
}
function restoreExistingData(newDefs: ColumnDefinition[], oldDefs: ColumnDefinition[]) {
function restoreExistingData(newDefs: ColumnDefinition[], oldDefs: ColumnDefinition[], position?: number) {
const byField = new Map<string, ColumnDefinition>;
for (const def of oldDefs) {
byField.set(def.field ?? "", def);
}
const newColumns: ColumnDefinition[] = [];
const existingColumns: ColumnDefinition[] = []
for (const newDef of newDefs) {
const oldDef = byField.get(newDef.field ?? "");
if (!oldDef) {
continue;
newColumns.push(newDef);
} else {
newDef.width = oldDef.width;
newDef.visible = oldDef.visible;
existingColumns.push(newDef);
}
newDef.width = oldDef.width;
newDef.visible = oldDef.visible;
}
// Clamp position to a valid range
const insertPos = position !== undefined
? Math.min(Math.max(position, 0), existingColumns.length)
: existingColumns.length;
// Insert new columns at the specified position
return [
...existingColumns.slice(0, insertPos),
...newColumns,
...existingColumns.slice(insertPos)
];
}

10
apps/client/src/widgets/view_widgets/table_view/context_menu.ts
View File

@@ -78,6 +78,16 @@ function showColumnContextMenu(_e: UIEvent, column: ColumnComponent, tabulator:
uiIcon: "bx bx-empty",
items: buildColumnItems()
},
{ title: "----" },
{
title: "Add column to the left",
handler: () => {
getParentComponent(e)?.triggerCommand("addNoteListItem", {
referenceColumn: column
});
console.log("Add col");
}
}
],
selectMenuItemHandler() {},
x: e.pageX,

19
apps/client/src/widgets/view_widgets/table_view/index.ts
View File

@@ -6,7 +6,7 @@ import SpacedUpdate from "../../../services/spaced_update.js";
import type { CommandListenerData, EventData } from "../../../components/app_context.js";
import type { Attribute } from "../../../services/attribute_parser.js";
import note_create, { CreateNoteOpts } from "../../../services/note_create.js";
import {Tabulator, SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, ColumnDefinition, DataTreeModule, Options, RowComponent} from 'tabulator-tables';
import {Tabulator, SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, ColumnDefinition, DataTreeModule, Options, RowComponent, ColumnComponent} from 'tabulator-tables';
import "tabulator-tables/dist/css/tabulator.css";
import "../../../../src/stylesheets/table.css";
import { canReorderRows, configureReorderingRows } from "./dragging.js";
@@ -105,10 +105,10 @@ export default class TableView extends ViewMode<StateInfo> {
private spacedUpdate: SpacedUpdate;
private api?: Tabulator;
private newAttribute?: Attribute;
private newAttributePosition?: number;
private persistentData: StateInfo["tableData"];
private attributeDetailWidget: AttributeDetailWidget;
constructor(args: ViewModeArgs) {
super(args, "table");
@@ -234,13 +234,20 @@ export default class TableView extends ViewMode<StateInfo> {
console.log("Save attributes", this.newAttribute);
}
addNoteListItemEvent() {
addNoteListItemEvent({ referenceColumn }: { referenceColumn?: ColumnComponent }) {
console.log("Add note list item ", referenceColumn);
const attr: Attribute = {
type: "label",
name: "label:myLabel",
value: "promoted,single,text"
};
if (referenceColumn && this.api) {
this.newAttributePosition = this.api.getColumns().indexOf(referenceColumn) - 1;
} else {
this.newAttributePosition = undefined;
}
this.attributeDetailWidget!.showAttributeDetail({
attribute: attr,
allAttributes: [ attr ],
@@ -274,7 +281,7 @@ export default class TableView extends ViewMode<StateInfo> {
}
// Force a refresh if sorted is changed since we need to disable reordering.
if (loadResults.getAttributeRows().find(a => attributes.isAffecting(a, this.parentNote))) {
if (loadResults.getAttributeRows().find(a => a.name === "sorted" && attributes.isAffecting(a, this.parentNote))) {
return true;
}
@@ -283,6 +290,7 @@ export default class TableView extends ViewMode<StateInfo> {
attr.type === "label" &&
(attr.name?.startsWith("label:") || attr.name?.startsWith("relation:")) &&
attributes.isAffecting(attr, this.parentNote))) {
console.log("Col update");
this.#manageColumnUpdate();
}
@@ -301,8 +309,9 @@ export default class TableView extends ViewMode<StateInfo> {
}
const info = getAttributeDefinitionInformation(this.parentNote);
const columnDefs = buildColumnDefinitions(info, !!this.api.options.movableRows, this.persistentData?.columns);
const columnDefs = buildColumnDefinitions(info, !!this.api.options.movableRows, this.persistentData?.columns, this.newAttributePosition);
this.api.setColumns(columnDefs);
this.newAttributePosition = undefined;
}
async #manageRowsUpdate() {