From 3669ef3cfd3a2479fd35e6ca23f49b46db76a014 Mon Sep 17 00:00:00 2001 From: Mustafa Buyukcelebi Date: Wed, 21 Aug 2019 14:54:49 +0300 Subject: [PATCH 1/4] Added downvote button for slider --- src/components/upvote/view/upvoteView.js | 95 +++++++++++++++--------- 1 file changed, 60 insertions(+), 35 deletions(-) diff --git a/src/components/upvote/view/upvoteView.js b/src/components/upvote/view/upvoteView.js index 145814f5a..9a74336e5 100644 --- a/src/components/upvote/view/upvoteView.js +++ b/src/components/upvote/view/upvoteView.js @@ -35,6 +35,7 @@ class UpvoteView extends Component { isVoted: get(props, 'isVoted', false), amount: '0.00000', isShowDetails: false, + downvote: false, }; } @@ -80,7 +81,7 @@ class UpvoteView extends Component { } }; - _upvoteContent = async () => { + _upvoteContent = async closePopover => { const { author, currentAccount, @@ -89,40 +90,55 @@ class UpvoteView extends Component { permlink, pinCode, } = this.props; - const { sliderValue } = this.state; + const { sliderValue, downvote } = this.state; - this.setState( - { - isVoting: true, - }, - () => { - handleSetUpvotePercent(sliderValue); - }, - ); + if (!downvote) { + closePopover(); + this.setState( + { + isVoting: true, + }, + () => { + handleSetUpvotePercent(sliderValue); + }, + ); - const weight = sliderValue ? (sliderValue * 100).toFixed(0) * 100 : 0; + const weight = sliderValue ? (sliderValue * 100).toFixed(0) * 100 : 0; - vote(currentAccount, pinCode, author, permlink, weight) - .then(() => { - this.setState( - { - isVoted: !!sliderValue, + 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, - }, - () => { - if (fetchPost) { - fetchPost(); - } - }, - ); - }) - .catch(err => { - Alert.alert('Failed!', err.message); - this.setState({ - isVoted: false, - isVoting: false, + }); }); - }); + } else { + this.setState({ sliderValue: 1, downvote: false }); + } + }; + + _downvoteContent = () => { + const { downvote } = this.state; + + if (downvote) { + // vote action + } + + this.setState({ sliderValue: 1, downvote: true }); }; _handleOnPopoverClose = () => { @@ -146,7 +162,7 @@ class UpvoteView extends Component { payoutDate, intl, } = this.props; - const { isVoting, amount, sliderValue, isVoted, isShowDetails } = this.state; + const { isVoting, amount, sliderValue, isVoted, isShowDetails, downvote } = this.state; let iconName = 'ios-arrow-dropup'; let iconType; @@ -156,9 +172,10 @@ class UpvoteView extends Component { iconType = 'AntDesign'; } - const _percent = `${(sliderValue * 100).toFixed(0)}%`; + const _percent = `${downvote ? '-' : ''}${(sliderValue * 100).toFixed(0)}%`; const _amount = `$${amount}`; const _totalPayout = totalPayout || '0.000'; + const _sliderColor = downvote ? '#ec8b88' : '#357ce6'; return ( @@ -253,8 +270,7 @@ class UpvoteView extends Component { { - closePopover(); - this._upvoteContent(); + this._upvoteContent(closePopover); }} style={styles.upvoteButton} > @@ -269,7 +285,7 @@ class UpvoteView extends Component { {_amount} {_percent} + + + )} From 12de7fb6193df81d6363aed3f52a4065866c55b6 Mon Sep 17 00:00:00 2001 From: Mustafa Buyukcelebi Date: Wed, 21 Aug 2019 22:02:08 +0300 Subject: [PATCH 2/4] Implemented downvote action --- .../upvote/container/upvoteContainer.js | 8 +- src/components/upvote/view/upvoteStyles.js | 2 +- src/components/upvote/view/upvoteView.js | 80 ++++++++++++++++--- src/utils/postParser.js | 25 +++++- 4 files changed, 101 insertions(+), 14 deletions(-) diff --git a/src/components/upvote/container/upvoteContainer.js b/src/components/upvote/container/upvoteContainer.js index 441212430..93f5ae55b 100644 --- a/src/components/upvote/container/upvoteContainer.js +++ b/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} diff --git a/src/components/upvote/view/upvoteStyles.js b/src/components/upvote/view/upvoteStyles.js index 942de45c7..bf7e72451 100644 --- a/src/components/upvote/view/upvoteStyles.js +++ b/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, diff --git a/src/components/upvote/view/upvoteView.js b/src/components/upvote/view/upvoteView.js index 9a74336e5..1ea4ef520 100644 --- a/src/components/upvote/view/upvoteView.js +++ b/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} /> + ) : isDownVoted ? ( + ) : ( {_percent} - + this._downvoteContent(closePopover)} + style={styles.upvoteButton} + > { 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; +}; From 9578dfa4fd1df4dace57294c9ca7966c538a357f Mon Sep 17 00:00:00 2001 From: Mustafa Buyukcelebi Date: Fri, 23 Aug 2019 11:01:15 +0300 Subject: [PATCH 3/4] Comment changes --- .../upvote/container/upvoteContainer.js | 12 ++++++------ src/components/upvote/view/upvoteView.js | 18 +++++------------- src/utils/postParser.js | 2 +- 3 files changed, 12 insertions(+), 20 deletions(-) diff --git a/src/components/upvote/container/upvoteContainer.js b/src/components/upvote/container/upvoteContainer.js index 93f5ae55b..f597fa381 100644 --- a/src/components/upvote/container/upvoteContainer.js +++ b/src/components/upvote/container/upvoteContainer.js @@ -53,12 +53,12 @@ class UpvoteContainer extends PureComponent { } = this.props; const author = get(content, 'author'); - 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 isVoted = + get(content, 'is_voted', false) && parseInt(get(content, 'is_voted'), 10) / 10000; + const isDownVoted = + get(content, 'is_down_voted', false) && + (parseInt(get(content, 'is_down_voted'), 10) / 10000) * -1; + const totalPayout = get(content, 'total_payout'); const isDecinedPayout = get(content, 'is_declined_payout'); const permlink = get(content, 'permlink'); diff --git a/src/components/upvote/view/upvoteView.js b/src/components/upvote/view/upvoteView.js index 1ea4ef520..6297f77b8 100644 --- a/src/components/upvote/view/upvoteView.js +++ b/src/components/upvote/view/upvoteView.js @@ -224,7 +224,7 @@ class UpvoteView extends Component { const _percent = `${downvote ? '-' : ''}${(sliderValue * 100).toFixed(0)}%`; const _amount = `$${amount}`; const _totalPayout = totalPayout || '0.000'; - const _sliderColor = downvote ? '#ec8b88' : '#357ce6'; + const sliderColor = downvote ? '#ec8b88' : '#357ce6'; return ( @@ -249,20 +249,12 @@ class UpvoteView extends Component { isShow={!isVoting} /> - ) : isDownVoted ? ( - ) : ( )} @@ -342,7 +334,7 @@ class UpvoteView extends Component { {_amount} { const isDownVoted = (activeVotes, currentUserName) => { const result = activeVotes.find( - element => element.voter === currentUserName && element.percent < 0, + element => get(element, 'voter') === currentUserName && get(element, 'percent') < 0, ); if (result) { return result.percent; From 76abc9a16abbaa2619bb93a9f9a38568917bbbdc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?u=C4=9Fur=20erdal?= Date: Fri, 23 Aug 2019 16:00:55 +0300 Subject: [PATCH 4/4] Update src/utils/postParser.js --- src/utils/postParser.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/utils/postParser.js b/src/utils/postParser.js index d4855293f..32ea62c19 100644 --- a/src/utils/postParser.js +++ b/src/utils/postParser.js @@ -150,7 +150,7 @@ export const parseComments = async (comments, currentUserName) => { const isVoted = (activeVotes, currentUserName) => { const result = activeVotes.find( - element => element.voter === currentUserName && element.percent > 0, + element => get(element, 'voter') === currentUserName && get(element, 'percent', 0) > 0, ); if (result) { return result.percent;