From ed9691511beb26bdb799bbcb9a973a8b8df3433c Mon Sep 17 00:00:00 2001 From: Samuel Newman Date: Sat, 14 Jun 2025 00:41:12 +0300 Subject: Hover card on anchor displayName/handle (#8479) * add hover to anchor display name / handle * use newer link component * Wrap using a single hover element --------- Co-authored-by: Eric Bailey --- .../PostThread/components/ThreadItemAnchor.tsx | 85 +++++++++++++--------- 1 file changed, 49 insertions(+), 36 deletions(-) (limited to 'src/screens/PostThread/components/ThreadItemAnchor.tsx') diff --git a/src/screens/PostThread/components/ThreadItemAnchor.tsx b/src/screens/PostThread/components/ThreadItemAnchor.tsx index d1e3518cc..f6bc5871c 100644 --- a/src/screens/PostThread/components/ThreadItemAnchor.tsx +++ b/src/screens/PostThread/components/ThreadItemAnchor.tsx @@ -17,7 +17,6 @@ import {makeProfileLink} from '#/lib/routes/links' import {sanitizeDisplayName} from '#/lib/strings/display-names' import {sanitizeHandle} from '#/lib/strings/handles' import {niceDate} from '#/lib/strings/time' -import {s} from '#/lib/styles' import {getTranslatorLink, isPostInLanguage} from '#/locale/helpers' import {logger} from '#/logger' import { @@ -34,7 +33,6 @@ import {type OnPostSuccessData} from '#/state/shell/composer' import {useMergedThreadgateHiddenReplies} from '#/state/threadgate-hidden-replies' import {type PostSource} from '#/state/unstable-post-source' import {PostThreadFollowBtn} from '#/view/com/post-thread/PostThreadFollowBtn' -import {Link} from '#/view/com/util/Link' import {formatCount} from '#/view/com/util/numeric/format' import {PreviewableUserAvatar} from '#/view/com/util/UserAvatar' import { @@ -47,13 +45,14 @@ import {colors} from '#/components/Admonition' import {Button} from '#/components/Button' import {CalendarClock_Stroke2_Corner0_Rounded as CalendarClockIcon} from '#/components/icons/CalendarClock' import {Trash_Stroke2_Corner0_Rounded as TrashIcon} from '#/components/icons/Trash' -import {InlineLinkText} from '#/components/Link' +import {InlineLinkText, Link} from '#/components/Link' import {ContentHider} from '#/components/moderation/ContentHider' import {LabelsOnMyPost} from '#/components/moderation/LabelsOnMe' import {PostAlerts} from '#/components/moderation/PostAlerts' import {type AppModerationCause} from '#/components/Pills' import {Embed, PostEmbedViewContext} from '#/components/Post/Embed' import {PostControls} from '#/components/PostControls' +import {ProfileHoverCard} from '#/components/ProfileHoverCard' import * as Prompt from '#/components/Prompt' import {RichText} from '#/components/RichText' import * as Skele from '#/components/Skeleton' @@ -197,7 +196,6 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({ const threadRootUri = record.reply?.root?.uri || post.uri const authorHref = makeProfileLink(post.author) - const authorTitle = post.author.handle const isThreadAuthor = getThreadAuthor(post, record) === currentAccount?.did const likesHref = useMemo(() => { @@ -321,42 +319,57 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({ live={live} onBeforePress={onOpenAuthor} /> - - - - - {sanitizeDisplayName( + + + + - + onPress={onOpenAuthor}> + + {sanitizeDisplayName( + post.author.displayName || + sanitizeHandle(post.author.handle), + moderation.ui('displayName'), + )} + + - - + + + + + + + + {sanitizeHandle(post.author.handle, '@')} + + - - - {sanitizeHandle(post.author.handle, '@')} - - - + {showFollowButton && ( @@ -417,7 +430,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({ t.atoms.border_contrast_low, ]}> {post.repostCount != null && post.repostCount !== 0 ? ( - + @@ -435,7 +448,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({ {post.quoteCount != null && post.quoteCount !== 0 && !post.viewer?.embeddingDisabled ? ( - + @@ -451,7 +464,7 @@ const ThreadItemAnchorInner = memo(function ThreadItemAnchorInner({ ) : null} {post.likeCount != null && post.likeCount !== 0 ? ( - + -- cgit 1.4.1