From 5c8132088f3f23eb0ff366ff157fbe5d392549a9 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Tue, 9 Dec 2025 14:49:19 +0200
Subject: [PATCH] feat(client): use chevrons to display note path

---
 apps/client/src/services/tree.ts                |  4 +++-
 apps/client/src/widgets/ribbon/NotePathsTab.tsx | 11 ++++++-----
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/apps/client/src/services/tree.ts b/apps/client/src/services/tree.ts
index cfa210600..00e88cf6d 100644
--- a/apps/client/src/services/tree.ts
+++ b/apps/client/src/services/tree.ts
@@ -4,6 +4,8 @@ import froca from "./froca.js";
 import hoistedNoteService from "./hoisted_note.js";
 import appContext from "../components/app_context.js";
 
+export const NOTE_PATH_TITLE_SEPARATOR = " › ";
+
 async function resolveNotePath(notePath: string, hoistedNoteId = "root") {
     const runPath = await resolveNotePathToSegments(notePath, hoistedNoteId);
 
@@ -254,7 +256,7 @@ async function getNotePathTitle(notePath: string) {
 
     const titlePath = await getNotePathTitleComponents(notePath);
 
-    return titlePath.join(" / ");
+    return titlePath.join(NOTE_PATH_TITLE_SEPARATOR);
 }
 
 async function getNoteTitleWithPathAsSuffix(notePath: string) {
diff --git a/apps/client/src/widgets/ribbon/NotePathsTab.tsx b/apps/client/src/widgets/ribbon/NotePathsTab.tsx
index 00249b0b4..0b997cfb2 100644
--- a/apps/client/src/widgets/ribbon/NotePathsTab.tsx
+++ b/apps/client/src/widgets/ribbon/NotePathsTab.tsx
@@ -6,6 +6,7 @@ import { useEffect, useMemo, useState } from "preact/hooks";
 import { NotePathRecord } from "../../entities/fnote";
 import NoteLink from "../react/NoteLink";
 import { joinElements } from "../react/react_utils";
+import { NOTE_PATH_TITLE_SEPARATOR } from "../../services/tree";
 
 export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabContext) {
     const [ sortedNotePaths, setSortedNotePaths ] = useState<NotePathRecord[]>();
@@ -33,7 +34,7 @@ export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabConte
                 <div className="note-path-intro">
                     {sortedNotePaths?.length ? t("note_paths.intro_placed") : t("note_paths.intro_not_placed")}
                 </div>
-    
+
                 <ul className="note-path-list">
                     {sortedNotePaths?.length ? sortedNotePaths.map(sortedNotePath => (
                         <NotePath
@@ -42,7 +43,7 @@ export default function NotePathsTab({ note, hoistedNoteId, notePath }: TabConte
                         />
                     )) : undefined}
                 </ul>
-    
+
                 <Button
                     triggerCommand="cloneNoteIdsTo"
                     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 }) {
     const notePath = notePathRecord?.notePath ?? [];
     const notePathString = useMemo(() => notePath.join("/"), [ notePath ]);
-    
+
     const [ classes, icons ] = useMemo(() => {
         const classes: string[] = [];
         const icons: { icon: string, title: string }[] = [];
@@ -95,11 +96,11 @@ function NotePath({ currentNotePath, notePathRecord }: { currentNotePath?: strin
         <li class={classes}>
             {joinElements(fullNotePaths.map(notePath => (
                 <NoteLink notePath={notePath} noPreview />
-            )), " / ")}
+            )), NOTE_PATH_TITLE_SEPARATOR)}
 
             {icons.map(({ icon, title }) => (
                 <span class={icon} title={title} />
             ))}
         </li>
     )
-}
\ No newline at end of file
+}