fix: Specify vote content type so buttons work for both comments and posts
authorJay Sitter <jay@jaysitter.com>
Fri, 23 Jun 2023 16:14:24 +0000 (12:14 -0400)
committerJay Sitter <jay@jaysitter.com>
Fri, 23 Jun 2023 16:14:49 +0000 (12:14 -0400)
src/shared/components/comment/comment-node.tsx
src/shared/components/common/vote-buttons.tsx
src/shared/components/post/post-listing.tsx
src/shared/interfaces.ts

index d38a7af90b67e6801184337e48442a2d1039c784..2fabba110aa458356716d589cb1c9f1175eaf931 100644 (file)
@@ -52,6 +52,7 @@ import {
   CommentNodeI,
   CommentViewType,
   PurgeType,
+  VoteContentType,
 } from "../../interfaces";
 import { mdToHtml, mdToHtmlNoImages } from "../../markdown";
 import { I18NextService, UserService } from "../../services";
@@ -437,6 +438,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
                   {UserService.Instance.myUserInfo && !this.props.viewOnly && (
                     <>
                       <VoteButtonsCompact
+                        voteContentType={VoteContentType.Comment}
                         id={this.commentView.comment.id}
                         onVote={this.props.onCommentVote}
                         enableDownvotes={this.props.enableDownvotes}
index b337794f6cd841f0b1ed459dd98c02710dddd555..f6113c478b620121b9f860ce74259d31528e6b31 100644 (file)
@@ -8,11 +8,12 @@ import {
   CreatePostLike,
   PostAggregates,
 } from "lemmy-js-client";
-import { VoteType } from "../../interfaces";
+import { VoteContentType, VoteType } from "../../interfaces";
 import { I18NextService } from "../../services";
 import { Icon, Spinner } from "../common/icon";
 
 interface VoteButtonsProps {
+  voteContentType: VoteContentType;
   id: number;
   onVote: (i: CreateCommentLike | CreatePostLike) => void;
   enableDownvotes?: boolean;
@@ -46,21 +47,45 @@ const tippy = (counts: CommentAggregates | PostAggregates): string => {
 
 const handleUpvote = (i: VoteButtons) => {
   i.setState({ upvoteLoading: true });
-  i.props.onVote({
-    id: i.props.id,
-    score: newVote(VoteType.Upvote, i.props.my_vote),
-    auth: myAuthRequired(),
-  });
+
+  switch (i.props.voteContentType) {
+    case VoteContentType.Comment:
+      i.props.onVote({
+        comment_id: i.props.id,
+        score: newVote(VoteType.Upvote, i.props.my_vote),
+        auth: myAuthRequired(),
+      });
+      break;
+    case VoteContentType.Post:
+    default:
+      i.props.onVote({
+        post_id: i.props.id,
+        score: newVote(VoteType.Upvote, i.props.my_vote),
+        auth: myAuthRequired(),
+      });
+  }
+
   i.setState({ upvoteLoading: false });
 };
 
 const handleDownvote = (i: VoteButtons) => {
   i.setState({ downvoteLoading: true });
-  i.props.onVote({
-    id: i.props.id,
-    score: newVote(VoteType.Downvote, i.props.my_vote),
-    auth: myAuthRequired(),
-  });
+  switch (i.props.voteContentType) {
+    case VoteContentType.Comment:
+      i.props.onVote({
+        comment_id: i.props.id,
+        score: newVote(VoteType.Downvote, i.props.my_vote),
+        auth: myAuthRequired(),
+      });
+      break;
+    case VoteContentType.Post:
+    default:
+      i.props.onVote({
+        post_id: i.props.id,
+        score: newVote(VoteType.Downvote, i.props.my_vote),
+        auth: myAuthRequired(),
+      });
+  }
   i.setState({ downvoteLoading: false });
 };
 
index e8ab95ebe05d29477996ebf237cfeedf92ce7404..5a5ffe0920e27b47193ff01d34adbc4177c359b2 100644 (file)
@@ -43,7 +43,12 @@ import {
   TransferCommunity,
 } from "lemmy-js-client";
 import { relTags } from "../../config";
-import { BanType, PostFormParams, PurgeType } from "../../interfaces";
+import {
+  BanType,
+  PostFormParams,
+  PurgeType,
+  VoteContentType,
+} from "../../interfaces";
 import { mdNoImages, mdToHtml, mdToHtmlInline } from "../../markdown";
 import { I18NextService, UserService } from "../../services";
 import { setupTippy } from "../../tippy";
@@ -598,6 +603,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
         )}
         {mobile && !this.props.viewOnly && (
           <VoteButtonsCompact
+            voteContentType={VoteContentType.Post}
             id={this.postView.post.id}
             onVote={this.props.onPostVote}
             enableDownvotes={this.props.enableDownvotes}
@@ -1380,6 +1386,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
           <article className="row post-container">
             {!this.props.viewOnly && (
               <VoteButtons
+                voteContentType={VoteContentType.Post}
                 id={this.postView.post.id}
                 onVote={this.props.onPostVote}
                 enableDownvotes={this.props.enableDownvotes}
index 6946fd32730f1a835e9b28a0d39acc8b1d099e68..b37dbd3ef6fb00de463a9e279ea6d38855e8da67 100644 (file)
@@ -77,6 +77,11 @@ export enum VoteType {
   Downvote,
 }
 
+export enum VoteContentType {
+  Post,
+  Comment,
+}
+
 export interface CommentNodeI {
   comment_view: CommentView;
   children: Array<CommentNodeI>;