mirror of
				https://github.com/zadam/trilium.git
				synced 2025-10-31 10:26:08 +01:00 
			
		
		
		
	chore(react/collections/table): enable modules
This commit is contained in:
		| @@ -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> | ||||||
|   | |||||||
| @@ -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,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); | ||||||
|         } |         } | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user