this repo has no description
Experiment show replies count for questions
+49
-1
+8
src/components/status.css
+8
src/components/status.css
···
520
520
color: inherit;
521
521
} */
522
522
523
+
.status .content-comment-hint {
524
+
margin-top: 0.25em;
525
+
font-size: 90%;
526
+
display: flex;
527
+
gap: 4px;
528
+
align-items: center;
529
+
}
530
+
523
531
.status.compact-thread .spoiler-badge {
524
532
font-size: smaller;
525
533
color: var(--button-bg-color);
+41
-1
src/components/status.jsx
+41
-1
src/components/status.jsx
···
65
65
import RelativeTime from './relative-time';
66
66
import TranslationBlock from './translation-block';
67
67
68
+
const SHOW_COMMENT_COUNT_LIMIT = 280;
68
69
const INLINE_TRANSLATE_LIMIT = 140;
69
70
const throttle = pThrottle({
70
71
limit: 1,
···
1021
1022
repliesCount,
1022
1023
visibility,
1023
1024
]);
1025
+
const showCommentCount = useMemo(() => {
1026
+
if (
1027
+
card ||
1028
+
poll ||
1029
+
sensitive ||
1030
+
spoilerText ||
1031
+
mediaAttachments?.length ||
1032
+
isThread ||
1033
+
withinContext ||
1034
+
inReplyToId ||
1035
+
repliesCount <= 0
1036
+
) {
1037
+
return false;
1038
+
}
1039
+
const questionRegex = /[??？︖❓❔⁇⁈⁉¿‽؟]/;
1040
+
const containsQuestion = questionRegex.test(content);
1041
+
if (!containsQuestion) return false;
1042
+
const contentLength = htmlContentLength(content);
1043
+
if (contentLength > 0 && contentLength <= SHOW_COMMENT_COUNT_LIMIT) {
1044
+
return true;
1045
+
}
1046
+
}, [
1047
+
card,
1048
+
poll,
1049
+
sensitive,
1050
+
spoilerText,
1051
+
mediaAttachments,
1052
+
reblog,
1053
+
isThread,
1054
+
withinContext,
1055
+
inReplyToId,
1056
+
repliesCount,
1057
+
content,
1058
+
]);
1024
1059
1025
1060
return (
1026
1061
<article
···
1184
1219
: ''
1185
1220
}`}
1186
1221
>
1187
-
{showCommentHint ? (
1222
+
{showCommentHint && !showCommentCount ? (
1188
1223
<Icon
1189
1224
icon="comment2"
1190
1225
size="s"
···
1516
1551
<Card card={card} instance={currentInstance} />
1517
1552
)}
1518
1553
</div>
1554
+
{!isSizeLarge && showCommentCount && (
1555
+
<div class="content-comment-hint insignificant">
1556
+
<Icon icon="comment2" alt="Replies" /> {repliesCount}
1557
+
</div>
1558
+
)}
1519
1559
{isSizeLarge && (
1520
1560
<>
1521
1561
<div class="extra-meta">