Implemented downvote action

src/components/upvote/container/upvoteContainer.js

@@ -53,7 +53,12 @@ class UpvoteContainer extends PureComponent {
     } = this.props;
 
     const author = get(content, 'author');
-    const isVoted = get(content, 'is_voted');
+    const isVoted = get(content, 'is_voted')
+      ? parseInt(get(content, 'is_voted'), 10) / 10000
+      : false;
+    const isDownVoted = get(content, 'is_down_voted')
+      ? (parseInt(get(content, 'is_down_voted', false), 10) / 10000) * -1
+      : false;
     const totalPayout = get(content, 'total_payout');
     const isDecinedPayout = get(content, 'is_declined_payout');
     const permlink = get(content, 'permlink');
@@ -80,6 +85,7 @@ class UpvoteContainer extends PureComponent {
         isLoggedIn={isLoggedIn}
         isShowPayoutValue={isShowPayoutValue}
         isVoted={isVoted}
+        isDownVoted={isDownVoted}
         payoutDate={payoutDate}
         pendingPayout={pendingPayout}
         permlink={permlink}

src/components/upvote/view/upvoteStyles.js

@@ -48,8 +48,8 @@ export default EStyleSheet.create({
     marginLeft: 8,
   },
   percent: {
-    width: 40,
     color: '$primaryDarkGray',
+    marginRight: 5,
   },
   slider: {
     flex: 1,

src/components/upvote/view/upvoteView.js

@@ -30,12 +30,15 @@ class UpvoteView extends Component {
   constructor(props) {
     super(props);
     this.state = {
-      sliderValue: get(props, 'upvotePercent', 1),
+      sliderValue:
+        get(props, 'isVoted', false) ||
+        get(props, 'isDownVoted', 1) ||
+        get(props, 'upvotePercent', 1),
       isVoting: false,
       isVoted: get(props, 'isVoted', false),
       amount: '0.00000',
       isShowDetails: false,
-      downvote: false,
+      downvote: get(props, 'isDownVoted', false),
     };
   }
 
@@ -53,7 +56,12 @@ class UpvoteView extends Component {
     }
 
     if (upvotePercent !== get(nextProps, 'upvotePercent')) {
-      this.setState({ sliderValue: get(nextProps, 'upvotePercent') });
+      this.setState({
+        sliderValue:
+          get(nextProps, 'isVoted', false) ||
+          get(nextProps, 'isDownVoted', 1) ||
+          get(nextProps, 'upvotePercent', 1),
+      });
     }
   }
 
@@ -81,7 +89,7 @@ class UpvoteView extends Component {
     }
   };
 
-  _upvoteContent = async closePopover => {
+  _upvoteContent = closePopover => {
     const {
       author,
       currentAccount,
@@ -131,14 +139,54 @@ class UpvoteView extends Component {
     }
   };
 
-  _downvoteContent = () => {
-    const { downvote } = this.state;
+  _downvoteContent = closePopover => {
+    const {
+      author,
+      currentAccount,
+      fetchPost,
+      handleSetUpvotePercent,
+      permlink,
+      pinCode,
+    } = this.props;
+    const { sliderValue, downvote } = this.state;
 
     if (downvote) {
-      // vote action
-    }
+      closePopover();
+      this.setState(
+        {
+          isVoting: true,
+        },
+        () => {
+          handleSetUpvotePercent(sliderValue);
+        },
+      );
 
-    this.setState({ sliderValue: 1, downvote: true });
+      const weight = sliderValue ? (sliderValue * 100).toFixed(0) * 100 * -1 : 0;
+
+      vote(currentAccount, pinCode, author, permlink, weight)
+        .then(() => {
+          this.setState(
+            {
+              isVoted: !!sliderValue,
+              isVoting: false,
+            },
+            () => {
+              if (fetchPost) {
+                fetchPost();
+              }
+            },
+          );
+        })
+        .catch(err => {
+          Alert.alert('Failed!', err.message);
+          this.setState({
+            isVoted: false,
+            isVoting: false,
+          });
+        });
+    } else {
+      this.setState({ sliderValue: 1, downvote: true });
+    }
   };
 
   _handleOnPopoverClose = () => {
@@ -161,6 +209,7 @@ class UpvoteView extends Component {
       curationPayout,
       payoutDate,
       intl,
+      isDownVoted,
     } = this.props;
     const { isVoting, amount, sliderValue, isVoted, isShowDetails, downvote } = this.state;
 
@@ -200,6 +249,14 @@ class UpvoteView extends Component {
                       isShow={!isVoting}
                     />
                   </View>
+                ) : isDownVoted ? (
+                  <Icon
+                    size={20}
+                    style={[styles.upvoteIcon, { color: '#ec8b88' }]}
+                    active={!isLoggedIn}
+                    iconType="AntDesign"
+                    name="downcircle"
+                  />
                 ) : (
                   <Icon
                     style={[styles.upvoteIcon]}
@@ -297,7 +354,10 @@ class UpvoteView extends Component {
                       }}
                     />
                     <Text style={styles.percent}>{_percent}</Text>
-                    <TouchableOpacity onPress={this._downvoteContent} style={styles.upvoteButton}>
+                    <TouchableOpacity
+                      onPress={() => this._downvoteContent(closePopover)}
+                      style={styles.upvoteButton}
+                    >
                       <Icon
                         size={20}
                         style={[styles.upvoteIcon, { color: '#ec8b88' }]}

src/utils/postParser.js

@@ -42,8 +42,10 @@ export const parsePost = async (post, currentUserName, isPromoted) => {
 
   if (currentUserName) {
     post.is_voted = isVoted(post.active_votes, currentUserName);
+    post.is_down_voted = isDownVoted(post.active_votes, currentUserName);
   } else {
     post.is_voted = false;
+    post.is_down_voted = false;
   }
 
   const totalPayout =
@@ -133,8 +135,10 @@ export const parseComments = async (comments, currentUserName) => {
 
     if (currentUserName && activeVotes && activeVotes.length > 0) {
       comment.is_voted = isVoted(activeVotes, currentUserName);
+      comment.is_down_voted = isDownVoted(comment.active_votes, currentUserName);
     } else {
       comment.is_voted = false;
+      comment.is_down_voted = false;
     }
     return comment;
   });
@@ -144,5 +148,22 @@ export const parseComments = async (comments, currentUserName) => {
   return _comments;
 };
 
-const isVoted = (activeVotes, currentUserName) =>
-  activeVotes.some(v => v.voter === currentUserName && v.percent > 0);
+const isVoted = (activeVotes, currentUserName) => {
+  const result = activeVotes.find(
+    element => element.voter === currentUserName && element.percent > 0,
+  );
+  if (result) {
+    return result.percent;
+  }
+  return false;
+};
+
+const isDownVoted = (activeVotes, currentUserName) => {
+  const result = activeVotes.find(
+    element => element.voter === currentUserName && element.percent < 0,
+  );
+  if (result) {
+    return result.percent;
+  }
+  return false;
+};