Experiment show replies hint

This commit is contained in:
Lim Chee Aun 2023-11-14 16:52:47 +08:00
parent fc842e776e
commit d6afb473ee
2 changed files with 35 additions and 8 deletions

View file

@ -28,6 +28,7 @@ export const ICONS = {
'eye-open': () => import('@iconify-icons/mingcute/eye-2-line'),
message: () => import('@iconify-icons/mingcute/mail-line'),
comment: () => import('@iconify-icons/mingcute/chat-3-line'),
comment2: () => import('@iconify-icons/mingcute/comment-2-line'),
home: () => import('@iconify-icons/mingcute/home-3-line'),
notification: () => import('@iconify-icons/mingcute/notification-line'),
follow: () => import('@iconify-icons/mingcute/user-follow-line'),

View file

@ -533,7 +533,7 @@ function Status({
<span class="ib">
{repliesCount > 0 && (
<span>
<Icon icon="reply" alt="Replies" size="s" />{' '}
<Icon icon="comment2" alt="Replies" size="s" />{' '}
<span>{shortenNumber(repliesCount)}</span>
</span>
)}{' '}
@ -989,6 +989,23 @@ function Status({
// );
}, [showMultipleMediaCaptions, displayedMediaAttachments, language]);
const isThread = useMemo(() => {
return (
(!!inReplyToId && inReplyToAccountId === status.account?.id) ||
!!snapStates.statusThreadNumber[sKey]
);
}, [inReplyToId, inReplyToAccountId, status.account?.id, snapStates.statusThreadNumber[sKey]]);
const showCommentHint = useMemo(() => {
return (
!isThread &&
!withinContext &&
!inReplyToId &&
visibility === 'public' &&
repliesCount > 0
);
}, [isThread, withinContext, inReplyToId, repliesCount, visibility]);
return (
<article
data-state-post-id={sKey}
@ -1151,11 +1168,21 @@ function Status({
: ''
}`}
>
<Icon
icon={visibilityIconsMap[visibility]}
alt={visibilityText[visibility]}
size="s"
/>{' '}
{showCommentHint ? (
<Icon
icon="comment2"
size="s"
alt={`${repliesCount} ${
repliesCount === 1 ? 'reply' : 'replies'
}`}
/>
) : (
<Icon
icon={visibilityIconsMap[visibility]}
alt={visibilityText[visibility]}
size="s"
/>
)}{' '}
<RelativeTime datetime={createdAtDate} format="micro" />
</Link>
) : (
@ -1218,8 +1245,7 @@ function Status({
)}
{!withinContext && (
<>
{(!!inReplyToId && inReplyToAccountId === status.account?.id) ||
!!snapStates.statusThreadNumber[sKey] ? (
{isThread ? (
<div class="status-thread-badge">
<Icon icon="thread" size="s" />
Thread