leaflet.pub
a tool for shared writing and social publishing
shenanigans making a silly separator show sometimes and not others
cozylittle.house
+7
-3
+7
-3
app/reader/ReaderContent.tsx
+7
-3
app/reader/ReaderContent.tsx
···
196
196
showComments: boolean | undefined;
197
197
}) => {
198
198
let smoker = useSmoker();
199
+
let interactionsAvailable =
200
+
props.quotesCount > 0 ||
201
+
(props.showComments !== false && props.commentsCount > 0);
202
+
199
203
return (
200
204
<div className={`flex gap-2 text-tertiary text-sm items-center`}>
201
205
{props.quotesCount === 0 ? null : (
···
204
208
<QuoteTiny aria-hidden /> {props.quotesCount}
205
209
</div>
206
210
)}
207
-
{props.showComments === false ? null : (
211
+
{props.showComments === false || props.commentsCount === 0 ? null : (
208
212
<div className={`flex gap-1 items-center`}>
209
213
<span className="sr-only">Post comments</span>
210
214
<CommentTiny aria-hidden /> {props.commentsCount}
211
215
</div>
212
216
)}
213
-
<Separator classname="h-4 !min-h-0" />
217
+
{interactionsAvailable && <Separator classname="h-4 !min-h-0" />}
214
218
<button
215
219
id={`copy-post-link-${props.postUrl}`}
216
-
className="flex gap-1 items-center hover:font-bold px-1"
220
+
className="flex gap-1 items-center hover:font-bold"
217
221
style={{ pointerEvents: "all" }}
218
222
onClick={(e) => {
219
223
e.stopPropagation();