Optimise inbox to fix message reception issues and disconnection

ios/Podfile.lock

@@ -1089,7 +1089,7 @@ PODS:
   - react-native-mmkv (2.11.0):
     - MMKV (>= 1.2.13)
     - React-Core
-  - react-native-netinfo (8.2.0):
+  - react-native-netinfo (11.3.2):
     - React-Core
   - react-native-pager-view (6.0.2):
     - React-Core
@@ -1800,7 +1800,7 @@ SPEC CHECKSUMS:
   react-native-flipper: 9c1957af24b76493ba74f46d000a5c1d485e7731
   react-native-get-random-values: 384787fd76976f5aec9465aff6fa9e9129af1e74
   react-native-mmkv: e97c0c79403fb94577e5d902ab1ebd42b0715b43
-  react-native-netinfo: e922cb2e3eaf9ccdf16b8d4744a89657377aa4a1
+  react-native-netinfo: 076df4f9b07f6670acf4ce9a75aac8d34c2e2ccc
   react-native-pager-view: 592421df0259bf7a7a4fe85b74c24f3f39905605
   react-native-quick-base64: 777057ea4286f806b00259ede65dc79c7c706320
   react-native-quick-crypto: 455c1b411db006dba1026a30681ececb19180187

package.json

@@ -47,7 +47,7 @@
     "@react-native-async-storage/async-storage": "^1.21.0",
     "@react-native-community/blur": "^4.3.0",
     "@react-native-clipboard/clipboard": "^1.14.0",
-    "@react-native-community/netinfo": "8.2.0",
+    "@react-native-community/netinfo": "^11.3.2",
     "@react-native-community/push-notification-ios": "^1.10.1",
     "@react-native-firebase/analytics": "14.12.0",
     "@react-native-firebase/app": "14.12.0",

patches/@verida+client-rn+3.0.2.patch

@@ -20,11 +20,23 @@ index cfa87b2..71bee4a 100644
      /**
       * Get a single database record that matches.
       *
+diff --git a/node_modules/@verida/client-rn/dist/src/context/engines/verida/messaging/inbox.js b/node_modules/@verida/client-rn/dist/src/context/engines/verida/messaging/inbox.js
+index 312b088..776de4f 100644
+--- a/node_modules/@verida/client-rn/dist/src/context/engines/verida/messaging/inbox.js
++++ b/node_modules/@verida/client-rn/dist/src/context/engines/verida/messaging/inbox.js
+@@ -246,6 +246,7 @@ var VeridaInbox = /** @class */ (function (_super) {
+                             // This often happens when changing networks, so don't log
+                             setTimeout(function () {
+                                 console.log("Retrying to establish public inbox connection");
++                                inbox.emit('INBOX_FAILED_TO_CONNECT', {})
+                                 inbox.watch();
+                             }, 1000);
+                         }); // Setup watching for any changes to the local private inbox (ie: marking an item as read)
 diff --git a/node_modules/@verida/client-rn/src/client.ts b/node_modules/@verida/client-rn/src/client.ts
-index 1cc2f71..2b027c9 100644
+index 6d5d257..86d3f34 100644
 --- a/node_modules/@verida/client-rn/src/client.ts
 +++ b/node_modules/@verida/client-rn/src/client.ts
