feat: show relay close reasons in certain feeds

src/components/NormalFeed/index.tsx

@@ -1,5 +1,6 @@
 import NoteList, { TNoteListRef } from '@/components/NoteList'
 import Tabs from '@/components/Tabs'
+import { isTouchDevice } from '@/lib/utils'
 import { useKindFilter } from '@/providers/KindFilterProvider'
 import { useUserTrust } from '@/providers/UserTrustProvider'
 import storage from '@/services/local-storage.service'
@@ -7,16 +8,17 @@ import { TFeedSubRequest, TNoteListMode } from '@/types'
 import { useMemo, useRef, useState } from 'react'
 import KindFilter from '../KindFilter'
 import { RefreshButton } from '../RefreshButton'
-import { isTouchDevice } from '@/lib/utils'
 
 export default function NormalFeed({
   subRequests,
   areAlgoRelays = false,
-  isMainFeed = false
+  isMainFeed = false,
+  showRelayCloseReason = false
 }: {
   subRequests: TFeedSubRequest[]
   areAlgoRelays?: boolean
   isMainFeed?: boolean
+  showRelayCloseReason?: boolean
 }) {
   const { hideUntrustedNotes } = useUserTrust()
   const { showKinds } = useKindFilter()
@@ -63,6 +65,7 @@ export default function NormalFeed({
         hideReplies={listMode === 'posts'}
         hideUntrustedNotes={hideUntrustedNotes}
         areAlgoRelays={areAlgoRelays}
+        showRelayCloseReason={showRelayCloseReason}
       />
     </>
   )

src/components/NoteList/index.tsx

@@ -27,6 +27,7 @@ import {
 } from 'react'
 import { useTranslation } from 'react-i18next'
 import PullToRefresh from 'react-simple-pull-to-refresh'
+import { toast } from 'sonner'
 import NoteCard, { NoteCardLoadingSkeleton } from '../NoteCard'
 
 const LIMIT = 200
@@ -41,7 +42,8 @@ const NoteList = forwardRef(
       filterMutedNotes = true,
       hideReplies = false,
       hideUntrustedNotes = false,
-      areAlgoRelays = false
+      areAlgoRelays = false,
+      showRelayCloseReason = false
     }: {
       subRequests: TFeedSubRequest[]
       showKinds: number[]
@@ -49,6 +51,7 @@ const NoteList = forwardRef(
       hideReplies?: boolean
       hideUntrustedNotes?: boolean
       areAlgoRelays?: boolean
+      showRelayCloseReason?: boolean
     },
     ref
   ) => {
@@ -184,6 +187,11 @@ const NoteList = forwardRef(
                   [event, ...oldEvents].sort((a, b) => b.created_at - a.created_at)
                 )
               }
+            },
+            onClose: (url, reason) => {
+              if (!showRelayCloseReason) return
+              if (reason === 'closed by caller') return
+              toast.error(`${url}: ${reason}`)
             }
           },
           {

src/components/Relay/index.tsx

@@ -55,6 +55,7 @@ export default function Relay({ url, className }: { url?: string; className?: st
         subRequests={[
           { urls: [normalizedUrl], filter: debouncedInput ? { search: debouncedInput } : {} }
         ]}
+        showRelayCloseReason
       />
     </div>
   )

src/components/SearchResult/index.tsx

@@ -20,6 +20,7 @@ export default function SearchResult({ searchParams }: { searchParams: TSearchPa
     return (
       <NormalFeed
         subRequests={[{ urls: SEARCHABLE_RELAY_URLS, filter: { search: searchParams.search } }]}
+        showRelayCloseReason
       />
     )
   }
@@ -27,6 +28,7 @@ export default function SearchResult({ searchParams }: { searchParams: TSearchPa
     return (
       <NormalFeed
         subRequests={[{ urls: BIG_RELAY_URLS, filter: { '#t': [searchParams.search] } }]}
+        showRelayCloseReason
       />
     )
   }

src/pages/primary/NoteListPage/RelaysFeed.tsx

@@ -31,6 +31,7 @@ export default function RelaysFeed() {
       subRequests={[{ urls: relayUrls, filter: {} }]}
       areAlgoRelays={areAlgoRelays}
       isMainFeed
+      showRelayCloseReason
     />
   )
 }

src/providers/NotificationProvider.tsx

@@ -140,7 +140,7 @@ export function NotificationProvider({ children }: { children: React.ReactNode }
                 })
               }
             },
-            onclose: (reasons) => {
+            onAllClose: (reasons) => {
               if (reasons.every((reason) => reason === 'closed by caller')) {
                 return
               }

src/services/client.service.ts

@@ -238,10 +238,12 @@ class ClientService extends EventTarget {
     subRequests: { urls: string[]; filter: TSubRequestFilter }[],
     {
       onEvents,
-      onNew
+      onNew,
+      onClose
     }: {
       onEvents: (events: NEvent[], eosed: boolean) => void
       onNew: (evt: NEvent) => void
+      onClose?: (url: string, reason: string) => void
     },
     {
       startLogin,
@@ -285,7 +287,8 @@ class ClientService extends EventTarget {
               if (newEventIdSet.has(evt.id)) return
               newEventIdSet.add(evt.id)
               onNew(evt)
-            }
+            },
+            onClose
           },
           { startLogin, needSort }
         )
@@ -337,12 +340,14 @@ class ClientService extends EventTarget {
       onevent,
       oneose,
       onclose,
-      startLogin
+      startLogin,
+      onAllClose
     }: {
       onevent?: (evt: NEvent) => void
       oneose?: (eosed: boolean) => void
-      onclose?: (reasons: string[]) => void
+      onclose?: (url: string, reason: string) => void
       startLogin?: () => void
+      onAllClose?: (reasons: string[]) => void
     }
   ) {
     const relays = Array.from(new Set(urls))
@@ -437,8 +442,9 @@ class ClientService extends EventTarget {
             // close the subscription
             closedCount++
             closeReasons.push(reason)
+            onclose?.(url, reason)
             if (closedCount >= startedCount) {
-              onclose?.(closeReasons)
+              onAllClose?.(closeReasons)
             }
             return
           },
@@ -467,10 +473,12 @@ class ClientService extends EventTarget {
     filter: TSubRequestFilter, // filter with limit,
     {
       onEvents,
-      onNew
+      onNew,
+      onClose
     }: {
       onEvents: (events: NEvent[], eosed: boolean) => void
       onNew: (evt: NEvent) => void
+      onClose?: (url: string, reason: string) => void
     },
     {
       startLogin,
@@ -575,7 +583,8 @@ class ClientService extends EventTarget {
           timeline.refs = newRefs.concat(timeline.refs)
           onEvents([...events.concat(cachedEvents).slice(0, filter.limit)], true)
         }
-      }
+      },
+      onclose: onClose
     })
 
     return {