feat(breadcrumb_badges): integrate note properties tab

This commit is contained in:
Elian Doran 2025-12-11 17:34:04 +02:00
parent 1eee471018
commit fa8287269f
No known key found for this signature in database
4 changed files with 22 additions and 3 deletions

View File

@ -2146,6 +2146,8 @@
"backlinks_one": "{{count}} backlink", "backlinks_one": "{{count}} backlink",
"backlinks_other": "{{count}} backlinks", "backlinks_other": "{{count}} backlinks",
"backlinks_description_one": "This note is linked from {{count}} other note.\n\nClick to view the list of backlinks.", "backlinks_description_one": "This note is linked from {{count}} other note.\n\nClick to view the list of backlinks.",
"backlinks_description_other": "This note is linked from {{count}} other notes.\n\nClick to view the list of backlinks." "backlinks_description_other": "This note is linked from {{count}} other notes.\n\nClick to view the list of backlinks.",
"clipped_note": "Web clip",
"clipped_note_description": "This note was originally taken from {{url}}.\n\nClick to navigate to the source webpage."
} }
} }

View File

@ -33,6 +33,7 @@
&.temporarily-editable-badge { --color: #4fa52b; } &.temporarily-editable-badge { --color: #4fa52b; }
&.read-only-badge { --color: #e33f3b; } &.read-only-badge { --color: #e33f3b; }
&.share-badge { --color: #3b82f6; } &.share-badge { --color: #3b82f6; }
&.clipped-note-badge { --color: #57a2a5; }
&.backlinks-badge { color: var(--badge-text-color); } &.backlinks-badge { color: var(--badge-text-color); }
a { a {

View File

@ -8,7 +8,7 @@ import { t } from "../services/i18n";
import { formatDateTime } from "../utils/formatters"; import { formatDateTime } from "../utils/formatters";
import { BacklinksList, useBacklinkCount } from "./FloatingButtonsDefinitions"; import { BacklinksList, useBacklinkCount } from "./FloatingButtonsDefinitions";
import Dropdown, { DropdownProps } from "./react/Dropdown"; import Dropdown, { DropdownProps } from "./react/Dropdown";
import { useIsNoteReadOnly, useNoteContext, useStaticTooltip } from "./react/hooks"; import { useIsNoteReadOnly, useNoteContext, useNoteLabel, useStaticTooltip } from "./react/hooks";
import Icon from "./react/Icon"; import Icon from "./react/Icon";
import { NoteSizeWidget, useNoteMetadata } from "./ribbon/NoteInfoTab"; import { NoteSizeWidget, useNoteMetadata } from "./ribbon/NoteInfoTab";
import { useShareInfo } from "./shared_info"; import { useShareInfo } from "./shared_info";
@ -20,6 +20,7 @@ export default function BreadcrumbBadges() {
<ReadOnlyBadge /> <ReadOnlyBadge />
<ShareBadge /> <ShareBadge />
<BacklinksBadge /> <BacklinksBadge />
<ClippedNoteBadge />
</div> </div>
); );
} }
@ -114,6 +115,21 @@ function BacklinksBadge() {
); );
} }
function ClippedNoteBadge() {
const { note } = useNoteContext();
const [ pageUrl ] = useNoteLabel(note, "pageUrl");
return (pageUrl &&
<Badge
className="clipped-note-badge"
icon="bx bx-globe"
text={t("breadcrumb_badges.clipped_note")}
tooltip={t("breadcrumb_badges.clipped_note_description", { url: pageUrl })}
href={pageUrl}
/>
);
}
interface BadgeProps { interface BadgeProps {
text?: string; text?: string;
icon?: string; icon?: string;

View File

@ -67,7 +67,7 @@ export const RIBBON_TAB_DEFINITIONS: TabConfiguration[] = [
title: t("note_properties.info"), title: t("note_properties.info"),
icon: "bx bx-info-square", icon: "bx bx-info-square",
content: NotePropertiesTab, content: NotePropertiesTab,
show: ({ note }) => !!note?.getLabelValue("pageUrl"), show: ({ note }) => !isNewLayout && !!note?.getLabelValue("pageUrl"),
activate: true activate: true
}, },
{ {