feat: zap details (#731)
Co-authored-by: The Daniel <dmnyc@users.noreply.github.com>
Co-authored-by: The Daniel ⚡️ <dmnycnet@proton.me>
This commit is contained in:
parent
603bd35b4a
commit
7e8f1692ac
21 changed files with 138 additions and 47 deletions
|
|
@ -1,12 +1,14 @@
|
|||
import { ScrollArea, ScrollBar } from '@/components/ui/scroll-area'
|
||||
import { useStuffStatsById } from '@/hooks/useStuffStatsById'
|
||||
import { useStuff } from '@/hooks/useStuff'
|
||||
import { useStuffStatsById } from '@/hooks/useStuffStatsById'
|
||||
import { createFakeEvent } from '@/lib/event'
|
||||
import { formatAmount } from '@/lib/lightning'
|
||||
import { Zap } from 'lucide-react'
|
||||
import { Event } from 'nostr-tools'
|
||||
import { useMemo, useState } from 'react'
|
||||
import ContentPreview from '../ContentPreview'
|
||||
import { SimpleUserAvatar } from '../UserAvatar'
|
||||
import ZapDialog from '../ZapDialog'
|
||||
import ZapDetailDialog from '../ZapDetailDialog'
|
||||
|
||||
export default function TopZaps({ stuff }: { stuff: Event | string }) {
|
||||
const { event, stuffKey } = useStuff(stuff)
|
||||
|
|
@ -22,34 +24,35 @@ export default function TopZaps({ stuff }: { stuff: Event | string }) {
|
|||
<ScrollArea className="pb-2 mb-1">
|
||||
<div className="flex gap-1">
|
||||
{topZaps.map((zap, index) => (
|
||||
<div
|
||||
key={zap.pr}
|
||||
className="flex gap-1 py-1 pl-1 pr-2 text-sm max-w-72 rounded-full bg-muted/80 items-center text-yellow-400 border border-yellow-400 hover:bg-yellow-400/20 cursor-pointer"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
setZapIndex(index)
|
||||
}}
|
||||
>
|
||||
<SimpleUserAvatar userId={zap.pubkey} size="xSmall" />
|
||||
<Zap className="size-3 fill-yellow-400 shrink-0" />
|
||||
<div className="font-semibold">{formatAmount(zap.amount)}</div>
|
||||
<div className="truncate">{zap.comment}</div>
|
||||
<div onClick={(e) => e.stopPropagation()}>
|
||||
<ZapDialog
|
||||
open={zapIndex === index}
|
||||
setOpen={(open) => {
|
||||
if (open) {
|
||||
setZapIndex(index)
|
||||
} else {
|
||||
setZapIndex(-1)
|
||||
}
|
||||
}}
|
||||
pubkey={event.pubkey}
|
||||
event={event}
|
||||
defaultAmount={zap.amount}
|
||||
defaultComment={zap.comment}
|
||||
<div key={zap.pr}>
|
||||
<div
|
||||
className="flex gap-1 py-1 pl-1 pr-2 text-sm max-w-72 rounded-full bg-muted/80 items-center text-yellow-400 border border-yellow-400 hover:bg-yellow-400/20 cursor-pointer"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
setZapIndex(index)
|
||||
}}
|
||||
>
|
||||
<SimpleUserAvatar userId={zap.pubkey} size="xSmall" />
|
||||
<Zap className="size-3 fill-yellow-400 shrink-0" />
|
||||
<div className="font-semibold">{formatAmount(zap.amount)}</div>
|
||||
<ContentPreview
|
||||
className="truncate"
|
||||
event={createFakeEvent({
|
||||
content: zap.comment
|
||||
})}
|
||||
/>
|
||||
</div>
|
||||
<ZapDetailDialog
|
||||
open={zapIndex === index}
|
||||
setOpen={(open) => {
|
||||
if (open) {
|
||||
setZapIndex(index)
|
||||
} else {
|
||||
setZapIndex(-1)
|
||||
}
|
||||
}}
|
||||
zap={zap}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue