mirror of
https://github.com/zadam/trilium.git
synced 2026-02-20 04:34:38 +01:00
refactor(badges/content): extract to separate file
This commit is contained in:
parent
f3dccc0aec
commit
7d103f8c50
34
apps/client/src/widgets/layout/ActiveContentBadges.tsx
Normal file
34
apps/client/src/widgets/layout/ActiveContentBadges.tsx
Normal file
@ -0,0 +1,34 @@
|
||||
import { Badge } from "../react/Badge";
|
||||
import FormToggle from "../react/FormToggle";
|
||||
import { useNoteContext, useNoteLabelBoolean } from "../react/hooks";
|
||||
|
||||
export function ActiveContentBadges() {
|
||||
return (
|
||||
<>
|
||||
<IconPackBadge />
|
||||
<ActiveContentToggle />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function IconPackBadge() {
|
||||
const { note } = useNoteContext();
|
||||
const [ isEnabledIconPack ] = useNoteLabelBoolean(note, "iconPack");
|
||||
const [ isDisabledIconPack ] = useNoteLabelBoolean(note, "disabled:iconPack");
|
||||
|
||||
return ((isEnabledIconPack || isDisabledIconPack) &&
|
||||
<Badge
|
||||
className="icon-pack-badge"
|
||||
icon="bx bx-package"
|
||||
text="Icon pack"
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
function ActiveContentToggle() {
|
||||
return <FormToggle
|
||||
switchOnName="Enabled"
|
||||
switchOffName="Enabled"
|
||||
currentValue={true}
|
||||
/>;
|
||||
}
|
||||
@ -46,6 +46,11 @@
|
||||
text-overflow: ellipsis;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.switch-button {
|
||||
--switch-track-height: 8px;
|
||||
--switch-track-width: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-badge {
|
||||
|
||||
@ -10,6 +10,7 @@ import { FormDropdownDivider, FormListItem } from "../react/FormList";
|
||||
import { useGetContextData, useIsNoteReadOnly, useNoteContext, useNoteLabel, useNoteLabelBoolean } from "../react/hooks";
|
||||
import { useShareState } from "../ribbon/BasicPropertiesTab";
|
||||
import { useShareInfo } from "../shared_info";
|
||||
import { ActiveContentBadges } from "./ActiveContentBadges";
|
||||
|
||||
export default function NoteBadges() {
|
||||
return (
|
||||
@ -19,7 +20,7 @@ export default function NoteBadges() {
|
||||
<ShareBadge />
|
||||
<ClippedNoteBadge />
|
||||
<ExecuteBadge />
|
||||
<IconPackBadge />
|
||||
<ActiveContentBadges />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -148,17 +149,3 @@ export function SaveStatusBadge() {
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
function IconPackBadge() {
|
||||
const { note } = useNoteContext();
|
||||
const isEnabledIconPack = useNoteLabelBoolean(note, "iconPack");
|
||||
const isDisabledIconPack = useNoteLabelBoolean(note, "disabled:iconPack");
|
||||
|
||||
return ((isEnabledIconPack || isDisabledIconPack) &&
|
||||
<Badge
|
||||
className="icon-pack-badge"
|
||||
icon="bx bx-package"
|
||||
text="Icon pack"
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user