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

chore(react/collections/board): render items

Browse Source
This commit is contained in:
Elian Doran 2025-09-10 20:38:12 +03:00
parent 4247c8fdc6
commit 4b769da90b
No known key found for this signature in database
2 changed files with 20 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
apps/client/src/widgets/collections/board/index.tsx
View File

@ -3,6 +3,8 @@ import { ViewModeProps } from "../interface";
import "./index.css";
import { ColumnMap, getBoardData } from "./data";
import { useNoteLabel } from "../../react/hooks";
import FNote from "../../../entities/fnote";
import FBranch from "../../../entities/fbranch";
export interface BoardViewData {
columns?: BoardColumnData[];
@ -37,15 +39,15 @@ export default function BoardView({ note: parentNote, noteIds, viewConfig, saveC
return (
<div className="board-view">
<div className="board-view-container">
{columns?.map(column => (
<Column column={column} />
{byColumn && columns?.map(column => (
<Column column={column} columnItems={byColumn.get(column)} />
))}
</div>
</div>
)
}
function Column({ column }: { column: string }) {
function Column({ column, columnItems }: { column: string, columnItems?: { note: FNote, branch: FBranch }[] }) {
return (
<div className="board-column">
<h3>
@ -54,6 +56,21 @@ function Column({ column }: { column: string }) {
className="edit-icon icon bx bx-edit-alt"
title="Click to edit column title" />
</h3>
{(columnItems ?? []).map(({ note, branch }) => (
<Card note={note} branch={branch} column={column} />
))}
</div>
)
}
function Card({ note }: { note: FNote, branch: FBranch, column: string }) {
const colorClass = note.getColorClass() || '';
return (
<div className={`board-note ${colorClass}`}>
<span class={`icon ${note.getIcon()}`} />
{note.title}
</div>
)
}

28
apps/client/src/widgets/view_widgets/board_view/differential_renderer.ts
View File

@ -345,14 +345,6 @@ export class DifferentialBoardRenderer {
this.dragHandler.setupNoteDropZone($columnEl, column);
this.dragHandler.setupColumnDropZone($columnEl);
// Add cards
for (const item of columnItems) {
if (item.note) {
const $noteEl = this.createCard(item.note, item.branch, column);
$columnEl.append($noteEl);
}
}
// Add "New item" button
const $newItemEl = $("<div>")
.addClass("board-new-item")
@ -366,26 +358,6 @@ export class DifferentialBoardRenderer {
}
private createCard(note: any, branch: any, column: string): JQuery<HTMLElement> {
const $iconEl = $("<span>")
.addClass("icon")
.addClass(note.getIcon());
const colorClass = note.getColorClass() || '';
const $noteEl = $("<div>")
.addClass("board-note")
.attr("data-note-id", note.noteId)
.attr("data-branch-id", branch.branchId)
.attr("data-current-column", column)
.attr("data-icon-class", note.getIcon())
.attr("data-color-class", colorClass)
.text(note.title);
// Add color class to the card if it exists
if (colorClass) {
$noteEl.addClass(colorClass);
}
$noteEl.prepend($iconEl);
$noteEl.on("click", () => appContext.triggerCommand("openInPopup", { noteIdOrPath: note.noteId }));