React Native Firebase Messaging 7.5.0

We have been successfully using Sendbird to power the messaging in our React Native App for ~18 months. We are using the sendbird js sdk lib (3.0.129) to successfully manage fcm/APNs tokens. These show up and get removed from the requisite Sendbird User in the dashboard.

Recently we have upgraded React Native Firebase to 7.x but particularly relevant to the Sendbird integration -> “@react-native-firebase/messaging”: “^7.5.0”,

We followed all of their migration guides and have Sendbird Push Notifications working on iOS but not Android.

Messages from the FCM console arrive on the device (as do push notifications from another 3rd party that we use - Intercom) so I know that it is not a firebase cloud messaging config issue, the server key is 100% correct.

Also I do receive the message in the setBackgroundMessageHandler, so I believe this is a formatting issue in the message (it has no ‘notification’ prop).

Anybody else seeing this, or have any clues?

As I’m aware Sendbird uses Data type FCM messages. This means there is no “notification” field which is found on FCM Display messages. This is my go to StackOverflow question to help with testing FCM Data messages.

Thanks for this, it is a useful resource for how to test data only messages.

I have since realised that ReactNativeFirebase 6+ no longer contains the Notification module required to turn this data message into a notification.

I have had to add another notification lib into the mix to re-establish the functionality. It might be worthwhile for you guys to update your docs to mention this.

@Anthony_Emery

I was wondering if you might kindly share the solution/library that you used to solve this problem. I will see about updating Sendbird’s doc to reflect this case.

So here goes,

iOS - I figured out that you guys send the Notification (correctly) via APNs and Apple take care of the rest. There is zero additional work on this side.

Android - As per here, RNFB6+ abstracts the Android Headless Task via the new setBackgroundMessageHandler.

So you have to listen to the Data FCM message in this handler and then trigger a local notification on the device. The issue is that RNFB6+ have also deprecated the Notification module in favour of their own licensed solution called Notifee. I went with Wix’s react-native-notification in the end as an open source solution.

Simply just listening out on that new handler and forward to a local Notification works.

fbMessaging.setBackgroundMessageHandler(async remoteMessage => {
  if (remoteMessage.data?.sendbird) {
    const sbData = JSON.parse(remoteMessage.data?.sendbird)

    return Notifications.postLocalNotification({
      title: sbData.sender.name,
      body: sbData.message,
      data: sbData
    })
  }

  return Promise.resolve()
})

This is actually very similar to what we were doing before but neither RNFB or your Docs make it very clear. There is also additional native configuration needed around Android 8+ channel configuation and icons as there are is no ‘Channel’ API in Wix’s library.

Hope this helps someone else - I lost a good day to figuring all this out!!

1 Like