diff --git a/apps/client/src/widgets/collections/table/columns.tsx b/apps/client/src/widgets/collections/table/columns.tsx
index 197ccba54..1e04822f4 100644
--- a/apps/client/src/widgets/collections/table/columns.tsx
+++ b/apps/client/src/widgets/collections/table/columns.tsx
@@ -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 }) =>
+ {(formatterParams as RowNumberFormatterParams).movableRows && <>{" "}>}
+ {cell.getRow().getPosition(true)}
+
),
+ 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 = ;
+ const elWithParams = ;
return renderReactWidget(null, elWithParams)[0];
};
}
diff --git a/apps/client/src/widgets/collections/table/formatters.ts b/apps/client/src/widgets/collections/table/formatters.ts
index 85aee6025..873231381 100644
--- a/apps/client/src/widgets/collections/table/formatters.ts
+++ b/apps/client/src/widgets/collections/table/formatters.ts
@@ -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 += ` `;
- }
- html += cell.getRow().getPosition(true);
- return html;
- };
-}
-
function buildNoteLink(noteId: string, title: string, iconClass: string, colorClass?: string) {
const $noteRef = $("");
const href = `#root/${noteId}`;