diff --git a/src/components/Post/Link/index.tsx b/src/components/Post/Link/index.tsx new file mode 100644 index 0000000000..f3b8916bc7 --- /dev/null +++ b/src/components/Post/Link/index.tsx @@ -0,0 +1,40 @@ +import React from 'react' +import {AtUri} from '@atproto/api' +import {msg, plural} from '@lingui/macro' +import {useLingui} from '@lingui/react' + +import {useGetTimeAgo} from '#/lib/hooks/useTimeAgo' +import {makeProfileLink} from '#/lib/routes/links' +import {Link as InternalLink} from '#/components/Link' +import {Props} from '#/components/Post/Link/types' + +export function Link({children, post, ...props}: Props) { + const {_} = useLingui() + const getTimeAgo = useGetTimeAgo() + const href = React.useMemo(() => { + const urip = new AtUri(post.uri) + return makeProfileLink(post.author, 'post', urip.rkey) + }, [post.uri, post.author]) + const label = _(msg`${post.author.handle}: + ${(post.record as any).text}. + ${getTimeAgo(post.indexedAt, new Date(), {format: 'long'})} ago. + ${plural(post.replyCount || 0, { + one: '1 reply', + other: '# replies', + })} + ${plural(post.repostCount || 0, { + one: '1 repost', + other: '# reposts', + })} + ${plural(post.quoteCount || 0, { + one: '1 quote post', + other: '# quote posts', + })} + `) + + return ( + + {children} + + ) +} diff --git a/src/components/Post/Link/index.web.tsx b/src/components/Post/Link/index.web.tsx new file mode 100644 index 0000000000..753f8e84f6 --- /dev/null +++ b/src/components/Post/Link/index.web.tsx @@ -0,0 +1,56 @@ +import React from 'react' +import {Pressable} from 'react-native' +import {AtUri} from '@atproto/api' +import {msg, plural} from '@lingui/macro' +import {useLingui} from '@lingui/react' + +import {useGetTimeAgo} from '#/lib/hooks/useTimeAgo' +import {makeProfileLink} from '#/lib/routes/links' +import {useLink} from '#/components/Link' +import {Props} from '#/components/Post/Link/types' + +export function Link({children, post, ...props}: Props) { + const {_} = useLingui() + const getTimeAgo = useGetTimeAgo() + const href = React.useMemo(() => { + const urip = new AtUri(post.uri) + return makeProfileLink(post.author, 'post', urip.rkey) + }, [post.uri, post.author]) + const {onPress} = useLink({ + to: href, + displayText: '', + disableMismatchWarning: true, + }) + const label = _(msg`${post.author.handle}: + ${(post.record as any).text}. + ${getTimeAgo(post.indexedAt, new Date(), {format: 'long'})} ago. + ${plural(post.replyCount || 0, { + one: '1 reply', + other: '# replies', + })} + ${plural(post.repostCount || 0, { + one: '1 repost', + other: '# reposts', + })} + ${plural(post.quoteCount || 0, { + one: '1 quote post', + other: '# quote posts', + })} + `) + + return ( + { + props.onPress?.(e) + onPress(e) + }}> + {children} + + ) +} diff --git a/src/components/Post/Link/types.ts b/src/components/Post/Link/types.ts new file mode 100644 index 0000000000..63ccace9e4 --- /dev/null +++ b/src/components/Post/Link/types.ts @@ -0,0 +1,12 @@ +import {PressableProps} from 'react-native' +import {AppBskyFeedDefs} from '@atproto/api' + +import {LinkProps} from '#/components/Link' + +export type Props = Pick & + Pick & { + children: + | React.ReactElement + | Iterable + post: AppBskyFeedDefs.PostView + } diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx index 049748754d..0ddf1f00e7 100644 --- a/src/view/com/posts/FeedItem.tsx +++ b/src/view/com/posts/FeedItem.tsx @@ -44,6 +44,7 @@ import {ContentHider} from '#/components/moderation/ContentHider' import {LabelsOnMyPost} from '#/components/moderation/LabelsOnMe' import {PostAlerts} from '#/components/moderation/PostAlerts' import {AppModerationCause} from '#/components/Pills' +import {Link as PostLink} from '#/components/Post/Link' import {ProfileHoverCard} from '#/components/ProfileHoverCard' import {RichText} from '#/components/RichText' import {SubtleWebHover} from '#/components/SubtleWebHover' @@ -239,15 +240,14 @@ let FeedItemInner = ({ : undefined const [hover, setHover] = useState(false) + return ( - { setHover(true) }} @@ -428,7 +428,7 @@ let FeedItemInner = ({ /> - + ) } FeedItemInner = memo(FeedItemInner)