zio/bsky-app
2
0
Fork 0
Code Pull requests Releases Packages Activity

Remove downvotes from the UI

Browse source
This commit is contained in:
Paul Frazee 2022-11-20 11:32:13 -06:00
parent 8e3dc52536
commit 3a10139064
5 changed files with 5 additions and 94 deletions
Download patch file Download diff file Expand all files Collapse all files

43
src/view/com/util/PostCtrls.tsx
View file

@ -8,27 +8,23 @@ import Animated, {
interpolate,
} from 'react-native-reanimated'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {UpIcon, UpIconSolid, DownIcon, DownIconSolid} from '../../lib/icons'
import {UpIcon, UpIconSolid} from '../../lib/icons'
import {s, colors} from '../../lib/styles'
interface PostCtrlsOpts {
replyCount: number
repostCount: number
upvoteCount: number
downvoteCount: number
isReposted: boolean
isUpvoted: boolean
isDownvoted: boolean
onPressReply: () => void
onPressToggleRepost: () => void
onPressToggleUpvote: () => void
onPressToggleDownvote: () => void
}
export function PostCtrls(opts: PostCtrlsOpts) {
const interp1 = useSharedValue<number>(0)
const interp2 = useSharedValue<number>(0)
const interp3 = useSharedValue<number>(0)
const anim1Style = useAnimatedStyle(() => ({
transform: [{scale: interpolate(interp1.value, [0, 1.0], [1.0, 3.0])}],
@ -38,10 +34,6 @@ export function PostCtrls(opts: PostCtrlsOpts) {
transform: [{scale: interpolate(interp2.value, [0, 1.0], [1.0, 3.0])}],
opacity: interpolate(interp2.value, [0, 1.0], [1.0, 0.0]),
}))
const anim3Style = useAnimatedStyle(() => ({
transform: [{scale: interpolate(interp3.value, [0, 1.0], [1.0, 3.0])}],
opacity: interpolate(interp3.value, [0, 1.0], [1.0, 0.0]),
}))
const onPressToggleRepostWrapper = () => {
if (!opts.isReposted) {
@ -59,14 +51,6 @@ export function PostCtrls(opts: PostCtrlsOpts) {
}
opts.onPressToggleUpvote()
}
const onPressToggleDownvoteWrapper = () => {
if (!opts.isDownvoted) {
interp3.value = withTiming(1, {duration: 300}, () => {
interp3.value = withDelay(100, withTiming(0, {duration: 20}))
})
}
opts.onPressToggleDownvote()
}
return (
<View style={styles.ctrls}>
@ -124,27 +108,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
</Text>
</TouchableOpacity>
</View>
<View style={s.flex1}>
<TouchableOpacity
style={styles.ctrl}
onPress={onPressToggleDownvoteWrapper}>
<Animated.View style={anim3Style}>
{opts.isDownvoted ? (
<DownIconSolid style={styles.ctrlIconDownvoted} size={18} />
) : (
<DownIcon style={styles.ctrlIcon} size={18} />
)}
</Animated.View>
<Text
style={
opts.isDownvoted
? [s.bold, s.blue3, s.f13, s.ml5]
: [s.gray5, s.f13, s.ml5]
}>
{opts.downvoteCount}
</Text>
</TouchableOpacity>
</View>
<View style={s.flex1}></View>
</View>
)
}
@ -169,7 +133,4 @@ const styles = StyleSheet.create({
ctrlIconUpvoted: {
color: colors.red3,
},
ctrlIconDownvoted: {
color: colors.blue3,
},
})