Try if can find out why badge is not cleared

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tooot",
-  "version": "4.6.3",
+  "version": "4.6.4",
   "description": "tooot for Mastodon",
   "author": "xmflsct <me@xmflsct.com>",
   "license": "GPL-3.0-or-later",

src/Screens.tsx

@@ -50,9 +50,9 @@ const Screens: React.FC<Props> = ({ localCorrupt }) => {
 
   // Push hooks
   const instances = useSelector(getInstances, (prev, next) => prev.length === next.length)
-  pushUseConnect({ t, instances })
-  pushUseReceive({ instances })
-  pushUseRespond({ instances })
+  pushUseConnect()
+  pushUseReceive()
+  pushUseRespond()
 
   // Prevent screenshot alert
   useEffect(() => {

src/api/tooot.ts

@@ -12,7 +12,6 @@ export type Params = {
   }
   headers?: { [key: string]: string }
   body?: FormData | Object
-  sentry?: boolean
 }
 
 export const TOOOT_API_DOMAIN = mapEnvironment({
@@ -26,8 +25,7 @@ const apiTooot = async <T = unknown>({
   url,
   params,
   headers,
-  body,
-  sentry = true
+  body
 }: Params): Promise<{ body: T }> => {
   console.log(
     ctx.bgGreen.bold(' API tooot ') +
@@ -46,10 +44,7 @@ const apiTooot = async <T = unknown>({
     url: `${url}`,
     params,
     headers: {
-      'Content-Type':
-        body && body instanceof FormData
-          ? 'multipart/form-data'
-          : 'application/json',
+      'Content-Type': body && body instanceof FormData ? 'multipart/form-data' : 'application/json',
       Accept: '*/*',
       ...userAgent,
       ...headers
@@ -62,14 +57,14 @@ const apiTooot = async <T = unknown>({
       })
     })
     .catch(error => {
-      if (sentry) {
       Sentry.setExtras({
         API: 'tooot',
-          ...(error?.response && { response: error.response }),
-          ...(error?.request && { request: error.request })
+        request: { url, params, body },
+        ...(error?.response && { response: error.response })
+      })
+      Sentry.captureMessage('API error', {
+        contexts: { errorObject: error }
       })
-        Sentry.captureException(error)
-      }
 
       return handleError(error)
     })

src/utils/push/useConnect.ts

@@ -4,44 +4,43 @@ import { displayMessage } from '@components/Message'
 import navigationRef from '@helpers/navigationRef'
 import { useAppDispatch } from '@root/store'
 import * as Sentry from '@sentry/react-native'
-import { InstanceLatest } from '@utils/migrations/instances/migration'
 import { getExpoToken, retrieveExpoToken } from '@utils/slices/appSlice'
-import { disableAllPushes } from '@utils/slices/instancesSlice'
+import { disableAllPushes, getInstances } from '@utils/slices/instancesSlice'
 import { useTheme } from '@utils/styles/ThemeManager'
 import * as Notifications from 'expo-notifications'
-import { TFunction } from 'i18next'
 import { useEffect } from 'react'
+import { useTranslation } from 'react-i18next'
 import { AppState } from 'react-native'
 import { useSelector } from 'react-redux'
 
-export interface Params {
-  t: TFunction<'screens'>
-  instances: InstanceLatest[]
-}
-
-const pushUseConnect = ({ t, instances }: Params) => {
-  const dispatch = useAppDispatch()
+const pushUseConnect = () => {
+  const { t } = useTranslation('screen')
   const { theme } = useTheme()
+
+  const dispatch = useAppDispatch()
   useEffect(() => {
     dispatch(retrieveExpoToken())
   }, [])
 
   const expoToken = useSelector(getExpoToken)
+  const instances = useSelector(getInstances, (prev, next) => prev.length === next.length)
+  const pushEnabled = instances.filter(instance => instance.push.global.value)
 
   const connect = () => {
     apiTooot({
       method: 'get',
-      url: `push/connect/${expoToken}`,
-      sentry: true
+      url: `/push/connect/${expoToken}`
     })
       .then(() => Notifications.setBadgeCountAsync(0))
       .catch(error => {
         Sentry.setExtras({
           API: 'tooot',
-          ...(error?.response && { response: error.response }),
-          ...(error?.request && { request: error.request })
+          expoToken,
+          ...(error?.response && { response: error.response })
+        })
+        Sentry.captureMessage('Push connect error', {
+          contexts: { errorObject: error }
         })
-        Sentry.captureException(error)
         Notifications.setBadgeCountAsync(0)
         if (error?.status == 404) {
           displayMessage({
@@ -84,9 +83,16 @@ const pushUseConnect = ({ t, instances }: Params) => {
       })
   }
 
-  const pushEnabled = instances.filter(instance => instance.push.global.value)
-
   useEffect(() => {
+    Sentry.setExtras({
+      expoToken,
+      pushEnabledCount: pushEnabled
+    })
+
+    if (expoToken && pushEnabled.length) {
+      connect()
+    }
+
     const appStateListener = AppState.addEventListener('change', state => {
       if (expoToken && pushEnabled.length && state === 'active') {
         Notifications.getBadgeCountAsync().then(count => {
@@ -101,12 +107,6 @@ const pushUseConnect = ({ t, instances }: Params) => {
       appStateListener.remove()
     }
   }, [expoToken, pushEnabled.length])
-
-  return useEffect(() => {
-    if (expoToken && pushEnabled.length) {
-      connect()
-    }
-  }, [expoToken, pushEnabled.length])
 }
 
 export default pushUseConnect

src/utils/push/useReceive.ts

@@ -1,24 +1,19 @@
 import { displayMessage } from '@components/Message'
 import queryClient from '@helpers/queryClient'
 import initQuery from '@utils/initQuery'
-import { InstanceLatest } from '@utils/migrations/instances/migration'
 import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
+import { getInstances } from '@utils/slices/instancesSlice'
 import * as Notifications from 'expo-notifications'
 import { useEffect } from 'react'
+import { useSelector } from 'react-redux'
 import pushUseNavigate from './useNavigate'
 
-export interface Params {
-  instances: InstanceLatest[]
-}
+const pushUseReceive = () => {
+  const instances = useSelector(getInstances, (prev, next) => prev.length === next.length)
 
-const pushUseReceive = ({ instances }: Params) => {
-  return useEffect(() => {
-    const subscription = Notifications.addNotificationReceivedListener(
-      notification => {
-        const queryKey: QueryKeyTimeline = [
-          'Timeline',
-          { page: 'Notifications' }
-        ]
+  useEffect(() => {
+    const subscription = Notifications.addNotificationReceivedListener(notification => {
+      const queryKey: QueryKeyTimeline = ['Timeline', { page: 'Notifications' }]
       queryClient.invalidateQueries(queryKey)
       const payloadData = notification.request.content.data as {
         notification_id?: string
@@ -28,8 +23,7 @@ const pushUseReceive = ({ instances }: Params) => {
 
       const notificationIndex = instances.findIndex(
         instance =>
-            instance.url === payloadData.instanceUrl &&
-            instance.account.id === payloadData.accountId
+          instance.url === payloadData.instanceUrl && instance.account.id === payloadData.accountId
       )
       displayMessage({
         duration: 'long',
@@ -45,8 +39,7 @@ const pushUseReceive = ({ instances }: Params) => {
           pushUseNavigate(payloadData.notification_id)
         }
       })
-      }
-    )
+    })
     return () => subscription.remove()
   }, [instances])
 }

src/utils/push/useRespond.ts

@@ -1,23 +1,19 @@
 import queryClient from '@helpers/queryClient'
 import initQuery from '@utils/initQuery'
-import { InstanceLatest } from '@utils/migrations/instances/migration'
 import { QueryKeyTimeline } from '@utils/queryHooks/timeline'
+import { getInstances } from '@utils/slices/instancesSlice'
 import * as Notifications from 'expo-notifications'
 import { useEffect } from 'react'
+import { useSelector } from 'react-redux'
 import pushUseNavigate from './useNavigate'
 
-export interface Params {
-  instances: InstanceLatest[]
-}
+const pushUseRespond = () => {
+  const instances = useSelector(getInstances, (prev, next) => prev.length === next.length)
 
-const pushUseRespond = ({ instances }: Params) => {
-  return useEffect(() => {
+  useEffect(() => {
     const subscription = Notifications.addNotificationResponseReceivedListener(
       ({ notification }) => {
-        const queryKey: QueryKeyTimeline = [
-          'Timeline',
-          { page: 'Notifications' }
-        ]
+        const queryKey: QueryKeyTimeline = ['Timeline', { page: 'Notifications' }]
         queryClient.invalidateQueries(queryKey)
         const payloadData = notification.request.content.data as {
           notification_id?: string