diff --git a/apps/client/src/widgets/collections/table/index.tsx b/apps/client/src/widgets/collections/table/index.tsx
index 5ad6ac3f2..dbf5055d0 100644
--- a/apps/client/src/widgets/collections/table/index.tsx
+++ b/apps/client/src/widgets/collections/table/index.tsx
@@ -1,12 +1,12 @@
import { useEffect, useState } from "preact/hooks";
import { ViewModeProps } from "../interface";
import "./index.css";
-import { ColumnDefinition } from "tabulator-tables";
import { buildColumnDefinitions } from "./columns";
import getAttributeDefinitionInformation, { buildRowDefinitions, TableData } from "./rows";
import { useNoteLabelInt } from "../../react/hooks";
import { canReorderRows } from "../../view_widgets/table_view/dragging";
import Tabulator from "./tabulator";
+import {SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, ColumnDefinition, DataTreeModule} from 'tabulator-tables';
interface TableConfig {
tableData?: {
@@ -41,6 +41,7 @@ export default function TableView({ note, viewConfig }: ViewModeProps
)}
diff --git a/apps/client/src/widgets/collections/table/tabulator.tsx b/apps/client/src/widgets/collections/table/tabulator.tsx
index ad6eaf741..a04838c84 100644
--- a/apps/client/src/widgets/collections/table/tabulator.tsx
+++ b/apps/client/src/widgets/collections/table/tabulator.tsx
@@ -1,5 +1,5 @@
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 "../../../../src/stylesheets/table.css";
@@ -7,12 +7,20 @@ interface TableProps {
className?: string;
columns: ColumnDefinition[];
data?: T[];
+ modules?: (new (table: VanillaTabulator) => Module)[];
}
-export default function Tabulator({ className, columns, data }: TableProps) {
+export default function Tabulator({ className, columns, data, modules }: TableProps) {
const containerRef = useRef(null);
const tabulatorRef = useRef(null);
+ useEffect(() => {
+ if (!modules) return;
+ for (const module of modules) {
+ VanillaTabulator.registerModule(module);
+ }
+ }, [modules]);
+
useEffect(() => {
if (!containerRef.current) return;
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 fc6008e00..2d030f4cd 100644
--- a/apps/client/src/widgets/view_widgets/table_view/index.ts
+++ b/apps/client/src/widgets/view_widgets/table_view/index.ts
@@ -2,7 +2,6 @@ import ViewMode, { type ViewModeArgs } from "../view_mode.js";
import attributes from "../../../services/attributes.js";
import SpacedUpdate from "../../../services/spaced_update.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 buildFooter from "./footer.js";
@@ -51,7 +50,6 @@ export default class TableView extends ViewMode {
}
private async renderTable(el: HTMLElement) {
- const modules = [ SortModule, FormatModule, InteractionModule, EditModule, ResizeColumnsModule, FrozenColumnsModule, PersistenceModule, MoveColumnsModule, MoveRowsModule, DataTreeModule ];
for (const module of modules) {
Tabulator.registerModule(module);
}