React-native-firebase: Android app relaunch when clicked on notification

[sujitpk-perennial]

[Update: seemed to be integration issue when using multiple Activities, usually react-native-splash-screen - reference to code to fix it below]

Hi, I have integrated RN firebase successfully. I am getting notification when app is in foreground, background. In Android, If my app is in foreground and if I receive a notification, once I click on notification, app relaunches. In iOS it is working properly. Following is my code.

    initialize() {
        const channel = new firebase.notifications.Android.Channel(
            '34567633554454',
            'Channel Name',
            firebase.notifications.Android.Importance.Max
        ).setDescription('AsiaTop test channel');
        firebase.notifications().android.createChannel(channel);

        this.notificationOpenedListener = firebase.notifications().onNotificationOpened((notificationOpen: NotificationOpen) => {
            console.log("[onNotificationOpened] Process your notification as required")
            const action = notificationOpen.action;
            const notification: Notification = notificationOpen.notification;
            this.handle_notification_clicked(notification)
        });

        firebase.notifications().getInitialNotification().then((notificationOpen: NotificationOpen) => {
            if (notificationOpen) {
                console.log("[getInitialNotification] Process your notification as required")
                const action = notificationOpen.action;
                const notification: Notification = notificationOpen.notification;
                this.handle_notification_clicked(notification)
            }
        });

   }

    handle_notification_clicked(notification) {

        if (Platform.OS === 'android') {
            const localNotification = new firebase.notifications.Notification({
                sound: 'default',
                show_in_foreground: true,
            })
                .setNotificationId(notification.notificationId)
                .setTitle(notification.title)
                .setBody(notification.body)
                .android.setChannelId('34567633554454')
                .android.setSmallIcon('ic_launcher')
                .android.setAutoCancel(true)
                .setData({ "title": "AsiaTop" })
                .android.setPriority(firebase.notifications.Android.Priority.High);

            firebase.notifications()
                .displayNotification(localNotification)
                .catch(err => console.error("err", err));
        }
        else if (Platform.OS === 'ios') {
            const localNotification = new firebase.notifications.Notification()
                .setNotificationId(notification.notificationId)
                .setTitle(notification.title)
                .setSubtitle(notification.subtitle)
                .setBody(notification.body)
                .setData({"title" : "AsiaTop"})
                .ios.setBadge(notification.ios.badge);

            firebase.notifications()
                .displayNotification(localNotification)
                .catch(err => console.error(err));
        }
    }

"react-native-firebase": "^5.0.0",
"react-native": "0.56.0"

[stale[bot]]

Hello 👋, this issue has been automatically marked as stale because it has not had activity for quite some time. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. Thank you for your contributions.

[tokinonagare]

me too

[faustoct]

me too

[stale[bot]]

Hello 👋, this issue has been automatically marked as stale because it has not had activity for quite some time. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. Thank you for your contributions.

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this is still present in the latest release, please feel free to create a new issue with up-to-date information.

[jdrorrer]

This should still be open.

[mikehardy]

At this point it's stale, and even though there is a start app where it could be easily demonstrated, no one has made a reproduction. The issues where the sufferers put in effort to demonstrate the problem easily for the maintainers are the ones that get the most :heart: because as far as I can tell, there's literally 2 people doing the whole project. Users have to help or the project doesn't work

[jdrorrer]

@mikehardy no doubt, my comment was insensitive to the maintainers. I should be more empathetic to others maintaining software seeing as I do it for a living, and I definitely understand time/resource constraints as well. I'll try to come up with a reproduction as soon as I can because this is a legit issue. It may be in 2-3 weeks since I have a deadline looming as we speak 😜

[mikehardy]

That's the spirit :-), not in the "yeah serves you right" way at all, but in the "I'll see what I can do" way 💪 . That said, I'm all over notifications at the moment and I noticed an easily-forgotten part of the integration of local notifications. You didn't post your manifest, but do you have "singletop" in there? https://rnfirebase.io/docs/v5.x.x/notifications/android#Update-Android-Manifest

