diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/view/com/post-thread/PostThreadItem.tsx | 18 | ||||
-rw-r--r-- | src/view/com/post/Post.tsx | 10 | ||||
-rw-r--r-- | src/view/com/posts/FeedItem.tsx | 10 | ||||
-rw-r--r-- | src/view/com/util/PostCtrls.tsx | 24 | ||||
-rw-r--r-- | src/view/com/util/PostMeta.tsx | 49 |
5 files changed, 58 insertions, 53 deletions
diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx index e93f77e3c..d1fb44086 100644 --- a/src/view/com/post-thread/PostThreadItem.tsx +++ b/src/view/com/post-thread/PostThreadItem.tsx @@ -222,11 +222,16 @@ export const PostThreadItem = observer(function PostThreadItem({ <View style={[s.pl10, s.pb5]}> <PostCtrls big + itemHref={itemHref} + itemTitle={itemTitle} + isAuthor={item.post.author.did === store.me.did} isReposted={!!item.post.viewer.repost} isUpvoted={!!item.post.viewer.upvote} onPressReply={onPressReply} onPressToggleRepost={onPressToggleRepost} onPressToggleUpvote={onPressToggleUpvote} + onCopyPostText={onCopyPostText} + onDeletePost={onDeletePost} /> </View> </View> @@ -276,15 +281,10 @@ export const PostThreadItem = observer(function PostThreadItem({ </View> <View style={styles.layoutContent}> <PostMeta - itemHref={itemHref} - itemTitle={itemTitle} authorHref={authorHref} authorHandle={item.post.author.handle} authorDisplayName={item.post.author.displayName} timestamp={item.post.indexedAt} - isAuthor={item.post.author.did === store.me.did} - onCopyPostText={onCopyPostText} - onDeletePost={onDeletePost} /> {item.post.author.viewer?.muted ? ( <View style={[styles.mutedWarning, pal.btn]}> @@ -304,14 +304,16 @@ export const PostThreadItem = observer(function PostThreadItem({ )} <PostEmbeds embed={item.post.embed} style={{marginBottom: 10}} /> <PostCtrls - replyCount={item.post.replyCount} - repostCount={item.post.repostCount} - upvoteCount={item.post.upvoteCount} + itemHref={itemHref} + itemTitle={itemTitle} + isAuthor={item.post.author.did === store.me.did} isReposted={!!item.post.viewer.repost} isUpvoted={!!item.post.viewer.upvote} onPressReply={onPressReply} onPressToggleRepost={onPressToggleRepost} onPressToggleUpvote={onPressToggleUpvote} + onCopyPostText={onCopyPostText} + onDeletePost={onDeletePost} /> </View> </View> diff --git a/src/view/com/post/Post.tsx b/src/view/com/post/Post.tsx index 032d5c147..c9f4d3a16 100644 --- a/src/view/com/post/Post.tsx +++ b/src/view/com/post/Post.tsx @@ -154,15 +154,10 @@ export const Post = observer(function Post({ </View> <View style={styles.layoutContent}> <PostMeta - itemHref={itemHref} - itemTitle={itemTitle} authorHref={authorHref} authorHandle={item.post.author.handle} authorDisplayName={item.post.author.displayName} timestamp={item.post.indexedAt} - isAuthor={item.post.author.did === store.me.did} - onCopyPostText={onCopyPostText} - onDeletePost={onDeletePost} /> {replyHref !== '' && ( <View style={[s.flexRow, s.mb2, {alignItems: 'center'}]}> @@ -198,6 +193,9 @@ export const Post = observer(function Post({ )} <PostEmbeds embed={item.post.embed} style={{marginBottom: 10}} /> <PostCtrls + itemHref={itemHref} + itemTitle={itemTitle} + isAuthor={item.post.author.did === store.me.did} replyCount={item.post.replyCount} repostCount={item.post.repostCount} upvoteCount={item.post.upvoteCount} @@ -206,6 +204,8 @@ export const Post = observer(function Post({ onPressReply={onPressReply} onPressToggleRepost={onPressToggleRepost} onPressToggleUpvote={onPressToggleUpvote} + onCopyPostText={onCopyPostText} + onDeletePost={onDeletePost} /> </View> </View> diff --git a/src/view/com/posts/FeedItem.tsx b/src/view/com/posts/FeedItem.tsx index f7db827bd..96ecae1b5 100644 --- a/src/view/com/posts/FeedItem.tsx +++ b/src/view/com/posts/FeedItem.tsx @@ -177,15 +177,10 @@ export const FeedItem = observer(function ({ </View> <View style={styles.layoutContent}> <PostMeta - itemHref={itemHref} - itemTitle={itemTitle} authorHref={authorHref} authorHandle={item.post.author.handle} authorDisplayName={item.post.author.displayName} timestamp={item.post.indexedAt} - isAuthor={item.post.author.did === store.me.did} - onCopyPostText={onCopyPostText} - onDeletePost={onDeletePost} /> {!isChild && replyHref !== '' && ( <View style={[s.flexRow, s.mb2, {alignItems: 'center'}]}> @@ -226,6 +221,9 @@ export const FeedItem = observer(function ({ )} <PostEmbeds embed={item.post.embed} style={styles.postEmbeds} /> <PostCtrls + itemHref={itemHref} + itemTitle={itemTitle} + isAuthor={item.post.author.did === store.me.did} replyCount={item.post.replyCount} repostCount={item.post.repostCount} upvoteCount={item.post.upvoteCount} @@ -234,6 +232,8 @@ export const FeedItem = observer(function ({ onPressReply={onPressReply} onPressToggleRepost={onPressToggleRepost} onPressToggleUpvote={onPressToggleUpvote} + onCopyPostText={onCopyPostText} + onDeletePost={onDeletePost} /> </View> </View> diff --git a/src/view/com/util/PostCtrls.tsx b/src/view/com/util/PostCtrls.tsx index 4bc33110e..566bd261f 100644 --- a/src/view/com/util/PostCtrls.tsx +++ b/src/view/com/util/PostCtrls.tsx @@ -3,11 +3,15 @@ import {Animated, StyleSheet, TouchableOpacity, View} from 'react-native' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import ReactNativeHapticFeedback from 'react-native-haptic-feedback' import {Text} from './text/Text' +import {PostDropdownBtn} from './forms/DropdownButton' import {UpIcon, UpIconSolid, CommentBottomArrow} from '../../lib/icons' import {s, colors} from '../../lib/styles' import {useAnimatedValue} from '../../lib/hooks/useAnimatedValue' interface PostCtrlsOpts { + itemHref: string + itemTitle: string + isAuthor: boolean big?: boolean replyCount?: number repostCount?: number @@ -17,6 +21,8 @@ interface PostCtrlsOpts { onPressReply: () => void onPressToggleRepost: () => void onPressToggleUpvote: () => void + onCopyPostText: () => void + onDeletePost: () => void } const redgray = '#7A6161' @@ -169,7 +175,23 @@ export function PostCtrls(opts: PostCtrlsOpts) { ) : undefined} </TouchableOpacity> </View> - <View style={s.flex1}></View> + <View style={s.flex1}> + {opts.big ? undefined : ( + <PostDropdownBtn + style={styles.ctrl} + itemHref={opts.itemHref} + itemTitle={opts.itemTitle} + isAuthor={opts.isAuthor} + onCopyPostText={opts.onCopyPostText} + onDeletePost={opts.onDeletePost}> + <FontAwesomeIcon + icon="ellipsis-h" + size={16} + style={[s.mt2, s.mr5, sRedgray]} + /> + </PostDropdownBtn> + )} + </View> </View> ) } diff --git a/src/view/com/util/PostMeta.tsx b/src/view/com/util/PostMeta.tsx index 4cf6cb00c..6c150a677 100644 --- a/src/view/com/util/PostMeta.tsx +++ b/src/view/com/util/PostMeta.tsx @@ -1,28 +1,18 @@ import React from 'react' -import {StyleSheet, View} from 'react-native' -import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' +import {Platform, StyleSheet, View} from 'react-native' import {Link} from '../util/Link' import {Text} from './text/Text' -import {PostDropdownBtn} from './forms/DropdownButton' -import {s} from '../../lib/styles' import {ago} from '../../../lib/strings' -import {useTheme} from '../../lib/ThemeContext' import {usePalette} from '../../lib/hooks/usePalette' interface PostMetaOpts { - itemHref: string - itemTitle: string authorHref: string authorHandle: string authorDisplayName: string | undefined timestamp: string - isAuthor: boolean - onCopyPostText: () => void - onDeletePost: () => void } export function PostMeta(opts: PostMetaOpts) { - const theme = useTheme() const pal = usePalette('default') let displayName = opts.authorDisplayName || opts.authorHandle let handle = opts.authorHandle @@ -31,13 +21,15 @@ export function PostMeta(opts: PostMetaOpts) { // Android simply cannot handle the truncation case we need // so we have to do it manually here // -prf - if (displayName.length + handle.length > 26) { - if (displayName.length > 26) { - displayName = displayName.slice(0, 23) + '...' - } else { - handle = handle.slice(0, 23 - displayName.length) + '...' - if (handle.endsWith('....')) { - handle = handle.slice(0, -4) + '...' + if (Platform.OS === 'android') { + if (displayName.length + handle.length > 26) { + if (displayName.length > 26) { + displayName = displayName.slice(0, 23) + '...' + } else { + handle = handle.slice(0, 23 - displayName.length) + '...' + if (handle.endsWith('....')) { + handle = handle.slice(0, -4) + '...' + } } } } @@ -45,7 +37,7 @@ export function PostMeta(opts: PostMetaOpts) { return ( <View style={styles.meta}> <Link - style={styles.metaItem} + style={[styles.metaItem, styles.maxWidth]} href={opts.authorHref} title={opts.authorHandle}> <Text type="h5" style={[pal.text]} numberOfLines={1}> @@ -60,20 +52,6 @@ export function PostMeta(opts: PostMetaOpts) { <Text type="h6" style={[styles.metaItem, pal.textLight]}> · {ago(opts.timestamp)} </Text> - <View style={s.flex1} /> - <PostDropdownBtn - style={[styles.metaItem, s.pl5]} - itemHref={opts.itemHref} - itemTitle={opts.itemTitle} - isAuthor={opts.isAuthor} - onCopyPostText={opts.onCopyPostText} - onDeletePost={opts.onDeletePost}> - <FontAwesomeIcon - icon="ellipsis-h" - size={14} - style={[s.mt2, s.mr5, pal.text]} - /> - </PostDropdownBtn> </View> ) } @@ -81,11 +59,14 @@ export function PostMeta(opts: PostMetaOpts) { const styles = StyleSheet.create({ meta: { flexDirection: 'row', - alignItems: 'center', + alignItems: 'baseline', paddingTop: 0, paddingBottom: 2, }, metaItem: { paddingRight: 5, }, + maxWidth: { + maxWidth: '70%', + }, }) |