diff options
author | Paul Frazee <pfrazee@gmail.com> | 2023-01-16 16:09:51 -0600 |
---|---|---|
committer | Paul Frazee <pfrazee@gmail.com> | 2023-01-16 16:09:51 -0600 |
commit | 7f8f53b08753adbc4f6ffdd3a61ec3a6bd3a4899 (patch) | |
tree | 82d6a8633bbe8f8b3892d21ac839192b435c4646 /src/view/com/util/PostMeta.tsx | |
parent | 0e85b332769457850e08c1ee0aea30d083febf5a (diff) | |
download | voidsky-7f8f53b08753adbc4f6ffdd3a61ec3a6bd3a4899.tar.zst |
Move menu controls into post footers and improve meta info rendering
Diffstat (limited to 'src/view/com/util/PostMeta.tsx')
-rw-r--r-- | src/view/com/util/PostMeta.tsx | 49 |
1 files changed, 15 insertions, 34 deletions
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%', + }, }) |