feat(breadcrumb): add tooltip about jumping to top

This commit is contained in:
Elian Doran 2025-12-15 16:40:36 +02:00
parent ca8e889e1e
commit 41b7a295b9
No known key found for this signature in database
2 changed files with 10 additions and 3 deletions

View File

@ -2147,7 +2147,8 @@
"breadcrumb": { "breadcrumb": {
"hoisted_badge": "Hoisted", "hoisted_badge": "Hoisted",
"hoisted_badge_title": "Unhoist", "hoisted_badge_title": "Unhoist",
"workspace_badge": "Workspace" "workspace_badge": "Workspace",
"scroll_to_top_title": "Jump to the beginning of the note"
}, },
"breadcrumb_badges": { "breadcrumb_badges": {
"read_only_explicit": "Read-only", "read_only_explicit": "Read-only",

View File

@ -1,6 +1,6 @@
import "./Breadcrumb.css"; import "./Breadcrumb.css";
import { useState } from "preact/hooks"; import { useRef, useState } from "preact/hooks";
import { Fragment } from "preact/jsx-runtime"; import { Fragment } from "preact/jsx-runtime";
import appContext from "../../components/app_context"; import appContext from "../../components/app_context";
@ -15,7 +15,7 @@ import ActionButton from "../react/ActionButton";
import { Badge } from "../react/Badge"; import { Badge } from "../react/Badge";
import Dropdown from "../react/Dropdown"; import Dropdown from "../react/Dropdown";
import { FormListItem } from "../react/FormList"; import { FormListItem } from "../react/FormList";
import { useChildNotes, useNote, useNoteIcon, useNoteLabel, useNoteLabelBoolean, useNoteProperty } from "../react/hooks"; import { useChildNotes, useNote, useNoteIcon, useNoteLabel, useNoteLabelBoolean, useNoteProperty, useStaticTooltip } from "../react/hooks";
import Icon from "../react/Icon"; import Icon from "../react/Icon";
import NoteLink from "../react/NoteLink"; import NoteLink from "../react/NoteLink";
@ -114,14 +114,20 @@ function BreadcrumbHoistedNoteRoot({ noteId }: { noteId: string }) {
} }
function BreadcrumbLastItem({ notePath }: { notePath: string }) { function BreadcrumbLastItem({ notePath }: { notePath: string }) {
const linkRef = useRef<HTMLAnchorElement>(null);
const noteId = notePath.split("/").at(-1); const noteId = notePath.split("/").at(-1);
const [ note ] = useState(() => froca.getNoteFromCache(noteId!)); const [ note ] = useState(() => froca.getNoteFromCache(noteId!));
const title = useNoteProperty(note, "title"); const title = useNoteProperty(note, "title");
useStaticTooltip(linkRef, {
placement: "top",
title: t("breadcrumb.scroll_to_top_title")
});
if (!note) return null; if (!note) return null;
return ( return (
<a <a
ref={linkRef}
href="#" href="#"
className="breadcrumb-last-item tn-link" className="breadcrumb-last-item tn-link"
onClick={() => { onClick={() => {