mirror of
https://github.com/zadam/trilium.git
synced 2025-10-20 15:19:01 +02:00
chore(react/collections/table): port row number formatter
This commit is contained in:
parent
043791fc91
commit
e3d9a120cb
@ -1,5 +1,5 @@
|
||||
import { NoteFormatter, NoteTitleFormatter, RowNumberFormatter } from "./formatters.js";
|
||||
import type { CellComponent, ColumnDefinition, EmptyCallback } from "tabulator-tables";
|
||||
import type { CellComponent, ColumnDefinition, EmptyCallback, FormatterParams } from "tabulator-tables";
|
||||
import { LabelType } from "../../../services/promoted_attribute_definition_parser.js";
|
||||
import { RelationEditor } from "./relation_editor.js";
|
||||
import { JSX } from "preact";
|
||||
@ -60,6 +60,10 @@ interface BuildColumnArgs {
|
||||
position?: number;
|
||||
}
|
||||
|
||||
interface RowNumberFormatterParams {
|
||||
movableRows?: boolean;
|
||||
}
|
||||
|
||||
export function buildColumnDefinitions({ info, movableRows, existingColumnData, rowNumberHint, position }: BuildColumnArgs) {
|
||||
let columnDefs: ColumnDefinition[] = [
|
||||
{
|
||||
@ -70,7 +74,11 @@ export function buildColumnDefinitions({ info, movableRows, existingColumnData,
|
||||
frozen: true,
|
||||
rowHandle: movableRows,
|
||||
width: calculateIndexColumnWidth(rowNumberHint, movableRows),
|
||||
formatter: RowNumberFormatter(movableRows)
|
||||
formatter: wrapFormatter(({ cell, formatterParams }) => <div>
|
||||
{(formatterParams as RowNumberFormatterParams).movableRows && <><span class="bx bx-dots-vertical-rounded"></span>{" "}</>}
|
||||
{cell.getRow().getPosition(true)}
|
||||
</div>),
|
||||
formatterParams: { movableRows } satisfies RowNumberFormatterParams
|
||||
},
|
||||
{
|
||||
field: "noteId",
|
||||
@ -159,11 +167,12 @@ function calculateIndexColumnWidth(rowNumberHint: number, movableRows: boolean):
|
||||
|
||||
interface FormatterOpts {
|
||||
cell: CellComponent
|
||||
formatterParams: FormatterParams;
|
||||
}
|
||||
|
||||
function wrapFormatter(Component: (opts: FormatterOpts) => JSX.Element): ((cell: CellComponent, formatterParams: {}, onRendered: EmptyCallback) => string | HTMLElement) {
|
||||
return (cell, formatterParams, onRendered) => {
|
||||
const elWithParams = <Component cell={cell} />;
|
||||
const elWithParams = <Component cell={cell} formatterParams={formatterParams} />;
|
||||
return renderReactWidget(null, elWithParams)[0];
|
||||
};
|
||||
}
|
||||
|
@ -60,17 +60,6 @@ export function NoteTitleFormatter(cell: CellComponent) {
|
||||
return $noteRef[0].outerHTML;
|
||||
}
|
||||
|
||||
export function RowNumberFormatter(draggableRows: boolean) {
|
||||
return (cell: CellComponent) => {
|
||||
let html = "";
|
||||
if (draggableRows) {
|
||||
html += `<span class="bx bx-dots-vertical-rounded"></span> `;
|
||||
}
|
||||
html += cell.getRow().getPosition(true);
|
||||
return html;
|
||||
};
|
||||
}
|
||||
|
||||
function buildNoteLink(noteId: string, title: string, iconClass: string, colorClass?: string) {
|
||||
const $noteRef = $("<span>");
|
||||
const href = `#root/${noteId}`;
|
||||
|
Loading…
x
Reference in New Issue
Block a user