fix: processing gift wraps and notifications (#193)

This change will potentially close multiple issues related to the gift-wrapped events processing (#168, #158). Further testing will be required to confirm before closing each.

The commented-out code causes the race condition during the processing of the gift wraps with sigits.

During the processing we perform checks to see if sigit is outdated. In cases where sigit includes multiple signers it's possible for a signer to receive multiple sigit updates at once (especially noticeable for 3rd, 4th signer). Due to async nature of processing we can have same sigit enter processing flow with different states. Since this code also updates user's app state, which includes uploads to the blossom server it takes time to upload local user state which causes both to check against the stale data and un-updated app state. This results in both sigits being "new" and both proceed to update user state and upload app data. We have no guarantees as in which event will update last, meaning that the final state we end up with could be already stale.

The issue is also complicated due to the fact that we mark the gift wraps as processed and it's impossible to update the state without creating a new gift wrap with correct state and processing it last to overwrite stale state.

This is temporary solution to stop broken sigit states until proper async implementation is ready.

Co-authored-by: b
Reviewed-on: #193
Reviewed-by: eugene <eugene@nostrdev.com>
Co-authored-by: enes <mulahasanovic@outlook.com>
Co-committed-by: enes <mulahasanovic@outlook.com>

src/layouts/Main.tsx

@@ -27,6 +27,8 @@ import {
 import { useAppSelector } from '../hooks'
 import styles from './style.module.scss'
 
+const UPDATE_INTERVAL_MS = 120000
+
 export const MainLayout = () => {
   const dispatch: Dispatch = useDispatch()
   const [isLoading, setIsLoading] = useState(true)
@@ -35,7 +37,7 @@ export const MainLayout = () => {
   const usersAppData = useAppSelector((state) => state.userAppData)
 
   // Ref to track if `subscribeForSigits` has been called
-  const hasSubscribed = useRef(false)
+  const hasSubscribed = useRef<number | null>(null)
 
   useEffect(() => {
     const metadataController = new MetadataController()
@@ -109,10 +111,27 @@ export const MainLayout = () => {
 
       if (pubkey && !hasSubscribed.current) {
         // Call `subscribeForSigits` only if it hasn't been called before
+        // #193 disabled websocket subscribtion, keep updating the sigits on UPDATE_INTERVAL_MS until #194 is done
+        // Set up the update sigit loop, use setTimeout to make sure times between updates are consistent
+        // (not affected by execution duration of subscribeForSigits call)
+        const loop = () => {
+          hasSubscribed.current = window.setTimeout(async () => {
+            await subscribeForSigits(pubkey)
+            loop()
+          }, UPDATE_INTERVAL_MS)
+        }
         subscribeForSigits(pubkey)
+        loop()
 
         // Mark `subscribeForSigits` as called
-        hasSubscribed.current = true
+        //hasSubscribed.current = true
+      }
+    }
+
+    return () => {
+      if (hasSubscribed.current) {
+        window.clearTimeout(hasSubscribed.current)
+        hasSubscribed.current = null
       }
     }
   }, [authState, usersAppData])

src/utils/nostr.ts

@@ -859,9 +859,16 @@ export const subscribeForSigits = async (pubkey: string) => {
     '#p': [pubkey]
   }
 
-  relayController.subscribeForEvents(filter, relaySet.read, (event) => {
+  // Process the received event synchronously
-    processReceivedEvent(event) // Process the received event
+  const events = await relayController.fetchEvents(filter, relaySet.read)
-  })
+  for (const e of events) {
+    await processReceivedEvent(e)
+  }
+
+  // Async processing of the events has a race condition
+  // relayController.subscribeForEvents(filter, relaySet.read, (event) => {
+  //   processReceivedEvent(event)
+  // })
 }
 
 const processReceivedEvent = async (event: Event, difficulty: number = 5) => {
@@ -907,7 +914,7 @@ const processReceivedEvent = async (event: Event, difficulty: number = 5) => {
 
   if (!meta) return
 
-  updateUsersAppData(meta)
+  await updateUsersAppData(meta)
 }
 
 /**