tangled
alpha
login
or
join now
leaflet.pub
/
leaflet
289
fork
atom
a tool for shared writing and social publishing
289
fork
atom
overview
issues
27
pulls
pipelines
disable empty date block on lock
awarm.space
1 year ago
79138ae7
640fa691
+12
-4
2 changed files
expand all
collapse all
unified
split
components
Blocks
DateTimeBlock.tsx
Popover.tsx
+8
-3
components/Blocks/DateTimeBlock.tsx
···
24
s.selectedBlocks.find((b) => b.value === props.entityID),
25
);
26
27
-
// let isLocked = useEntity(props.entityID, "block/locked")?.data.value;
28
29
const handleTimeChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {
30
const time = e.target.value;
···
72
73
return (
74
<Popover
0
75
className="w-64 z-10 !px-2"
76
trigger={
77
<div
78
className={`flex flex-row gap-2 group/date w-64 z-[1]
79
${isSelected ? "block-border-selected !border-transparent" : "border border-transparent"}
80
-
${!permissions.write ? "pointer-events-none" : ""}
81
`}
82
>
83
<BlockCalendarSmall className="text-tertiary" />
84
{dateFact ? (
85
-
<div className="group-hover/date:underline font-bold ">
0
0
0
0
86
{selectedDate.toLocaleDateString(undefined, {
87
month: "short",
88
year: "numeric",
···
140
</div>
141
</Popover>
142
);
0
143
}
144
145
const CustomChevron = (props: ChevronProps) => {
···
24
s.selectedBlocks.find((b) => b.value === props.entityID),
25
);
26
27
+
let isLocked = !!useEntity(props.entityID, "block/is-locked")?.data.value;
28
29
const handleTimeChange: React.ChangeEventHandler<HTMLInputElement> = (e) => {
30
const time = e.target.value;
···
72
73
return (
74
<Popover
75
+
disabled={isLocked}
76
className="w-64 z-10 !px-2"
77
trigger={
78
<div
79
className={`flex flex-row gap-2 group/date w-64 z-[1]
80
${isSelected ? "block-border-selected !border-transparent" : "border border-transparent"}
0
81
`}
82
>
83
<BlockCalendarSmall className="text-tertiary" />
84
{dateFact ? (
85
+
<div
86
+
className={`font-bold
87
+
${!permissions.write || isLocked ? "" : "group-hover/date:underline"}
88
+
`}
89
+
>
90
{selectedDate.toLocaleDateString(undefined, {
91
month: "short",
92
year: "numeric",
···
144
</div>
145
</Popover>
146
);
147
+
dis;
148
}
149
150
const CustomChevron = (props: ChevronProps) => {
+4
-1
components/Popover.tsx
···
5
6
export const Popover = (props: {
7
trigger: React.ReactNode;
0
8
children: React.ReactNode;
9
align?: "start" | "end" | "center";
10
background?: string;
···
14
}) => {
15
return (
16
<RadixPopover.Root open={props.open}>
17
-
<RadixPopover.Trigger>{props.trigger}</RadixPopover.Trigger>
0
0
18
<RadixPopover.Portal>
19
<NestedCardThemeProvider>
20
<RadixPopover.Content
···
5
6
export const Popover = (props: {
7
trigger: React.ReactNode;
8
+
disabled?: boolean;
9
children: React.ReactNode;
10
align?: "start" | "end" | "center";
11
background?: string;
···
15
}) => {
16
return (
17
<RadixPopover.Root open={props.open}>
18
+
<RadixPopover.Trigger disabled={props.disabled}>
19
+
{props.trigger}
20
+
</RadixPopover.Trigger>
21
<RadixPopover.Portal>
22
<NestedCardThemeProvider>
23
<RadixPopover.Content