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

chore(react/collections/table): port note ID formatter

Browse Source
This commit is contained in:
Elian Doran 2025-09-09 20:35:57 +03:00
parent 33a37be378
commit 043791fc91
No known key found for this signature in database
3 changed files with 19 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
apps/client/src/widgets/collections/table/columns.ts → apps/client/src/widgets/collections/table/columns.tsx
View File

@ -1,7 +1,9 @@
import { MonospaceFormatter, NoteFormatter, NoteTitleFormatter, RowNumberFormatter } from "./formatters.js"; import { NoteFormatter, NoteTitleFormatter, RowNumberFormatter } from "./formatters.js";
import type { ColumnDefinition } from "tabulator-tables"; import type { CellComponent, ColumnDefinition, EmptyCallback } from "tabulator-tables";
import { LabelType } from "../../../services/promoted_attribute_definition_parser.js"; import { LabelType } from "../../../services/promoted_attribute_definition_parser.js";
import { RelationEditor } from "./relation_editor.js"; import { RelationEditor } from "./relation_editor.js";
import { JSX } from "preact";
import { renderReactWidget } from "../../react/react_utils.jsx";
type ColumnType = LabelType | "relation"; type ColumnType = LabelType | "relation";
@ -73,7 +75,7 @@ export function buildColumnDefinitions({ info, movableRows, existingColumnData,
{ {
field: "noteId", field: "noteId",
title: "Note ID", title: "Note ID",
formatter: MonospaceFormatter, formatter: wrapFormatter(({ cell }) => <code>{cell.getValue()}</code>),
visible: false visible: false
}, },
{ {
@ -154,3 +156,15 @@ function calculateIndexColumnWidth(rowNumberHint: number, movableRows: boolean):
} }
return columnWidth; return columnWidth;
} }
interface FormatterOpts {
cell: CellComponent
}
function wrapFormatter(Component: (opts: FormatterOpts) => JSX.Element): ((cell: CellComponent, formatterParams: {}, onRendered: EmptyCallback) => string | HTMLElement) {
return (cell, formatterParams, onRendered) => {
const elWithParams = <Component cell={cell} />;
return renderReactWidget(null, elWithParams)[0];
};
}

4
apps/client/src/widgets/collections/table/formatters.ts
View File

@ -71,10 +71,6 @@ export function RowNumberFormatter(draggableRows: boolean) {
}; };
} }
export function MonospaceFormatter(cell: CellComponent) {
return `<code>${cell.getValue()}</code>`;
}
function buildNoteLink(noteId: string, title: string, iconClass: string, colorClass?: string) { function buildNoteLink(noteId: string, title: string, iconClass: string, colorClass?: string) {
const $noteRef = $("<span>"); const $noteRef = $("<span>");
const href = `#root/${noteId}`; const href = `#root/${noteId}`;

4
apps/client/src/widgets/react/react_utils.tsx
View File

@ -24,11 +24,11 @@ export function refToJQuerySelector<T extends HTMLElement>(ref: RefObject<T> | n
* @param el the JSX element to render. * @param el the JSX element to render.
* @returns the rendered wrapped DOM element. * @returns the rendered wrapped DOM element.
*/ */
export function renderReactWidget(parentComponent: Component, el: JSX.Element) { export function renderReactWidget(parentComponent: Component | null, el: JSX.Element) {
return renderReactWidgetAtElement(parentComponent, el, new DocumentFragment()).children(); return renderReactWidgetAtElement(parentComponent, el, new DocumentFragment()).children();
} }
export function renderReactWidgetAtElement(parentComponent: Component, el: JSX.Element, container: Element | DocumentFragment) { export function renderReactWidgetAtElement(parentComponent: Component | null, el: JSX.Element, container: Element | DocumentFragment) {
render(( render((
<ParentComponent.Provider value={parentComponent}> <ParentComponent.Provider value={parentComponent}>
{el} {el}