Expo - Implementing Notifications Set App Icon Badge Number

Despite numerous attempts to implement the app icon badge number in our Expo app, the app icon badge number could not be set. The documentation on setting notifications app icon badge number is also very limited. We are trying to set app icon badge number to 1 when there is new push notification and then reset the app icon badge number to 0 after the user clicked on the notification.

Can anyone point out what’s wrong here?

The following is the callback function for the Notifications listener.

handleNotification = async (notification) => {
    const { origin, data, notificationId } = notification
    const notif = { id: notificationId, ...data }

    // set notifications badge count
    try {
      const setAppBadgeCount = await Notifications.setBadgeNumberAsync(1)
      console.log(`showing app badge number to 1 ${setAppBadgeCount}`)
    } catch (err) {
      console.log('did not manage to show notif app badge count!', err)
    }
    if (origin === 'selected') {
      this.navigateToNotificationScreen(data)
      try {
        const resetAppBadgeCount = await Notifications.setBadgeNumberAsync(0)
        console.log(`reset app badge count ${resetAppBadgeCount}`)
      } catch (err) {
        console.log('did not manage to reset notif app badge count!', err)
      }
    } else { // origin === 'received', show in-app
      const { dispatch } = this.props
      dispatch(setActiveNotifications([notif]))

      setTimeout(() => {
        dispatch(setInactiveNotifications([notif]))
      }, 10000)
    }
  }

Thanks in advance!