feat(messaging): Adding support for Firebase Messaging via Expo config plugin.

[MonchiLin]

Description

This PR adds support for Firebase Messaging in Expo projects via a config plugin. This is mainly achieved by setting the appropriate keys (com.google.firebase.messaging.default_notification_icon and com.google.firebase.messaging.default_notification_color) in the AndroidManifest of the Android project during the build stage. The addition of this plugin will automatically enable Firebase Messaging support for developers using @react-native-firebase/messaging in their Expo projects which have the necessary notification configuration.

Displaying notifications correctly on Android requires setting a pure white icon. By default, the system uses the app's own icon as the notification icon, which usually isn't purely white. Therefore, it's necessary to specify a notification icon. If no notification configuration is detected from the Expo configuration, a friendly warning will be printed.

Related issues

Release Summary

Added support for Firebase Messaging in Expo projects via a config plugin.

Checklist

• I read the Contributor Guide and followed the process outlined there for submitting PRs.
  • Yes
• My change supports the following platforms;
  • Android
  • iOS
• My change includes tests;
  • e2e tests added or updated in packages/\*\*/e2e
  • jest tests added or updated in packages/\*\*/__tests__
• I have updated TypeScript types that are affected by my change.
• This is a breaking change;
  • Yes
  • No

Test Plan

I created the repo to test the feature.

https://github.com/MonchiLin/firebase-messaging-test-app

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-native-firebase	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 28, 2023 9:42pm
react-native-firebase-next	❌ Failed (Inspect)			Nov 28, 2023 9:42pm

[CLAassistant]

All committers have signed the CLA.

[MonchiLin]

Oh, Check the previous PR for more context: #7362

[mikehardy]

Thank you for your patience - just to note that this is on my radar for review now that I've mostly cleared the rest of the PR stack...

[MonchiLin]

Thank you for your patience - just to note that this is on my radar for review now that I've mostly cleared the rest of the PR stack...

Thanks for your response. Feel free to reply if you have any questions.

[github-actions]

Hello 👋, this PR has been opened for more than 2 months with no activity on it.

If you think this is a mistake please comment and ping a maintainer to get this merged ASAP! Thanks for contributing!

You have 15 days until this gets closed automatically

[mikehardy]

I like that this is contained in messaging, and I am saddened to say that I checked the standard plugins https://docs.expo.dev/versions/latest/sdk/build-properties/ and it does look like AndroidManifest has no way to edit, so this is I suppose the only way to do it 🤷

[mikehardy]

Rebased to main and fixed up dependencies so they are consistent with the other plugins as they have moved since this was posted

tested it locally and it appears functional + good warning on the Android 8 color as well.

Once CI goes green I can merge this

Thanks for your patience!

[mikehardy]

This one is only exercised with lint and jest, those have passed

[Klyado]

Hi guys!

I've spent tons of hours trying to figure out why my app doesn't display the right icon (got a grey circle) when receiving a notification in background state.

Here is an example of the notification I'm sending to my Android phone :

{
  "message": {
    "data": {
      "body": "test",
      "title": "test"
    },
    "notification": {
      "title": "test",
      "body": "test"
    }
  }
}

I've just discovered this thread and thought the merge request would have solved the issue but it doesn't.

When running npx expo prebuild then the <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/> line isn't added into AndroidManifest.xml.

The "icon" is well set in the expo app.json file

"notification": {
      "icon": "./assets/images/logo/my_logo_monochrome.png"
    },

If adding this line manually, then it works well.
Any ideas to explain why the line isn't added automatically? Am I missing something?

I'm running the latest version (18.7.3)

Thanks!

[MonchiLin]

Hi guys!

I've spent tons of hours trying to figure out why my app doesn't display the right icon (got a grey circle) when receiving a notification in background state.

Here is an example of the notification I'm sending to my Android phone :

{
  "message": {
    "data": {
      "body": "test",
      "title": "test"
    },
    "notification": {
      "title": "test",
      "body": "test"
    }
  }
}

I've just discovered this thread and thought the merge request would have solved the issue but it doesn't.

When running npx expo prebuild then the <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/> line isn't added into AndroidManifest.xml.

The "icon" is well set in the expo app.json file

"notification": {
      "icon": "./assets/images/logo/my_logo_monochrome.png"
    },

If adding this line manually, then it works well. Any ideas to explain why the line isn't added automatically? Am I missing something?

I'm running the latest version (18.7.3)

Thanks!

I apologize for the late response.

The plugin will only take effect if you have correctly configured the notification icon in the expo app.json. Otherwise, it will use the default Android system notification icon. It will not use the app's icon as the notification icon, because the specifications for notification icons and app icons are not the same. Please refer to Android Notification Ico for more details.

For further information, read the source code.

[casanea]

Hi,

Yes sure, I've read those links and event checked the source code before posting the message.
I might be missing something but it is well set. That was the second piece of code I've added in my comment 🙂

That's why I don't understand. Everything works well, the app icon is well set for every notification except background ones coming from FCM.

If I manually add
<meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/>
in my AndroidManifest.xml, it's working perfectly.

But this line isn't added automatically during the build process. Even the color one isn't added.

That's why I asked if you had any idea :-)

[MonchiLin]

Hi,

Yes sure, I've read those links and event checked the source code before posting the message. I might be missing something but it is well set. That was the second piece of code I've added in my comment 🙂

That's why I don't understand. Everything works well, the app icon is well set for every notification except background ones coming from FCM.

If I manually add <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/> in my AndroidManifest.xml, it's working perfectly.

But this line isn't added automatically during the build process. Even the color one isn't added.

That's why I asked if you had any idea :-)

Hey guy, can you provide a mini repo?