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

feat(layout): add shared badge

Browse Source
This commit is contained in:
Elian Doran 2025-12-09 21:44:39 +02:00
parent f42031c8de
commit 644d051477
No known key found for this signature in database
3 changed files with 35 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/client/src/layouts/desktop_layout.tsx
View File

@ -156,8 +156,8 @@ export default class DesktopLayout {
new ScrollingContainer() new ScrollingContainer()
.filling() .filling()
.optChild(isNewLayout, titleRow) .optChild(isNewLayout, titleRow)
.child(new ContentHeader() .optChild(!isNewLayout, new ContentHeader()
.optChild(!isNewLayout, <ReadOnlyNoteInfoBar />) .child(<ReadOnlyNoteInfoBar />)
.child(<SharedInfo />) .child(<SharedInfo />)
) )
.child(<PromotedAttributes />) .child(<PromotedAttributes />)

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

@ -3,11 +3,13 @@ import "./BreadcrumbBadges.css";
import { ComponentChildren } from "preact"; import { ComponentChildren } from "preact";
import { useIsNoteReadOnly, useNoteContext } from "./react/hooks"; import { useIsNoteReadOnly, useNoteContext } from "./react/hooks";
import Icon from "./react/Icon"; import Icon from "./react/Icon";
import { useShareInfo } from "./shared_info";
export default function NoteBadges() { export default function NoteBadges() {
return ( return (
<div className="breadcrumb-badges"> <div className="breadcrumb-badges">
<ReadOnlyBadge /> <ReadOnlyBadge />
<ShareBadge />
</div> </div>
); );
} }
@ -26,6 +28,19 @@ function ReadOnlyBadge() {
); );
} }
function ShareBadge() {
const { note } = useNoteContext();
const { isSharedExternally, link } = useShareInfo(note);
return (link &&
<Badge
icon={isSharedExternally ? "bx bx-world" : "bx bx-link"}
>
{isSharedExternally ? "Shared publicly" : "Shared locally"}
</Badge>
);
}
function Badge({ icon, children, onClick }: { icon: string, children: ComponentChildren, onClick?: () => void }) { function Badge({ icon, children, onClick }: { icon: string, children: ComponentChildren, onClick?: () => void }) {
return ( return (
<div className="breadcrumb-badge" onClick={onClick}> <div className="breadcrumb-badge" onClick={onClick}>

28
apps/client/src/widgets/shared_info.tsx
View File

@ -10,8 +10,23 @@ import RawHtml from "./react/RawHtml";
export default function SharedInfo() { export default function SharedInfo() {
const { note } = useNoteContext(); const { note } = useNoteContext();
const [ syncServerHost ] = useTriliumOption("syncServerHost"); const { isSharedExternally, link } = useShareInfo(note);
return (
<InfoBar className="shared-info-widget" type="subtle" style={{display: (!link) ? "none" : undefined}}>
{link && (
<RawHtml html={isSharedExternally
? t("shared_info.shared_publicly", { link })
: t("shared_info.shared_locally", { link })} />
)}
<HelpButton helpPage="R9pX4DGra2Vt" style={{ width: "24px", height: "24px" }} />
</InfoBar>
);
}
export function useShareInfo(note: FNote | null | undefined) {
const [ link, setLink ] = useState<string>(); const [ link, setLink ] = useState<string>();
const [ syncServerHost ] = useTriliumOption("syncServerHost");
function refresh() { function refresh() {
if (!note) return; if (!note) return;
@ -48,16 +63,7 @@ export default function SharedInfo() {
} }
}); });
return ( return { link, isSharedExternally: !!syncServerHost };
<InfoBar className="shared-info-widget" type="subtle" style={{display: (!link) ? "none" : undefined}}>
{link && (
<RawHtml html={syncServerHost
? t("shared_info.shared_publicly", { link })
: t("shared_info.shared_locally", { link })} />
)}
<HelpButton helpPage="R9pX4DGra2Vt" style={{ width: "24px", height: "24px" }} />
</InfoBar>
)
} }
function getShareId(note: FNote) { function getShareId(note: FNote) {