How to automatically decrement application badge number according to Inbox on React Native

Question:

I want to automatically decrement the application badge number after a push has been read in the Inbox. How do I do that in React Native?

Answer:

You no longer need to patch native code. The Pushwoosh React Native plugin exposes both the Inbox unread counter and the badge setter in JavaScript, so you can sync them directly:

import Pushwoosh from 'pushwoosh-react-native-plugin';

function syncBadgeWithInbox() {
  Pushwoosh.unreadMessagesCount((count) => {
    Pushwoosh.setApplicationIconBadgeNumber(count);
  });
}

Call syncBadgeWithInbox() at the points where the unread count can change:

• on app start / after the SDK is initialized;
• when the app returns to the foreground (AppState change to active);
• after you close the Inbox UI opened with Pushwoosh.presentInboxUI();
• after you mark messages as read in your own Inbox screen built on Pushwoosh.loadMessages().

Related methods available in the plugin: Pushwoosh.messagesCount() (total messages), Pushwoosh.getApplicationIconBadgeNumber() and Pushwoosh.addToApplicationIconBadgeNumber().

Please make sure you are on a recent version of pushwoosh-react-native-plugin. The native PWInbox / PushwooshInbox APIs are still available if you prefer to do this in your own native code.