feat: add like button on picture note card

This commit is contained in:
codytseng
2025-01-15 17:10:57 +08:00
parent 92a0f9071f
commit 52daf39584
4 changed files with 10 additions and 6 deletions

View File

@@ -83,7 +83,7 @@ export default function LikeButton({
) : ( ) : (
<Heart size={16} className={hasLiked ? 'fill-red-400' : ''} /> <Heart size={16} className={hasLiked ? 'fill-red-400' : ''} />
)} )}
<div className="text-sm">{formatCount(likeCount)}</div> {!!likeCount && <div className="text-sm">{formatCount(likeCount)}</div>}
</button> </button>
) )
} }

View File

@@ -23,7 +23,7 @@ export default function ReplyButton({ event }: { event: Event }) {
title={t('Reply')} title={t('Reply')}
> >
<MessageCircle size={16} /> <MessageCircle size={16} />
<div className="text-sm">{formatCount(replyCount)}</div> {!!replyCount && <div className="text-sm">{formatCount(replyCount)}</div>}
</button> </button>
<PostEditor parentEvent={event} open={open} setOpen={setOpen} /> <PostEditor parentEvent={event} open={open} setOpen={setOpen} />
</> </>

View File

@@ -89,7 +89,7 @@ export default function RepostButton({
title={t('Repost')} title={t('Repost')}
> >
{reposting ? <Loader className="animate-spin" size={16} /> : <Repeat size={16} />} {reposting ? <Loader className="animate-spin" size={16} /> : <Repeat size={16} />}
<div className="text-sm">{formatCount(repostCount)}</div> {!!repostCount && <div className="text-sm">{formatCount(repostCount)}</div>}
</button> </button>
</DropdownMenuTrigger> </DropdownMenuTrigger>
<DropdownMenuContent <DropdownMenuContent

View File

@@ -15,6 +15,7 @@ import {
import Image from '../Image' import Image from '../Image'
import UserAvatar from '../UserAvatar' import UserAvatar from '../UserAvatar'
import Username from '../Username' import Username from '../Username'
import LikeButton from '../NoteStats/LikeButton'
export default function PictureNoteCard({ export default function PictureNoteCard({
event, event,
@@ -45,10 +46,13 @@ export default function PictureNoteCard({
)} )}
<div className="p-2 space-y-1"> <div className="p-2 space-y-1">
<div className="line-clamp-2 font-semibold">{title}</div> <div className="line-clamp-2 font-semibold">{title}</div>
<div className="flex items-center gap-2"> <div className="flex items-center justify-between gap-2">
<div className="flex items-center gap-2 flex-1 w-0">
<UserAvatar userId={event.pubkey} size="xSmall" /> <UserAvatar userId={event.pubkey} size="xSmall" />
<Username userId={event.pubkey} className="text-sm text-muted-foreground truncate" /> <Username userId={event.pubkey} className="text-sm text-muted-foreground truncate" />
</div> </div>
<LikeButton event={event} />
</div>
</div> </div>
</div> </div>
) )