feat(layout): add icon to the badge

This commit is contained in:
Elian Doran 2025-12-09 21:11:30 +02:00
parent 6b50d9b087
commit f42031c8de
No known key found for this signature in database

View File

@ -2,6 +2,7 @@ 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";
export default function NoteBadges() { export default function NoteBadges() {
return ( return (
@ -17,15 +18,18 @@ function ReadOnlyBadge() {
const isExplicitReadOnly = note?.isLabelTruthy("readOnly"); const isExplicitReadOnly = note?.isLabelTruthy("readOnly");
return (isReadOnly && return (isReadOnly &&
<Badge onClick={() => enableEditing()}> <Badge
icon="bx bx-lock"
onClick={() => enableEditing()}>
{isExplicitReadOnly ? "Read-only" : "Auto read-only"} {isExplicitReadOnly ? "Read-only" : "Auto read-only"}
</Badge> </Badge>
); );
} }
function Badge({ children, onClick }: { 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}>
<Icon icon={icon} />&nbsp;
{children} {children}
</div> </div>
); );