If not, might explain the behavior you saw

[jdrorrer]

@mikehardy I do have "singletop" in my manifest. Here is my full manifest file if that helps:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.uplaunch.uplaunch">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED" />
    <uses-permission android:name="android.permission.VIBRATE" />

    <!-- Set custom default icon. This is used when no icon is set for incoming notification messages.
       See README(https://goo.gl/l4GJaQ) for more. -->
    <meta-data
      android:name="com.google.firebase.messaging.default_notification_icon"
      android:resource="@mipmap/ic_stat_ic_notification" />
    <meta-data
      android:name="com.google.firebase.messaging.default_notification_color"
      android:resource="@color/orange" />

    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:theme="@style/AppTheme">
      <activity
          android:name=".SplashActivity"
          android:theme="@style/SplashTheme"
          android:label="@string/app_name">
          <intent-filter>
              <action android:name="android.intent.action.MAIN" />
              <category android:name="android.intent.category.LAUNCHER" />
          </intent-filter>
      </activity>
      <activity
        android:name=".MainActivity"
        android:label="@string/app_name"
        android:configChanges="keyboard|keyboardHidden|orientation|screenSize"
        android:windowSoftInputMode="adjustResize"
        android:screenOrientation="portrait"
        android:launchMode="singleTop"
        android:exported="true">
        <intent-filter android:label="UpLaunch" android:autoVerify="true">
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
            <data android:scheme="https"
                  android:host="uplaunch.com"
                  android:pathPrefix="/resetting/reset" />
        </intent-filter>
      </activity>
      <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
      <service android:name="io.invertase.firebase.messaging.RNFirebaseMessagingService">
        <intent-filter>
          <action android:name="com.google.firebase.MESSAGING_EVENT" />
        </intent-filter>
      </service>
      <service android:name="io.invertase.firebase.messaging.RNFirebaseBackgroundMessagingService" />
      <service
        android:name=".MainMessagingService"
        android:enabled="true"
        android:exported="true">
          <intent-filter>
            <action android:name="com.google.firebase.MESSAGING_EVENT" />
          </intent-filter>
      </service>
    </application>

</manifest>

[mikehardy]

Hmm - I'm out of great ideas then and only have the mediocre idea of trying to do a very clean, very minimal demo of all notifications/messaging features so we can all fuzzbust through it to not just get this working but then demonstrate exactly how for future developers.

Current status is that it correctly goes from scratch to a booted react-native-firebase app for iOS and Android provided nothing but the firebase plist/json files, but it does not currently exercise messaging/notifications - that's next just in the from of a single App.js that has buttons to do things and text to show them

Feel free to collaborate - https://github.com/mikehardy/rnfbdemo

[mikehardy]

I just noticed this on my app as well, but only on my API17 device if I'm testing correctly.
What API levels are people seeing this in? Anyone still seeing it in API28 etc?

If we can get a reproduction scenario we might be able to fix this

[mikehardy]

If anyone has combined react-native-splash-screen with react-native-firebase, and they implemented the splash screen with a separate launch activity, this will happen. There are workarounds but you should use splash-screen with a single Activity and it just works. Code here: https://github.com/crazycodeboy/react-native-splash-screen/issues/289#issuecomment-502406454

[jdrorrer]

@mikehardy My deadline came and went and I had a vacation just last week so I'm just coming back to take a look at this, and looks like you already figured it out! Thank you!

[mahipalsingh7]

If anyone has combined react-native-splash-screen with react-native-firebase, and they implemented the splash screen with a separate launch activity, this will happen. There are workarounds but you should use splash-screen with a single Activity and it just works. Code here: crazycodeboy/react-native-splash-screen#289 (comment)

i did the same and now working fine thank you :)

[mikehardy]

okay, I've got 2 success reports, 3 including my own main project which was suffering this and prompted my inspection. code is available, can no longer reproduce. We have a solved issue here, folks :fireworks: :sweat_smile:

[mrnickel]

Can confirm that @mikehardy's solution works!