diff options
Diffstat (limited to 'ui')
-rw-r--r-- | ui/src/components/comment-node.tsx | 37 | ||||
-rw-r--r-- | ui/src/components/post-listing.tsx | 40 |
2 files changed, 64 insertions, 13 deletions
diff --git a/ui/src/components/comment-node.tsx b/ui/src/components/comment-node.tsx index 4d216f97..2c15b6c8 100644 --- a/ui/src/components/comment-node.tsx +++ b/ui/src/components/comment-node.tsx @@ -47,6 +47,8 @@ interface CommentNodeState { showConfirmAppointAsAdmin: boolean; collapsed: boolean; viewSource: boolean; + my_vote: number; + score: number; } interface CommentNodeProps { @@ -76,6 +78,8 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> { showConfirmTransferCommunity: false, showConfirmAppointAsMod: false, showConfirmAppointAsAdmin: false, + my_vote: this.props.node.comment.my_vote, + score: this.props.node.comment.score, }; constructor(props: any, context: any) { @@ -102,7 +106,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> { > <button className={`btn p-0 ${ - node.comment.my_vote == 1 ? 'text-info' : 'text-muted' + this.state.my_vote == 1 ? 'text-info' : 'text-muted' }`} onClick={linkEvent(node, this.handleCommentLike)} > @@ -110,13 +114,11 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> { <use xlinkHref="#icon-arrow-up"></use> </svg> </button> - <div class={`font-weight-bold text-muted`}> - {node.comment.score} - </div> + <div class={`font-weight-bold text-muted`}>{this.state.score}</div> {WebSocketService.Instance.site.enable_downvotes && ( <button className={`btn p-0 ${ - node.comment.my_vote == -1 ? 'text-danger' : 'text-muted' + this.state.my_vote == -1 ? 'text-danger' : 'text-muted' }`} onClick={linkEvent(node, this.handleCommentDisLike)} > @@ -721,19 +723,40 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> { } handleCommentLike(i: CommentNodeI) { + this.state.my_vote = i.comment.my_vote == 1 ? 0 : 1; + let add = 1; + if (i.comment.my_vote == 1) { + add = -1; + } else if (i.comment.my_vote == -1) { + add = 2; + } + + this.state.score = i.comment.score + add; + this.setState(this.state); + let form: CommentLikeForm = { comment_id: i.comment.id, post_id: i.comment.post_id, - score: i.comment.my_vote == 1 ? 0 : 1, + score: this.state.my_vote, }; WebSocketService.Instance.likeComment(form); } handleCommentDisLike(i: CommentNodeI) { + this.state.my_vote = i.comment.my_vote == -1 ? 0 : -1; + let add = -1; + if (i.comment.my_vote == 1) { + add = -2; + } else if (i.comment.my_vote == -1) { + add = 1; + } + this.state.score = i.comment.score + add; + this.setState(this.state); + let form: CommentLikeForm = { comment_id: i.comment.id, post_id: i.comment.post_id, - score: i.comment.my_vote == -1 ? 0 : -1, + score: this.state.my_vote, }; WebSocketService.Instance.likeComment(form); } diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx index e5e71b65..5a528bbf 100644 --- a/ui/src/components/post-listing.tsx +++ b/ui/src/components/post-listing.tsx @@ -44,6 +44,8 @@ interface PostListingState { showConfirmTransferCommunity: boolean; imageExpanded: boolean; viewSource: boolean; + my_vote: number; + score: number; } interface PostListingProps { @@ -68,6 +70,8 @@ export class PostListing extends Component<PostListingProps, PostListingState> { showConfirmTransferCommunity: false, imageExpanded: false, viewSource: false, + my_vote: this.props.post.my_vote, + score: this.props.post.score, }; constructor(props: any, context: any) { @@ -108,7 +112,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> { > <button className={`btn p-0 ${ - post.my_vote == 1 ? 'text-info' : 'text-muted' + this.state.my_vote == 1 ? 'text-info' : 'text-muted' }`} onClick={linkEvent(this, this.handlePostLike)} > @@ -116,11 +120,11 @@ export class PostListing extends Component<PostListingProps, PostListingState> { <use xlinkHref="#icon-arrow-up"></use> </svg> </button> - <div class={`font-weight-bold text-muted`}>{post.score}</div> + <div class={`font-weight-bold text-muted`}>{this.state.score}</div> {WebSocketService.Instance.site.enable_downvotes && ( <button className={`btn p-0 ${ - post.my_vote == -1 ? 'text-danger' : 'text-muted' + this.state.my_vote == -1 ? 'text-danger' : 'text-muted' }`} onClick={linkEvent(this, this.handlePostDisLike)} > @@ -642,7 +646,10 @@ export class PostListing extends Component<PostListingProps, PostListingState> { get isAdmin(): boolean { return ( this.props.admins && - isMod(this.props.admins.map(a => a.id), this.props.post.creator_id) + isMod( + this.props.admins.map(a => a.id), + this.props.post.creator_id + ) ); } @@ -709,17 +716,38 @@ export class PostListing extends Component<PostListingProps, PostListingState> { } handlePostLike(i: PostListing) { + this.state.my_vote = i.props.post.my_vote == 1 ? 0 : 1; + let add = 1; + if (i.props.post.my_vote == 1) { + add = -1; + } else if (i.props.post.my_vote == -1) { + add = 2; + } + + this.state.score = i.props.post.score + add; + this.setState(this.state); + let form: CreatePostLikeForm = { post_id: i.props.post.id, - score: i.props.post.my_vote == 1 ? 0 : 1, + score: this.state.my_vote, }; WebSocketService.Instance.likePost(form); } handlePostDisLike(i: PostListing) { + this.state.my_vote = i.props.post.my_vote == -1 ? 0 : -1; + let add = -1; + if (i.props.post.my_vote == 1) { + add = -2; + } else if (i.props.post.my_vote == -1) { + add = 1; + } + this.state.score = i.props.post.score + add; + this.setState(this.state); + let form: CreatePostLikeForm = { post_id: i.props.post.id, - score: i.props.post.my_vote == -1 ? 0 : -1, + score: this.state.my_vote, }; WebSocketService.Instance.likePost(form); } |