ZapNotification.tsx raw

   1  import { useFetchEvent } from '@/hooks'
   2  import { getZapInfoFromEvent } from '@/lib/event-metadata'
   3  import { formatAmount } from '@/lib/lightning'
   4  import { Zap } from 'lucide-react'
   5  import { Event } from 'nostr-tools'
   6  import { useMemo } from 'react'
   7  import { useTranslation } from 'react-i18next'
   8  import Notification from './Notification'
   9  
  10  export function ZapNotification({
  11    notification,
  12    isNew = false,
  13    navIndex
  14  }: {
  15    notification: Event
  16    isNew?: boolean
  17    navIndex?: number
  18  }) {
  19    const { t } = useTranslation()
  20    const { senderPubkey, eventId, amount, comment } = useMemo(
  21      () => getZapInfoFromEvent(notification) ?? ({} as any),
  22      [notification]
  23    )
  24    const { event } = useFetchEvent(eventId)
  25  
  26    if (!senderPubkey || !amount) return null
  27  
  28    return (
  29      <Notification
  30        notificationId={notification.id}
  31        icon={<Zap size={24} className="text-yellow-400 shrink-0" />}
  32        sender={senderPubkey}
  33        sentAt={notification.created_at}
  34        targetEvent={event}
  35        middle={
  36          <div className="font-semibold text-yellow-400 truncate">
  37            {formatAmount(amount)} {t('sats')} {comment}
  38          </div>
  39        }
  40        description={event ? t('zapped your note') : t('zapped you')}
  41        isNew={isNew}
  42        navIndex={navIndex}
  43      />
  44    )
  45  }
  46