Refer to upvotes as 'likes' in the UI (will change in the protocol soon)

This commit is contained in:
Paul Frazee 2023-01-17 12:35:47 -06:00
parent ee8d311795
commit 798622b307
7 changed files with 69 additions and 21 deletions

View file

@ -8,7 +8,7 @@ import {NotificationsViewItemModel} from '../../../state/models/notifications-vi
import {PostThreadViewModel} from '../../../state/models/post-thread-view'
import {s, colors} from '../../lib/styles'
import {ago, pluralize} from '../../../lib/strings'
import {UpIconSolid} from '../../lib/icons'
import {HeartIconSolid} from '../../lib/icons'
import {Text} from '../util/text/Text'
import {UserAvatar} from '../util/UserAvatar'
import {ImageHorzList} from '../util/images/ImageHorzList'
@ -72,11 +72,11 @@ export const FeedItem = observer(function FeedItem({
}
let action = ''
let icon: Props['icon'] | 'UpIconSolid'
let icon: Props['icon'] | 'HeartIconSolid'
let iconStyle: Props['style'] = []
if (item.isUpvote) {
action = 'upvoted your post'
icon = 'UpIconSolid'
action = 'liked your post'
icon = 'HeartIconSolid'
iconStyle = [s.red3, {position: 'relative', top: -4}]
} else if (item.isRepost) {
action = 'reposted your post'
@ -132,8 +132,8 @@ export const FeedItem = observer(function FeedItem({
noFeedback>
<View style={styles.layout}>
<View style={styles.layoutIcon}>
{icon === 'UpIconSolid' ? (
<UpIconSolid size={26} style={[styles.icon, ...iconStyle]} />
{icon === 'HeartIconSolid' ? (
<HeartIconSolid size={26} style={[styles.icon, ...iconStyle]} />
) : (
<FontAwesomeIcon
icon={icon}

View file

@ -47,7 +47,7 @@ export const PostThreadItem = observer(function PostThreadItem({
const urip = new AtUri(item.post.uri)
return `/profile/${item.post.author.handle}/post/${urip.rkey}/upvoted-by`
}, [item.post.uri, item.post.author.handle])
const upvotesTitle = 'Upvotes on this post'
const upvotesTitle = 'Likes on this post'
const repostsHref = useMemo(() => {
const urip = new AtUri(item.post.uri)
return `/profile/${item.post.author.handle}/post/${urip.rkey}/reposted-by`
@ -209,7 +209,7 @@ export const PostThreadItem = observer(function PostThreadItem({
<Text type="h5" style={pal.text}>
{item.post.upvoteCount}
</Text>{' '}
{pluralize(item.post.upvoteCount, 'upvote')}
{pluralize(item.post.upvoteCount, 'like')}
</Text>
</Link>
) : (

View file

@ -1,7 +1,7 @@
import React from 'react'
import {StyleSheet, StyleProp, View, ViewStyle} from 'react-native'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {UpIcon} from '../../lib/icons'
import {HeartIcon} from '../../lib/icons'
import {s} from '../../lib/styles'
import {useTheme} from '../../lib/ThemeContext'
import {usePalette} from '../../lib/hooks/usePalette'
@ -70,7 +70,7 @@ export function PostLoadingPlaceholder({
/>
</View>
<View style={s.flex1}>
<UpIcon
<HeartIcon
style={{color: theme.palette.default.icon}}
size={17}
strokeWidth={1.7}

View file

@ -11,7 +11,7 @@ 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 {HeartIcon, HeartIconSolid, CommentBottomArrow} from '../../lib/icons'
import {s, colors} from '../../lib/styles'
import {useTheme} from '../../lib/ThemeContext'
import {useAnimatedValue} from '../../lib/hooks/useAnimatedValue'
@ -123,7 +123,10 @@ export function PostCtrls(opts: PostCtrlsOpts) {
hitSlop={HITSLOP}
onPress={opts.onPressReply}>
<CommentBottomArrow
style={defaultCtrlColor}
style={[
defaultCtrlColor,
opts.big ? {marginTop: 2} : {marginTop: 1},
]}
strokeWidth={3}
size={opts.big ? 20 : 15}
/>
@ -167,15 +170,18 @@ export function PostCtrls(opts: PostCtrlsOpts) {
onPress={onPressToggleUpvoteWrapper}>
<Animated.View style={anim2Style}>
{opts.isUpvoted ? (
<UpIconSolid
<HeartIconSolid
style={[styles.ctrlIconUpvoted]}
size={opts.big ? 22 : 19}
size={opts.big ? 22 : 16}
/>
) : (
<UpIcon
style={defaultCtrlColor}
size={opts.big ? 22 : 19}
strokeWidth={1.5}
<HeartIcon
style={[
defaultCtrlColor,
opts.big ? {marginTop: 1} : undefined,
]}
strokeWidth={3}
size={opts.big ? 20 : 16}
/>
)}
</Animated.View>