Function CommentCard

components/comments/comment-card.tsx:35–270

({
  comment,
  extensionId,
  currentUserId,
  isAdmin,
  isLiked = false,
  isAuthenticated = false,
  isReply = false,
}: CommentCardProps)

}

export function CommentCard({
  comment,
  extensionId,
  currentUserId,
  isAdmin,
  isLiked = false,
  isAuthenticated = false,
  isReply = false,
}: CommentCardProps) {
  const [showReplyForm, setShowReplyForm] = useState(false)
  const [isDeleting, setIsDeleting] = useState(false)
  const [liked, setLiked] = useState(isLiked)
  const [likeCount, setLikeCount] = useState(comment.likeCount)

  const removeComment = useMutation(api.comments.remove)
  const adminDeleteComment = useMutation(api.admin.deleteComment)
  const toggleLike = useMutation(api.comments.toggleLike)

  const isOwner = currentUserId === comment.author.userId
  const canDelete = isOwner || isAdmin

  const formattedDate = new Date(comment.createdAt).toLocaleDateString("en-US", {
    year: "numeric",
    month: "short",
    day: "numeric",
  })

  const handleDelete = async () => {
    if (!confirm("Are you sure you want to delete this comment?")) return

    setIsDeleting(true)
    try {
      if (isAdmin && !isOwner) {
        await adminDeleteComment({ commentId: comment._id })
      } else {
        await removeComment({ commentId: comment._id })
      }
    } catch (err) {
      console.error("Failed to delete comment:", err)
      alert("Failed to delete comment")
    } finally {
      setIsDeleting(false)
    }
  }

  const handleLike = async () => {
    if (!isAuthenticated) return

    // Optimistic update
    const newLiked = !liked
    setLiked(newLiked)
    setLikeCount((prev) => (newLiked ? prev + 1 : prev - 1))

    try {
      await toggleLike({ commentId: comment._id })
    } catch (err) {
      // Revert on error
      setLiked(!newLiked)