gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-29 10:39:00 +01:00
Code Issues Actions 13 Packages Projects Releases Wiki Activity

chore(react/collections/table): enable modules

Browse Source
This commit is contained in:
Elian Doran 2025-09-06 19:19:52 +03:00
parent b4cead757d
commit 9d877ec97a
No known key found for this signature in database
3 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/client/src/widgets/collections/table/index.tsx
View File

@ -1,12 +1,12 @@
import { useEffect, useState } from "preact/hooks"; import { useEffect, useState } from "preact/hooks";
import { ViewModeProps } from "../interface"; import { ViewModeProps } from "../interface";
import "./index.css"; import "./index.css";
import { ColumnDefinition } from "tabulator-tables";
import { buildColumnDefinitions } from "./columns"; import { buildColumnDefinitions } from "./columns";
import getAttributeDefinitionInformation, { buildRowDefinitions, TableData } from "./rows"; import getAttributeDefinitionInformation, { buildRowDefinitions, TableData } from "./rows";
import { useNoteLabelInt } from "../../react/hooks"; import { useNoteLabelInt } from "../../react/hooks";
import { canReorderRows } from "../../view_widgets/table_view/dragging"; import { canReorderRows } from "../../view_widgets/table_view/dragging";
import Tabulator from "./tabulator"; import Tabulator from "./tabulator";
import {SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, ColumnDefinition, DataTreeModule} from 'tabulator-tables';
interface TableConfig { interface TableConfig {
tableData?: { tableData?: {
@ -41,6 +41,7 @@ export default function TableView({ note, viewConfig }: ViewModeProps<TableConfi
className="table-view-container" className="table-view-container"
columns={columnDefs} columns={columnDefs}
data={rowData} data={rowData}
modules={[ SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, DataTreeModule ]}
/> />
)} )}
</div> </div>

12
apps/client/src/widgets/collections/table/tabulator.tsx
View File

@ -1,5 +1,5 @@
import { useEffect, useRef } from "preact/hooks"; import { useEffect, useRef } from "preact/hooks";
import { ColumnDefinition, Tabulator as VanillaTabulator } from "tabulator-tables"; import { ColumnDefinition, Module, Tabulator as VanillaTabulator } from "tabulator-tables";
import "tabulator-tables/dist/css/tabulator.css"; import "tabulator-tables/dist/css/tabulator.css";
import "../../../../src/stylesheets/table.css"; import "../../../../src/stylesheets/table.css";
@ -7,12 +7,20 @@ interface TableProps<T> {
className?: string; className?: string;
columns: ColumnDefinition[]; columns: ColumnDefinition[];
data?: T[]; data?: T[];
modules?: (new (table: VanillaTabulator) => Module)[];
} }
export default function Tabulator<T>({ className, columns, data }: TableProps<T>) { export default function Tabulator<T>({ className, columns, data, modules }: TableProps<T>) {
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const tabulatorRef = useRef<VanillaTabulator>(null); const tabulatorRef = useRef<VanillaTabulator>(null);
useEffect(() => {
if (!modules) return;
for (const module of modules) {
VanillaTabulator.registerModule(module);
}
}, [modules]);
useEffect(() => { useEffect(() => {
if (!containerRef.current) return; if (!containerRef.current) return;

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

@ -2,7 +2,6 @@ import ViewMode, { type ViewModeArgs } from "../view_mode.js";
import attributes from "../../../services/attributes.js"; import attributes from "../../../services/attributes.js";
import SpacedUpdate from "../../../services/spaced_update.js"; import SpacedUpdate from "../../../services/spaced_update.js";
import type { EventData } from "../../../components/app_context.js"; import type { EventData } from "../../../components/app_context.js";
import {Tabulator, SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, ColumnDefinition, DataTreeModule, Options, RowComponent, ColumnComponent} from 'tabulator-tables';
import { canReorderRows, configureReorderingRows } from "./dragging.js"; import { canReorderRows, configureReorderingRows } from "./dragging.js";
import buildFooter from "./footer.js"; import buildFooter from "./footer.js";
@ -51,7 +50,6 @@ export default class TableView extends ViewMode<StateInfo> {
} }
private async renderTable(el: HTMLElement) { private async renderTable(el: HTMLElement) {
const modules = [ SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, DataTreeModule ];
for (const module of modules) { for (const module of modules) {
Tabulator.registerModule(module); Tabulator.registerModule(module);
} }