diff options
Diffstat (limited to 'src/view/com/post/Post.tsx')
| -rw-r--r-- | src/view/com/post/Post.tsx | 382 |
1 files changed, 190 insertions, 192 deletions
diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx index 661b3a899..0855f25bf 100644 --- a/src/view/com/post/Post.tsx +++ b/src/view/com/post/Post.tsx @@ -31,7 +31,7 @@ import {usePalette} from 'lib/hooks/usePalette' import {getTranslatorLink, isPostInLanguage} from '../../../locale/helpers' import {makeProfileLink} from 'lib/routes/links' -export const Post = observer(function Post({ +export const Post = observer(function PostImpl({ view, showReplyLine, hideError, @@ -88,214 +88,212 @@ export const Post = observer(function Post({ ) }) -const PostLoaded = observer( - ({ - item, - record, - setDeleted, - showReplyLine, - style, - }: { - item: PostThreadItemModel - record: FeedPost.Record - setDeleted: (v: boolean) => void - showReplyLine?: boolean - style?: StyleProp<ViewStyle> - }) => { - const pal = usePalette('default') - const store = useStores() +const PostLoaded = observer(function PostLoadedImpl({ + item, + record, + setDeleted, + showReplyLine, + style, +}: { + item: PostThreadItemModel + record: FeedPost.Record + setDeleted: (v: boolean) => void + showReplyLine?: boolean + style?: StyleProp<ViewStyle> +}) { + const pal = usePalette('default') + const store = useStores() - const itemUri = item.post.uri - const itemCid = item.post.cid - const itemUrip = new AtUri(item.post.uri) - const itemHref = makeProfileLink(item.post.author, 'post', itemUrip.rkey) - const itemTitle = `Post by ${item.post.author.handle}` - let replyAuthorDid = '' - if (record.reply) { - const urip = new AtUri(record.reply.parent?.uri || record.reply.root.uri) - replyAuthorDid = urip.hostname - } + const itemUri = item.post.uri + const itemCid = item.post.cid + const itemUrip = new AtUri(item.post.uri) + const itemHref = makeProfileLink(item.post.author, 'post', itemUrip.rkey) + const itemTitle = `Post by ${item.post.author.handle}` + let replyAuthorDid = '' + if (record.reply) { + const urip = new AtUri(record.reply.parent?.uri || record.reply.root.uri) + replyAuthorDid = urip.hostname + } - const translatorUrl = getTranslatorLink(record?.text || '') - const needsTranslation = useMemo( - () => - store.preferences.contentLanguages.length > 0 && - !isPostInLanguage(item.post, store.preferences.contentLanguages), - [item.post, store.preferences.contentLanguages], - ) + const translatorUrl = getTranslatorLink(record?.text || '') + const needsTranslation = useMemo( + () => + store.preferences.contentLanguages.length > 0 && + !isPostInLanguage(item.post, store.preferences.contentLanguages), + [item.post, store.preferences.contentLanguages], + ) - const onPressReply = React.useCallback(() => { - store.shell.openComposer({ - replyTo: { - uri: item.post.uri, - cid: item.post.cid, - text: record.text as string, - author: { - handle: item.post.author.handle, - displayName: item.post.author.displayName, - avatar: item.post.author.avatar, - }, + const onPressReply = React.useCallback(() => { + store.shell.openComposer({ + replyTo: { + uri: item.post.uri, + cid: item.post.cid, + text: record.text as string, + author: { + handle: item.post.author.handle, + displayName: item.post.author.displayName, + avatar: item.post.author.avatar, }, - }) - }, [store, item, record]) + }, + }) + }, [store, item, record]) - const onPressToggleRepost = React.useCallback(() => { - return item - .toggleRepost() - .catch(e => store.log.error('Failed to toggle repost', e)) - }, [item, store]) + const onPressToggleRepost = React.useCallback(() => { + return item + .toggleRepost() + .catch(e => store.log.error('Failed to toggle repost', e)) + }, [item, store]) - const onPressToggleLike = React.useCallback(() => { - return item - .toggleLike() - .catch(e => store.log.error('Failed to toggle like', e)) - }, [item, store]) + const onPressToggleLike = React.useCallback(() => { + return item + .toggleLike() + .catch(e => store.log.error('Failed to toggle like', e)) + }, [item, store]) - const onCopyPostText = React.useCallback(() => { - Clipboard.setString(record.text) - Toast.show('Copied to clipboard') - }, [record]) + const onCopyPostText = React.useCallback(() => { + Clipboard.setString(record.text) + Toast.show('Copied to clipboard') + }, [record]) - const onOpenTranslate = React.useCallback(() => { - Linking.openURL(translatorUrl) - }, [translatorUrl]) + const onOpenTranslate = React.useCallback(() => { + Linking.openURL(translatorUrl) + }, [translatorUrl]) - const onToggleThreadMute = React.useCallback(async () => { - try { - await item.toggleThreadMute() - if (item.isThreadMuted) { - Toast.show('You will no longer receive notifications for this thread') - } else { - Toast.show('You will now receive notifications for this thread') - } - } catch (e) { - store.log.error('Failed to toggle thread mute', e) + const onToggleThreadMute = React.useCallback(async () => { + try { + await item.toggleThreadMute() + if (item.isThreadMuted) { + Toast.show('You will no longer receive notifications for this thread') + } else { + Toast.show('You will now receive notifications for this thread') } - }, [item, store]) + } catch (e) { + store.log.error('Failed to toggle thread mute', e) + } + }, [item, store]) - const onDeletePost = React.useCallback(() => { - item.delete().then( - () => { - setDeleted(true) - Toast.show('Post deleted') - }, - e => { - store.log.error('Failed to delete post', e) - Toast.show('Failed to delete post, please try again') - }, - ) - }, [item, setDeleted, store]) + const onDeletePost = React.useCallback(() => { + item.delete().then( + () => { + setDeleted(true) + Toast.show('Post deleted') + }, + e => { + store.log.error('Failed to delete post', e) + Toast.show('Failed to delete post, please try again') + }, + ) + }, [item, setDeleted, store]) - return ( - <Link href={itemHref} style={[styles.outer, pal.view, pal.border, style]}> - {showReplyLine && <View style={styles.replyLine} />} - <View style={styles.layout}> - <View style={styles.layoutAvi}> - <PreviewableUserAvatar - size={52} - did={item.post.author.did} - handle={item.post.author.handle} - avatar={item.post.author.avatar} - moderation={item.moderation.avatar} - /> - </View> - <View style={styles.layoutContent}> - <PostMeta - author={item.post.author} - authorHasWarning={!!item.post.author.labels?.length} - timestamp={item.post.indexedAt} - postHref={itemHref} + return ( + <Link href={itemHref} style={[styles.outer, pal.view, pal.border, style]}> + {showReplyLine && <View style={styles.replyLine} />} + <View style={styles.layout}> + <View style={styles.layoutAvi}> + <PreviewableUserAvatar + size={52} + did={item.post.author.did} + handle={item.post.author.handle} + avatar={item.post.author.avatar} + moderation={item.moderation.avatar} + /> + </View> + <View style={styles.layoutContent}> + <PostMeta + author={item.post.author} + authorHasWarning={!!item.post.author.labels?.length} + timestamp={item.post.indexedAt} + postHref={itemHref} + /> + {replyAuthorDid !== '' && ( + <View style={[s.flexRow, s.mb2, s.alignCenter]}> + <FontAwesomeIcon + icon="reply" + size={9} + style={[pal.textLight, s.mr5]} + /> + <Text + type="sm" + style={[pal.textLight, s.mr2]} + lineHeight={1.2} + numberOfLines={1}> + Reply to{' '} + <UserInfoText + type="sm" + did={replyAuthorDid} + attr="displayName" + style={[pal.textLight]} + /> + </Text> + </View> + )} + <ContentHider + moderation={item.moderation.content} + style={styles.contentHider} + childContainerStyle={styles.contentHiderChild}> + <PostAlerts + moderation={item.moderation.content} + style={styles.alert} /> - {replyAuthorDid !== '' && ( - <View style={[s.flexRow, s.mb2, s.alignCenter]}> - <FontAwesomeIcon - icon="reply" - size={9} - style={[pal.textLight, s.mr5]} + {item.richText?.text ? ( + <View style={styles.postTextContainer}> + <RichText + testID="postText" + type="post-text" + richText={item.richText} + lineHeight={1.3} + style={s.flex1} /> - <Text - type="sm" - style={[pal.textLight, s.mr2]} - lineHeight={1.2} - numberOfLines={1}> - Reply to{' '} - <UserInfoText - type="sm" - did={replyAuthorDid} - attr="displayName" - style={[pal.textLight]} - /> - </Text> </View> - )} - <ContentHider - moderation={item.moderation.content} - style={styles.contentHider} - childContainerStyle={styles.contentHiderChild}> - <PostAlerts - moderation={item.moderation.content} - style={styles.alert} - /> - {item.richText?.text ? ( - <View style={styles.postTextContainer}> - <RichText - testID="postText" - type="post-text" - richText={item.richText} - lineHeight={1.3} - style={s.flex1} - /> - </View> - ) : undefined} - {item.post.embed ? ( - <ContentHider + ) : undefined} + {item.post.embed ? ( + <ContentHider + moderation={item.moderation.embed} + style={styles.contentHider}> + <PostEmbeds + embed={item.post.embed} moderation={item.moderation.embed} - style={styles.contentHider}> - <PostEmbeds - embed={item.post.embed} - moderation={item.moderation.embed} - /> - </ContentHider> - ) : null} - {needsTranslation && ( - <View style={[pal.borderDark, styles.translateLink]}> - <Link href={translatorUrl} title="Translate"> - <Text type="sm" style={pal.link}> - Translate this post - </Text> - </Link> - </View> - )} - </ContentHider> - <PostCtrls - itemUri={itemUri} - itemCid={itemCid} - itemHref={itemHref} - itemTitle={itemTitle} - author={item.post.author} - indexedAt={item.post.indexedAt} - text={item.richText?.text || record.text} - isAuthor={item.post.author.did === store.me.did} - replyCount={item.post.replyCount} - repostCount={item.post.repostCount} - likeCount={item.post.likeCount} - isReposted={!!item.post.viewer?.repost} - isLiked={!!item.post.viewer?.like} - isThreadMuted={item.isThreadMuted} - onPressReply={onPressReply} - onPressToggleRepost={onPressToggleRepost} - onPressToggleLike={onPressToggleLike} - onCopyPostText={onCopyPostText} - onOpenTranslate={onOpenTranslate} - onToggleThreadMute={onToggleThreadMute} - onDeletePost={onDeletePost} - /> - </View> + /> + </ContentHider> + ) : null} + {needsTranslation && ( + <View style={[pal.borderDark, styles.translateLink]}> + <Link href={translatorUrl} title="Translate"> + <Text type="sm" style={pal.link}> + Translate this post + </Text> + </Link> + </View> + )} + </ContentHider> + <PostCtrls + itemUri={itemUri} + itemCid={itemCid} + itemHref={itemHref} + itemTitle={itemTitle} + author={item.post.author} + indexedAt={item.post.indexedAt} + text={item.richText?.text || record.text} + isAuthor={item.post.author.did === store.me.did} + replyCount={item.post.replyCount} + repostCount={item.post.repostCount} + likeCount={item.post.likeCount} + isReposted={!!item.post.viewer?.repost} + isLiked={!!item.post.viewer?.like} + isThreadMuted={item.isThreadMuted} + onPressReply={onPressReply} + onPressToggleRepost={onPressToggleRepost} + onPressToggleLike={onPressToggleLike} + onCopyPostText={onCopyPostText} + onOpenTranslate={onOpenTranslate} + onToggleThreadMute={onToggleThreadMute} + onDeletePost={onDeletePost} + /> </View> - </Link> - ) - }, -) + </View> + </Link> + ) +}) const styles = StyleSheet.create({ outer: { |