-@@ -50,7 +50,7 @@ class Client implements IClient {
+@@ -53,7 +53,7 @@ class Client implements IClient {
     *
     * @param userConfig ClientConfig Configuration for establishing a connection to the Verida network
     */

src/api/VaultCommon/managers/inbox.ts

@@ -135,8 +135,8 @@ export class InboxManager {
     return this.messaging!
   }
 
-  private async init() {
-    if (this.messaging) {
+  public async init(force = false) {
+    if (!force && this.messaging) {
       return
     }
 
@@ -166,6 +166,10 @@ export class InboxManager {
     }
   }
 
+  public async healthCheck() {
+    return await this.info()
+  }
+
   public async rebuild() {
     await this.init()
     this.messaging.inbox = null

src/api/VaultCommon/vault.ts

@@ -17,6 +17,7 @@ export default class VaultCommon {
   constructor(client: any, vault: any) {
     this.client = client
     this.vault = vault
+
     this.inbox = new InboxManager(this)
     this.sync = new SyncManager(this)
     this.data = new DataManager(this)

src/components/BehindAuthHandlers.tsx

@@ -3,11 +3,9 @@ import { FC } from 'react'
 import { useDeepLinksHandler } from '~/features/deepLinks'
 import { useRemoteNotifications } from '~/features/notifications'
 import { useWatchPublicProfileChanges } from '~/features/profiles'
-import { useEventHandlers } from '~/hooks'
 
 // Main place to register and handle app events after the user has authenticated
 export const BehindAuthHandlers: FC = () => {
-  useEventHandlers()
   useWatchPublicProfileChanges()
   useDeepLinksHandler()
   useRemoteNotifications()

src/contexts/BehindAuthContextProviders.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 
 import { CryptoWalletProvider } from '~/features/cryptoWallet'
+import { InboxProvider } from '~/features/inbox'
 import { PolygonIdProvider } from '~/features/polygonid'
 import { ProtocolsProvider } from '~/features/protocols'
 import { VeramoProvider } from '~/features/veramo'
@@ -19,12 +20,14 @@ export const BehindAuthContextProviders: React.FunctionComponent<
 
   // TODO: Move other relavant context providers here
   return (
-    <CryptoWalletProvider>
-      <PolygonIdProvider>
-        <VeramoProvider>
-          <ProtocolsProvider>{children}</ProtocolsProvider>
-        </VeramoProvider>
-      </PolygonIdProvider>
-    </CryptoWalletProvider>
+    <InboxProvider>
+      <CryptoWalletProvider>
+        <PolygonIdProvider>
+          <VeramoProvider>
+            <ProtocolsProvider>{children}</ProtocolsProvider>
+          </VeramoProvider>
+        </PolygonIdProvider>
+      </CryptoWalletProvider>
+    </InboxProvider>
   )
 }

src/features/inbox/contexts/InboxContext.tsx

@@ -0,0 +1,266 @@
+import {
+  addEventListener as addNetworkEventListener,
+  fetch as fetchNetInfo,
+  refresh as refreshNetworkInfo,
+} from '@react-native-community/netinfo'
+import { isEmpty } from 'lodash'
+import React, {
+  createContext,
+  useCallback,
+  useEffect,
+  useRef,
+  useState,
+} from 'react'
+import { AppState, AppStateStatus } from 'react-native'
+import RNRestart from 'react-native-restart'
+import { useSelector } from 'react-redux'
+import { useThrottledCallback } from 'use-debounce'
+
+import AccountManager from '~/api/AccountManager'
+import DataConnectorsManager from '~/api/DataConnectorsManager'
+import { fetchInboxCount } from '~/api/utils'
+import { selectSelectedAccount } from '~/features/identities'
+import { pushNewMessageNotification } from '~/features/notifications'
+import { Logger } from '~/features/telemetry'
+
+const logger = Logger.create('InboxProvider')
+
+interface InboxContextType {
+  connected: boolean
+}
+
+const InboxContext = createContext<InboxContextType | undefined>(undefined)
+
+export const InboxProvider: React.FC = ({ children }) => {
+  const [inboxConnected, setInboxConnected] = useState(true)
+  const [loading, setLoading] = useState(false)
+  const [retryCount, setRetryCount] = useState(0)
+  const [timeInBackground, setTimeInBackground] = useState(0)
+
+  const isNetworkConnected = useRef<boolean | null>(null)
+  const appState = useRef(AppState.currentState)
+  const isConnectingRef = useRef(false)
+  const latestNotificationRef = useRef<any>(null)
+
+  const selectedAccount = useSelector(selectSelectedAccount)
+
+  const onMessage = useThrottledCallback(
+    React.useCallback(async function onMessage(newMessage: any) {
+      // TODO: Validate the message with zod, so it is properly typed
+      await fetchInboxCount()
+      if (
+        !newMessage ||
+        // Duplicated message, just ignore
+        latestNotificationRef.current?._id === newMessage?._id
+      ) {
+        return
+      }
+
+      latestNotificationRef.current = newMessage
+      pushNewMessageNotification(newMessage)
+    }, []),
+    500
+  )
+
+  const initInboxMessaging = useCallback(async () => {
+    try {
+      if (isConnectingRef.current) {
+        return
+      }
+      isConnectingRef.current = true
+
+      const messaging =
+        await AccountManager.getInstance().vault?.inbox.getMessaging()
+      await messaging?.offMessage(onMessage)
+      await messaging?.onMessage(onMessage)
+
+      await fetchInboxCount()
+      isConnectingRef.current = false
+    } catch (error) {
+      logger.error(error)
+    }
+  }, [onMessage])
+
+  const disconnect = useCallback(async () => {
+    const messaging =
+      await AccountManager.getInstance().vault?.inbox.getMessaging()
+    await messaging?.offMessage(onMessage)
+    isConnectingRef.current = false
+  }, [onMessage])
+
+  const maxRetryThreshold = 10
+
+  const healthCheck = useThrottledCallback(
+    useCallback(async () => {
+      if (loading) {
+        return
+      }
+
+      if (isNetworkConnected.current === false) {
+        return
+      }
+
+      try {
+        setLoading(true)
+        // At the 3rd retry time, try to init Inbox DBs again
+        if (retryCount === 3) {
+          logger.info('Try to init the inbox again')
+          await AccountManager.getInstance().vault?.inbox.rebuild()
+        }
+
+        const info =
+          await AccountManager.getInstance().vault?.inbox.healthCheck()
+
+        if (!isEmpty(info?.privateDb) && !isEmpty(info?.publicDb)) {
+          setInboxConnected(true)
+          setRetryCount(0)
+        } else {
+          setInboxConnected(false)
+          setRetryCount((cur) => cur + 1)
+        }
+      } catch (error) {
+        if (retryCount > maxRetryThreshold) {
+          logger.info(
+            'Could not connect to the Inbox, the app needs to restart'
+          )
+
+          RNRestart.restart()
+          // TODO: Try alternatives to restarting the app
+          // await AccountManager.getInstance().vault?.inbox.rebuild()
+          //  - Apparently doesn't always work
+          // await AccountManager.getInstance().vault?.inbox.init(true)
+          //  - To try
+          // await AccountManager.getInstance().connect(true, '')
+          //  - To try
+          // await init()
+
+          return
+        }
+
+        setInboxConnected(false)
+        setRetryCount((cur) => cur + 1)
+      } finally {
+        setLoading(false)
+      }
+    }, [loading, retryCount]),
+    1000
+  )
+
+  const onAppStateChanged = useCallback(
+    async (nextAppState: AppStateStatus) => {
+      const messaging =
+        await AccountManager.getInstance().vault?.inbox.getMessaging()
+      const inbox = await messaging.getInbox()
+      if (
+        appState.current.match(/inactive|background/) &&
+        nextAppState === 'active'
+      ) {
+        logger.debug(`timeInBackground: ${Date.now() - timeInBackground}`)
+
+        // Soft restart the inbox in case the Wallet was put in the background for too long  for sure(over 60 seconds)
+        // Rebuild the inbox usually does not work in this case on testing
+        if (Date.now() - timeInBackground > 60 * 60 * 60) {
+          logger.info(
+            'The app is in the background for too long, do a soft restart'
+          )
+
+          RNRestart.restart()
+          // TODO: Try alternatives to restarting the app
+          // await AccountManager.getInstance().vault?.inbox.rebuild()
+          //  - Apparently doesn't always work
+          // await AccountManager.getInstance().vault?.inbox.init(true)
+          //  - To try
+          // await AccountManager.getInstance().connect(true, '')
+          //  - To try
+          return
+        } // Rebuild the inbox in case the Wallet was put in the background for too long(over 30 seconds and iOS destroys the active connections)
+        else if (Date.now() - timeInBackground > 30 * 60 * 60) {
+          logger.info('Try to init the inbox again')
+          await AccountManager.getInstance().vault?.inbox.rebuild()
+        }
+
+        setTimeInBackground(0)
+        healthCheck()
+        initInboxMessaging()
+        // Listen for the inbox event that failed to connect from the SDK, and active the health check
+        inbox.on('INBOX_FAILED_TO_CONNECT', healthCheck)
+      } else if (
+        appState.current === 'active' &&
+        nextAppState.match(/inactive|background/)
+      ) {
+        disconnect()
+        inbox.removeListener('INBOX_FAILED_TO_CONNECT', healthCheck)
+        setTimeInBackground(Date.now())
+      }
+
+      initInboxMessaging()
+      DataConnectorsManager.triggerSync() // TODO: Move it back into the useEventHandlers.ts
+      appState.current = nextAppState
+    },
+    [disconnect, healthCheck, initInboxMessaging, timeInBackground]
+  )
+
+  const init = useCallback(async () => {
+    logger.debug('Initialising the inbox for account', {
+      account: selectedAccount,
+    })
+    DataConnectorsManager.triggerSync() // TODO: Move it back into the useEventHandlers.ts
+    initInboxMessaging()
+
+    const unsubscribeNetInfo = addNetworkEventListener(async (state) => {
+      // Reconnect from disconnected state
+      if (state.isConnected) {
+        await initInboxMessaging()
+      }
+      isNetworkConnected.current = state.isConnected
+    })
+
+    const appStateSubscriber = AppState.addEventListener(
+      'change',
+      onAppStateChanged
+    )
+
+    return async () => {
+      appStateSubscriber?.remove()
+      unsubscribeNetInfo?.()
+      disconnect()
+    }
+  }, [disconnect, initInboxMessaging, selectedAccount, onAppStateChanged])
+
+  useEffect(() => {
+    let unsubscribe: () => void
+    init().then((_unsubscribe) => {
+      unsubscribe = _unsubscribe
+    })
+
+    return () => {
+      unsubscribe?.()
+    }
+  }, [init])
+
+  useEffect(() => {
+    // For now keep checking the internet connection and inbox heath at the interval
+    // TODO: find a better way
+    const tid = setInterval(
+      async () => {
+        // TODO: Don't check the inbox health when there is no ntework connection
+        logger.debug('Checking the internet connection and inbox health')
+        await refreshNetworkInfo()
+        const state = await fetchNetInfo()
+        isNetworkConnected.current = state.isConnected
+        healthCheck()
+      },
+      inboxConnected ? 12 * 1000 : 2 * 1000 // Faster the interval check when not connected
+    )
+
+    return () => {
+      clearInterval(tid)
+    }
+  }, [inboxConnected, healthCheck])
+
+  return (
+    <InboxContext.Provider value={{ connected: inboxConnected }}>
+      {children}
+    </InboxContext.Provider>
+  )
+}

src/features/inbox/contexts/index.ts

@@ -0,0 +1 @@
+export * from './InboxContext'

src/features/inbox/index.ts

@@ -1 +1,2 @@
 export * from './slice'
+export * from './contexts'