gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-12 10:24:23 +01:00
Code Issues Actions 7 Packages Projects Releases Wiki Activity

chore(breadcrumb_badges): fake backlink widget

Browse Source
This commit is contained in:
Elian Doran 2025-12-10 11:21:06 +02:00
parent 3262e3490a
commit 66008489c4
No known key found for this signature in database
3 changed files with 22 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/client/src/translations/en/translation.json
View File

@ -2140,6 +2140,10 @@
"shared_publicly": "Shared publicly",
"shared_publicly_description": "This note has been published online at {{- link}}, and is publicly accessible.\n\nClick to navigate to the shared note or right click for more options.",
"shared_locally": "Shared locally",
"shared_locally_description": "This note is shared on the local network only at {{- link}}.\n\nClick to navigate to the shared note or right click for more options."
"shared_locally_description": "This note is shared on the local network only at {{- link}}.\n\nClick to navigate to the shared note or right click for more options.",
"backlinks_one": "{{count}} backlink",
"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_other": "This note is linked from {{count}} other notes.\n\nClick to view the list of backlinks."
}
}

1
apps/client/src/widgets/BreadcrumbBadges.css
View File

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

21
apps/client/src/widgets/BreadcrumbBadges.tsx
View File

@ -1,18 +1,20 @@
import "./BreadcrumbBadges.css";
import clsx from "clsx";
import { ComponentChildren, MouseEventHandler } from "preact";
import { useRef } from "preact/hooks";
import { t } from "../services/i18n";
import { useIsNoteReadOnly, useNoteContext, useStaticTooltip } from "./react/hooks";
import Icon from "./react/Icon";
import { useShareInfo } from "./shared_info";
import clsx from "clsx";
import { t } from "../services/i18n";
import { useRef } from "preact/hooks";
export default function BreadcrumbBadges() {
return (
<div className="breadcrumb-badges">
<ReadOnlyBadge />
<ShareBadge />
<BacklinksBadge />
</div>
);
}
@ -63,7 +65,16 @@ function ShareBadge() {
);
}
function Badge({ icon, className, children, tooltip, onClick, href }: { icon: string, className: string, tooltip: string, children: ComponentChildren, onClick?: MouseEventHandler<HTMLDivElement>, href?: string }) {
function BacklinksBadge() {
const count = 1;
return (
<Badge className="backlinks-badge" icon="bx bx-revision" tooltip={t("breadcrumb_badges.backlinks_description", { count })}>
{t("breadcrumb_badges.backlinks", { count })}
</Badge>
);
}
function Badge({ icon, className, children, tooltip, onClick, href }: { icon?: string, className: string, tooltip: string, children: ComponentChildren, onClick?: MouseEventHandler<HTMLDivElement>, href?: string }) {
const containerRef = useRef<HTMLDivElement>(null);
useStaticTooltip(containerRef, {
placement: "bottom",
@ -74,7 +85,7 @@ function Badge({ icon, className, children, tooltip, onClick, href }: { icon: st
});
const content = <>
<Icon icon={icon} />&nbsp;
{icon && <><Icon icon={icon} />&nbsp;</>}
{children}
</>;