perf: speed up perceived loading of note stats

src/components/NoteStats/RepostButton.tsx

@@ -13,7 +13,7 @@ import { useNostr } from '@/providers/NostrProvider'
 import { useNoteStats } from '@/providers/NoteStatsProvider'
 import { useScreenSize } from '@/providers/ScreenSizeProvider'
 import { Loader, PencilLine, Repeat } from 'lucide-react'
-import { Event } from 'nostr-tools'
+import { Event, kinds } from 'nostr-tools'
 import { useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import PostEditor from '../PostEditor'
@@ -48,8 +48,10 @@ export default function RepostButton({ event }: { event: Event }) {
         const hasReposted = noteStats?.reposts?.has(pubkey)
         if (hasReposted) return
         if (!noteStats?.updatedAt) {
-          const stats = await fetchNoteStats(event)
-          if (stats?.reposts?.has(pubkey)) return
+          const events = await fetchNoteStats(event)
+          if (events.some((e) => e.kind === kinds.Repost && e.pubkey === pubkey)) {
+            return
+          }
         }
 
         const repost = createRepostDraftEvent(event)

src/providers/NoteStatsProvider.tsx

@@ -18,7 +18,7 @@ type TNoteStatsContext = {
   noteStatsMap: Map<string, Partial<TNoteStats>>
   addZap: (eventId: string, pr: string, amount: number, comment?: string) => void
   updateNoteStatsByEvents: (events: Event[]) => void
-  fetchNoteStats: (event: Event) => Promise<Partial<TNoteStats> | undefined>
+  fetchNoteStats: (event: Event) => Promise<Event[]>
 }
 
 const NoteStatsContext = createContext<TNoteStatsContext | undefined>(undefined)
@@ -108,16 +108,18 @@ export function NoteStatsProvider({ children }: { children: React.ReactNode }) {
         filter.since = since
       })
     }
-    const events = await client.fetchEvents(relayList.read.slice(0, 4), filters)
-    updateNoteStatsByEvents(events)
-    let stats: Partial<TNoteStats> | undefined
+    const events: Event[] = []
+    await client.fetchEvents(relayList.read.slice(0, 5), filters, {
+      onevent(evt) {
+        updateNoteStatsByEvents([evt])
+        events.push(evt)
+      }
+    })
     setNoteStatsMap((prev) => {
-      const old = prev.get(event.id) || {}
-      prev.set(event.id, { ...old, updatedAt: dayjs().unix() })
-      stats = prev.get(event.id)
+      prev.set(event.id, { ...(prev.get(event.id) ?? {}), updatedAt: dayjs().unix() })
       return new Map(prev)
     })
-    return stats
+    return events
   }
 
   const updateNoteStatsByEvents = (events: Event[]) => {