35 lines
849 B
TypeScript
35 lines
849 B
TypeScript
"use client"
|
|
|
|
import { Heart } from "lucide-react"
|
|
import { togglePostLike } from "@/lib/api/posts"
|
|
import { useRequireAuth } from "@/lib/use-require-auth"
|
|
import { usePostStore } from "@/store/posts"
|
|
|
|
interface PostLikeButtonProps {
|
|
postId: string
|
|
}
|
|
|
|
export function PostLikeButton({ postId }: PostLikeButtonProps) {
|
|
const { requireAuth } = useRequireAuth()
|
|
const post = usePostStore((state) => state.posts.find((item) => item.id === postId))
|
|
|
|
if (!post) {
|
|
return null
|
|
}
|
|
|
|
return (
|
|
<button
|
|
type="button"
|
|
className="flex items-center gap-1 hover:text-foreground transition-colors"
|
|
onClick={() =>
|
|
requireAuth(() => {
|
|
togglePostLike(postId)
|
|
})
|
|
}
|
|
>
|
|
<Heart className={`h-4 w-4 ${post.liked ? "fill-red-500 text-red-500" : ""}`} />
|
|
{post.likeCount}
|
|
</button>
|
|
)
|
|
}
|