TriliumNext/Trilium
1
0
Fork 0
mirror of https://github.com/TriliumNext/Trilium.git synced 2025-12-10 03:53:37 -06:00
Code Issues 1.1k Packages Projects Releases 10 Wiki Activity

feat(client): use chevrons to display note path

Browse Source
This commit is contained in:
Elian Doran 2025-12-09 14:49:19 +02:00
parent 7ee060b228
commit 5c8132088f
No known key found for this signature in database
2 changed files with 9 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/client/src/services/tree.ts
View File

@ -4,6 +4,8 @@ import froca from "./froca.js";
import hoistedNoteService from "./hoisted_note.js"; import hoistedNoteService from "./hoisted_note.js";
import appContext from "../components/app_context.js"; import appContext from "../components/app_context.js";
export const NOTE_PATH_TITLE_SEPARATOR = " › ";
async function resolveNotePath(notePath: string, hoistedNoteId = "root") { async function resolveNotePath(notePath: string, hoistedNoteId = "root") {
const runPath = await resolveNotePathToSegments(notePath, hoistedNoteId); const runPath = await resolveNotePathToSegments(notePath, hoistedNoteId);
@ -254,7 +256,7 @@ async function getNotePathTitle(notePath: string) {
const titlePath = await getNotePathTitleComponents(notePath); const titlePath = await getNotePathTitleComponents(notePath);
return titlePath.join(" / "); return titlePath.join(NOTE_PATH_TITLE_SEPARATOR);
} }
async function getNoteTitleWithPathAsSuffix(notePath: string) { async function getNoteTitleWithPathAsSuffix(notePath: string) {

11
apps/client/src/widgets/ribbon/NotePathsTab.tsx
View File

@ -6,6 +6,7 @@ import { useEffect, useMemo, useState } from "preact/hooks";
import { NotePathRecord } from "../../entities/fnote"; import { NotePathRecord } from "../../entities/fnote";
import NoteLink from "../react/NoteLink"; import NoteLink from "../react/NoteLink";
import { joinElements } from "../react/react_utils"; import { joinElements } from "../react/react_utils";
import { NOTE_PATH_TITLE_SEPARATOR } from "../../services/tree";
export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabContext) { export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabContext) {
const [ sortedNotePaths, setSortedNotePaths ] = useState<NotePathRecord[]>(); const [ sortedNotePaths, setSortedNotePaths ] = useState<NotePathRecord[]>();
@ -33,7 +34,7 @@ export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabConte
<div className="note-path-intro"> <div className="note-path-intro">
{sortedNotePaths?.length ? t("note_paths.intro_placed") : t("note_paths.intro_not_placed")} {sortedNotePaths?.length ? t("note_paths.intro_placed") : t("note_paths.intro_not_placed")}
</div> </div>
<ul className="note-path-list"> <ul className="note-path-list">
{sortedNotePaths?.length ? sortedNotePaths.map(sortedNotePath => ( {sortedNotePaths?.length ? sortedNotePaths.map(sortedNotePath => (
<NotePath <NotePath
@ -42,7 +43,7 @@ export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabConte
/> />
)) : undefined} )) : undefined}
</ul> </ul>
<Button <Button
triggerCommand="cloneNoteIdsTo" triggerCommand="cloneNoteIdsTo"
text={t("note_paths.clone_button")} text={t("note_paths.clone_button")}
@ -55,7 +56,7 @@ export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabConte
function NotePath({ currentNotePath, notePathRecord }: { currentNotePath?: string | null, notePathRecord?: NotePathRecord }) { function NotePath({ currentNotePath, notePathRecord }: { currentNotePath?: string | null, notePathRecord?: NotePathRecord }) {
const notePath = notePathRecord?.notePath ?? []; const notePath = notePathRecord?.notePath ?? [];
const notePathString = useMemo(() => notePath.join("/"), [ notePath ]); const notePathString = useMemo(() => notePath.join("/"), [ notePath ]);
const [ classes, icons ] = useMemo(() => { const [ classes, icons ] = useMemo(() => {
const classes: string[] = []; const classes: string[] = [];
const icons: { icon: string, title: string }[] = []; const icons: { icon: string, title: string }[] = [];
@ -95,11 +96,11 @@ function NotePath({ currentNotePath, notePathRecord }: { currentNotePath?: strin
<li class={classes}> <li class={classes}>
{joinElements(fullNotePaths.map(notePath => ( {joinElements(fullNotePaths.map(notePath => (
<NoteLink notePath={notePath} noPreview /> <NoteLink notePath={notePath} noPreview />
)), " / ")} )), NOTE_PATH_TITLE_SEPARATOR)}
{icons.map(({ icon, title }) => ( {icons.map(({ icon, title }) => (
<span class={icon} title={title} /> <span class={icon} title={title} />
))} ))}
</li> </li>
) )
} }