feat(board/relation): display note titles

This commit is contained in:
Elian Doran 2025-11-15 10:17:40 +02:00
parent 47f7968dc4
commit ad6d61f1f7
No known key found for this signature in database
3 changed files with 18 additions and 3 deletions

View File

@ -12,6 +12,7 @@ import Card, { CARD_CLIPBOARD_TYPE, CardDragData } from "./card";
import { JSX } from "preact/jsx-runtime"; import { JSX } from "preact/jsx-runtime";
import froca from "../../../services/froca"; import froca from "../../../services/froca";
import { DragData, TREE_CLIPBOARD_TYPE } from "../../note_tree"; import { DragData, TREE_CLIPBOARD_TYPE } from "../../note_tree";
import NoteLink from "../../react/NoteLink";
interface DragContext { interface DragContext {
column: string; column: string;
@ -27,12 +28,14 @@ export default function Column({
api, api,
onColumnHover, onColumnHover,
isAnyColumnDragging, isAnyColumnDragging,
isInRelationMode
}: { }: {
columnItems?: { note: FNote, branch: FBranch }[]; columnItems?: { note: FNote, branch: FBranch }[];
isDraggingColumn: boolean, isDraggingColumn: boolean,
api: BoardApi, api: BoardApi,
onColumnHover?: (index: number, mouseX: number, rect: DOMRect) => void, onColumnHover?: (index: number, mouseX: number, rect: DOMRect) => void,
isAnyColumnDragging?: boolean isAnyColumnDragging?: boolean,
isInRelationMode: boolean
} & DragContext) { } & DragContext) {
const [ isVisible, setVisible ] = useState(true); const [ isVisible, setVisible ] = useState(true);
const { columnNameToEdit, setColumnNameToEdit, dropTarget, draggedCard, dropPosition } = useContext(BoardViewContext)!; const { columnNameToEdit, setColumnNameToEdit, dropTarget, draggedCard, dropPosition } = useContext(BoardViewContext)!;
@ -103,7 +106,11 @@ export default function Column({
> >
{!isEditing ? ( {!isEditing ? (
<> <>
<span className="title">{column}</span> <span className="title">
{isInRelationMode
? <NoteLink notePath={column} showNoteIcon />
: column}
</span>
<span className="counter-badge">{columnItems?.length ?? 0}</span> <span className="counter-badge">{columnItems?.length ?? 0}</span>
<div className="spacer" /> <div className="spacer" />
<span <span

View File

@ -53,6 +53,11 @@
align-items: center; align-items: center;
} }
.board-view-container .board-column h3 a {
text-decoration: none;
color: inherit;
}
.board-view-container .board-column h3 .counter-badge { .board-view-container .board-column h3 .counter-badge {
background-color: var(--muted-text-color); background-color: var(--muted-text-color);
color: var(--main-background-color); color: var(--main-background-color);

View File

@ -46,6 +46,7 @@ export default function BoardView({ note: parentNote, noteIds, viewConfig, saveC
const [ includeArchived ] = useNoteLabelBoolean(parentNote, "includeArchived"); const [ includeArchived ] = useNoteLabelBoolean(parentNote, "includeArchived");
const [ byColumn, setByColumn ] = useState<ColumnMap>(); const [ byColumn, setByColumn ] = useState<ColumnMap>();
const [ columns, setColumns ] = useState<string[]>(); const [ columns, setColumns ] = useState<string[]>();
const [ isInRelationMode, setIsRelationMode ] = useState(false);
const [ draggedCard, setDraggedCard ] = useState<{ noteId: string, branchId: string, fromColumn: string, index: number } | null>(null); const [ draggedCard, setDraggedCard ] = useState<{ noteId: string, branchId: string, fromColumn: string, index: number } | null>(null);
const [ dropTarget, setDropTarget ] = useState<string | null>(null); const [ dropTarget, setDropTarget ] = useState<string | null>(null);
const [ dropPosition, setDropPosition ] = useState<{ column: string, index: number } | null>(null); const [ dropPosition, setDropPosition ] = useState<{ column: string, index: number } | null>(null);
@ -78,8 +79,9 @@ export default function BoardView({ note: parentNote, noteIds, viewConfig, saveC
]); ]);
function refresh() { function refresh() {
getBoardData(parentNote, statusAttribute, viewConfig ?? {}, includeArchived).then(({ byColumn, newPersistedData }) => { getBoardData(parentNote, statusAttribute, viewConfig ?? {}, includeArchived).then(({ byColumn, newPersistedData, isInRelationMode }) => {
setByColumn(byColumn); setByColumn(byColumn);
setIsRelationMode(isInRelationMode);
if (newPersistedData) { if (newPersistedData) {
viewConfig = { ...newPersistedData }; viewConfig = { ...newPersistedData };
@ -171,6 +173,7 @@ export default function BoardView({ note: parentNote, noteIds, viewConfig, saveC
<div className="column-drop-placeholder show" /> <div className="column-drop-placeholder show" />
)} )}
<Column <Column
isInRelationMode={isInRelationMode}
api={api} api={api}
column={column} column={column}
columnIndex={index} columnIndex={index}