From f235839d03c0e253b31f79802d1cfc2e42f08b6c Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Tue, 16 Dec 2025 13:50:53 +0200
Subject: [PATCH] feat(breadcrumb): indicate archived notes

---
 apps/client/src/widgets/layout/Breadcrumb.css | 4 ++++
 apps/client/src/widgets/react/NoteLink.tsx    | 7 +++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/apps/client/src/widgets/layout/Breadcrumb.css b/apps/client/src/widgets/layout/Breadcrumb.css
index d003c2dc4..626169d45 100644
--- a/apps/client/src/widgets/layout/Breadcrumb.css
+++ b/apps/client/src/widgets/layout/Breadcrumb.css
@@ -21,6 +21,10 @@
         &:hover {
             color: var(--custom-color, inherit);
         }
+
+        &.archived {
+            opacity: 0.6;
+        }
     }
 
     > span,
diff --git a/apps/client/src/widgets/react/NoteLink.tsx b/apps/client/src/widgets/react/NoteLink.tsx
index 6ae05f38c..a415c8b86 100644
--- a/apps/client/src/widgets/react/NoteLink.tsx
+++ b/apps/client/src/widgets/react/NoteLink.tsx
@@ -3,7 +3,7 @@ import { HTMLAttributes } from "preact";
 import { useEffect, useRef, useState } from "preact/hooks";
 
 import link, { calculateHash, ViewScope } from "../../services/link";
-import { useImperativeSearchHighlighlighting, useNote, useNoteColorClass, useNoteIcon, useNoteProperty, useTriliumEvent } from "./hooks";
+import { useImperativeSearchHighlighlighting, useNote, useNoteColorClass, useNoteIcon, useNoteLabel, useNoteLabelBoolean, useNoteProperty, useTriliumEvent } from "./hooks";
 import Icon from "./Icon";
 
 interface NoteLinkOpts {
@@ -88,6 +88,7 @@ export default function NoteLink({ className, containerClassName, notePath, show
 }
 
 interface NewNoteLinkProps extends Pick<HTMLAttributes<HTMLAnchorElement>, "onContextMenu"> {
+    className?: string;
     notePath: string;
     viewScope?: ViewScope;
     noContextMenu?: boolean;
@@ -101,6 +102,7 @@ export function NewNoteLink({ notePath, viewScope, noContextMenu, showNoteIcon,
     const title = useNoteProperty(note, "title");
     const icon = useNoteIcon(showNoteIcon ? note : null);
     const colorClass = useNoteColorClass(note);
+    const [ archived ] = useNoteLabelBoolean(note, "archived");
 
     return (
         <span>
@@ -109,7 +111,8 @@ export function NewNoteLink({ notePath, viewScope, noContextMenu, showNoteIcon,
 
                 <a
                     className={clsx("tn-link", colorClass, {
-                        "no-tooltip-preview": noPreview
+                        "no-tooltip-preview": noPreview,
+                        archived
                     })}
                     href={calculateHash({ notePath, viewScope })}
                     data-no-context-menu={noContextMenu}