diff options
Diffstat (limited to 'src/view/com')
| -rw-r--r-- | src/view/com/feed/FeedItem.tsx | 33 | ||||
| -rw-r--r-- | src/view/com/post-thread/PostThreadItem.tsx | 33 |
2 files changed, 21 insertions, 45 deletions
diff --git a/src/view/com/feed/FeedItem.tsx b/src/view/com/feed/FeedItem.tsx index 18af53dde..9cf70578c 100644 --- a/src/view/com/feed/FeedItem.tsx +++ b/src/view/com/feed/FeedItem.tsx @@ -1,25 +1,13 @@ import React from 'react' import {observer} from 'mobx-react-lite' -import { - Image, - ImageSourcePropType, - StyleSheet, - Text, - TouchableOpacity, - View, -} from 'react-native' +import {Image, StyleSheet, Text, TouchableOpacity, View} from 'react-native' import {bsky, AdxUri} from '@adxp/mock-api' import moment from 'moment' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {OnNavigateContent} from '../../routes/types' import {FeedViewItemModel} from '../../../state/models/feed-view' import {s} from '../../lib/styles' - -const IMAGES: Record<string, ImageSourcePropType> = { - 'alice.com': require('../../assets/alice.jpg'), - 'bob.com': require('../../assets/bob.jpg'), - 'carla.com': require('../../assets/carla.jpg'), -} +import {AVIS} from '../../lib/assets' export const FeedItem = observer(function FeedItem({ item, @@ -40,10 +28,7 @@ export const FeedItem = observer(function FeedItem({ <TouchableOpacity style={styles.outer} onPress={onPressOuter}> {item.repostedBy && ( <View style={styles.repostedBy}> - <FontAwesomeIcon - icon="retweet" - style={[styles.repostedByIcon, s.gray]} - /> + <FontAwesomeIcon icon="retweet" style={styles.repostedByIcon} /> <Text style={[s.gray, s.bold, s.f13]}> Reposted by {item.repostedBy.displayName} </Text> @@ -53,7 +38,7 @@ export const FeedItem = observer(function FeedItem({ <View style={styles.layoutAvi}> <Image style={styles.avi} - source={IMAGES[item.author.name] || IMAGES['alice.com']} + source={AVIS[item.author.name] || AVIS['alice.com']} /> </View> <View style={styles.layoutContent}> @@ -74,14 +59,14 @@ export const FeedItem = observer(function FeedItem({ <View style={styles.ctrls}> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon={['far', 'comment']} /> <Text>{item.replyCount}</Text> </View> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon="retweet" size={22} /> @@ -89,14 +74,14 @@ export const FeedItem = observer(function FeedItem({ </View> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon={['far', 'heart']} /> <Text>{item.likeCount}</Text> </View> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon="share-from-square" /> </View> @@ -120,6 +105,7 @@ const styles = StyleSheet.create({ }, repostedByIcon: { marginRight: 2, + color: 'gray', }, layout: { flexDirection: 'row', @@ -159,5 +145,6 @@ const styles = StyleSheet.create({ }, ctrlIcon: { marginRight: 5, + color: 'gray', }, }) diff --git a/src/view/com/post-thread/PostThreadItem.tsx b/src/view/com/post-thread/PostThreadItem.tsx index 2b72b7e4b..5e01ac0a6 100644 --- a/src/view/com/post-thread/PostThreadItem.tsx +++ b/src/view/com/post-thread/PostThreadItem.tsx @@ -1,13 +1,6 @@ import React from 'react' import {observer} from 'mobx-react-lite' -import { - Image, - ImageSourcePropType, - StyleSheet, - Text, - TouchableOpacity, - View, -} from 'react-native' +import {Image, StyleSheet, Text, TouchableOpacity, View} from 'react-native' import {bsky, AdxUri} from '@adxp/mock-api' import moment from 'moment' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' @@ -15,14 +8,9 @@ import {OnNavigateContent} from '../../routes/types' import {PostThreadViewPostModel} from '../../../state/models/post-thread-view' import {s} from '../../lib/styles' import {pluralize} from '../../lib/strings' +import {AVIS} from '../../lib/assets' -const IMAGES: Record<string, ImageSourcePropType> = { - 'alice.com': require('../../assets/alice.jpg'), - 'bob.com': require('../../assets/bob.jpg'), - 'carla.com': require('../../assets/carla.jpg'), -} - -function iter<T>(n: number, fn: (i: number) => T): Array<T> { +function iter<T>(n: number, fn: (_i: number) => T): Array<T> { const arr: T[] = [] for (let i = 0; i < n; i++) { arr.push(fn(i)) @@ -49,13 +37,13 @@ export const PostThreadItem = observer(function PostThreadItem({ return ( <TouchableOpacity style={styles.outer} onPress={onPressOuter}> <View style={styles.layout}> - {iter(Math.abs(item._depth), () => ( - <View style={styles.replyBar} /> + {iter(Math.abs(item._depth), (i: number) => ( + <View key={i} style={styles.replyBar} /> ))} <View style={styles.layoutAvi}> <Image style={styles.avi} - source={IMAGES[item.author.name] || IMAGES['alice.com']} + source={AVIS[item.author.name] || AVIS['alice.com']} /> </View> <View style={styles.layoutContent}> @@ -104,14 +92,14 @@ export const PostThreadItem = observer(function PostThreadItem({ <View style={styles.ctrls}> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon={['far', 'comment']} /> <Text>{item.replyCount}</Text> </View> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon="retweet" size={22} /> @@ -119,14 +107,14 @@ export const PostThreadItem = observer(function PostThreadItem({ </View> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon={['far', 'heart']} /> <Text>{item.likeCount}</Text> </View> <View style={styles.ctrl}> <FontAwesomeIcon - style={[styles.ctrlIcon, s.gray]} + style={styles.ctrlIcon} icon="share-from-square" /> </View> @@ -204,5 +192,6 @@ const styles = StyleSheet.create({ }, ctrlIcon: { marginRight: 5, + color: 'gray', }, }) |