Skip to main content

​
useCommentVotes

​
Overview

The useCommentVotes hook provides functionality to manage upvotes and downvotes for a specific comment. It supports real-time updates to the comment state while ensuring that changes can be reverted in case of an error. This hook is ideal for implementing voting systems in comment sections.

​
Usage Example

import { useCommentVotes, Comment } from "@replyke/react-js";

function CommentVotes({ comment, setComment }: { comment: Comment; setComment: React.Dispatch<React.SetStateAction<Comment>> }) {
  const { upvoteComment, removeCommentUpvote, downvoteComment, removeCommentDownvote } = useCommentVotes({ comment, setComment });

  return (
    <div>
      <button onClick={upvoteComment}>Upvote</button>
      <button onClick={removeCommentUpvote}>Remove Upvote</button>
      <button onClick={downvoteComment}>Downvote</button>
      <button onClick={removeCommentDownvote}>Remove Downvote</button>
    </div>
  );
}

​
Parameters & Returns

​
Parameters

The hook accepts an object with the following fields:
​
comment
Comment
required
The comment object to manage votes for.
​
setComment
React.Dispatch<React.SetStateAction<Comment>>
required
A state setter function for the comment.

​
Returns

The hook returns an object with the following functions:
​
upvoteComment
function
Adds an upvote to the comment.
​
removeCommentUpvote
function
Removes the current user’s upvote from the comment.
​
downvoteComment
function
Adds a downvote to the comment.
​
removeCommentDownvote
function
Removes the current user’s downvote from the comment.
⌘I