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

feat(breadcrumb_badges): proper link handling support

Browse Source
This commit is contained in:
Elian Doran 2025-12-10 09:47:05 +02:00
parent b014ea8950
commit 40b5e4d549
No known key found for this signature in database
3 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -2138,8 +2138,8 @@
"read_only_temporarily_disabled": "Temporarily editable",
"read_only_temporarily_disabled_description": "This note is currently editable, but it is normally read-only. The note will go back to being read-only as soon as you navigate to another note.\n\nClick to re-enable read-only mode.",
"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.",
"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."
"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."
}
}

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

@ -23,5 +23,10 @@
&.temporarily-editable-badge { --color: #4fa52b; }
&.read-only-badge { --color: #e33f3b; }
&.share-badge { --color: #3b82f6; }
a {
color: inherit;
text-decoration: none;
}
}
}

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

@ -7,7 +7,6 @@ import { useShareInfo } from "./shared_info";
import clsx from "clsx";
import { t } from "../services/i18n";
import { useRef } from "preact/hooks";
import { goToLinkExt } from "../services/link";
export default function BreadcrumbBadges() {
return (
@ -57,14 +56,14 @@ function ShareBadge() {
t("breadcrumb_badges.shared_locally_description", { link })
}
className="share-badge"
onClick={(e) => linkHref && goToLinkExt(e, linkHref)}
href={linkHref}
>
{isSharedExternally ? t("breadcrumb_badges.shared_publicly") : t("breadcrumb_badges.shared_locally")}
</Badge>
);
}
function Badge({ icon, className, children, tooltip, onClick }: { icon: string, className: string, tooltip: string, children: ComponentChildren, onClick?: MouseEventHandler<HTMLDivElement> }) {
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,14 +73,18 @@ function Badge({ icon, className, children, tooltip, onClick }: { icon: string,
title: tooltip
});
const content = <>
<Icon icon={icon} />&nbsp;
{children}
</>;
return (
<div
ref={containerRef}
className={clsx("breadcrumb-badge", className, { "clickable": !!onClick })}
onClick={onClick}
>
<Icon icon={icon} />&nbsp;
{children}
{href ? <a href={href}>{content}</a> : content}
</div>
);
}