about summary refs log tree commit diff
path: root/src/view/com/util/PostCtrls.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/view/com/util/PostCtrls.tsx')
-rw-r--r--src/view/com/util/PostCtrls.tsx63
1 files changed, 11 insertions, 52 deletions
diff --git a/src/view/com/util/PostCtrls.tsx b/src/view/com/util/PostCtrls.tsx
index a3d2085e9..144351d85 100644
--- a/src/view/com/util/PostCtrls.tsx
+++ b/src/view/com/util/PostCtrls.tsx
@@ -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}>
@@ -75,9 +59,9 @@ export function PostCtrls(opts: PostCtrlsOpts) {
           <FontAwesomeIcon
             style={styles.ctrlIcon}
             icon={['far', 'comment']}
-            size={14}
+            size={16}
           />
-          <Text style={[s.gray5, s.ml5, s.f13]}>{opts.replyCount}</Text>
+          <Text style={[s.gray5, s.ml5, s.f17]}>{opts.replyCount}</Text>
         </TouchableOpacity>
       </View>
       <View style={s.flex1}>
@@ -90,14 +74,14 @@ export function PostCtrls(opts: PostCtrlsOpts) {
                 opts.isReposted ? styles.ctrlIconReposted : styles.ctrlIcon
               }
               icon="retweet"
-              size={18}
+              size={20}
             />
           </Animated.View>
           <Text
             style={
               opts.isReposted
-                ? [s.bold, s.green3, s.f13, s.ml5]
-                : [s.gray5, s.f13, s.ml5]
+                ? [s.bold, s.green3, s.f17, s.ml5]
+                : [s.gray5, s.f17, s.ml5]
             }>
             {opts.repostCount}
           </Text>
@@ -109,42 +93,22 @@ export function PostCtrls(opts: PostCtrlsOpts) {
           onPress={onPressToggleUpvoteWrapper}>
           <Animated.View style={anim2Style}>
             {opts.isUpvoted ? (
-              <UpIconSolid style={styles.ctrlIconUpvoted} size={18} />
+              <UpIconSolid style={[styles.ctrlIconUpvoted]} size={19} />
             ) : (
-              <UpIcon style={styles.ctrlIcon} size={18} />
+              <UpIcon style={[styles.ctrlIcon]} size={20} strokeWidth={1.5} />
             )}
           </Animated.View>
           <Text
             style={
               opts.isUpvoted
-                ? [s.bold, s.red3, s.f13, s.ml5]
-                : [s.gray5, s.f13, s.ml5]
+                ? [s.bold, s.red3, s.f17, s.ml5]
+                : [s.gray5, s.f17, s.ml5]
             }>
             {opts.upvoteCount}
           </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>
   )
 }
@@ -152,12 +116,10 @@ export function PostCtrls(opts: PostCtrlsOpts) {
 const styles = StyleSheet.create({
   ctrls: {
     flexDirection: 'row',
-    paddingRight: 20,
   },
   ctrl: {
     flexDirection: 'row',
     alignItems: 'center',
-    paddingLeft: 4,
     paddingRight: 4,
   },
   ctrlIcon: {
@@ -169,7 +131,4 @@ const styles = StyleSheet.create({
   ctrlIconUpvoted: {
     color: colors.red3,
   },
-  ctrlIconDownvoted: {
-    color: colors.blue3,
-  },
 })