Foreground remote notification not showing in android notification tray

I want to display a notification in the notification tray when a remote notification is received when app is in foreground.

Using FCM on React Native (version “0.61.5”) and a android usb-debugging device connected to Android Studios. I receive remote notification sent from Firebase Console when app is in background but when app is in foreground notification doesn’t show. It is received and console logged through onNotification in my index.js file.

When I try the example a foregrounded recieved remote notification only trigger an Alert - which I don’t want since then the user experience is different depending on if the app is backgrounded or foregrounded.

I’ve been reading through your documentation and code-example and can’t get it to work, what am I missing? 😮 I’ve looked at some older (2019) guides but they’re all referring to deprecated changes to AndroidManifest using GCM (for more info https://developers.google.com/cloud-messaging/android/android-migrate-fcm ).

I’ve also got @react-native-firebase/app and @react-native-firebase/messaging installed but since they don’t handle foregrounded notifications as far as I’ve understood I started using this library. 😄

Important parts from my AndroidManifest.xml

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

  <application
    android:name=".MainApplication"
    android:allowBackup="false"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name"
    android:roundIcon="@mipmap/ic_launcher_round"
    android:theme="@style/AppTheme">


        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationActions" />
        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationPublisher" />
        <receiver android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationBootEventReceiver">
            <intent-filter>
                <action android:name="android.intent.action.BOOT_COMPLETED" />
                <action android:name="android.intent.action.QUICKBOOT_POWERON" />
                <action android:name="com.htc.intent.action.QUICKBOOT_POWERON"/>
            </intent-filter>
        </receiver>

        <service
            android:name="com.dieam.reactnativepushnotification.modules.RNPushNotificationListenerService"
            android:exported="false" >
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT" />
            </intent-filter>
        </service>

      <meta-data
        android:name="com.dieam.reactnativepushnotification.notification_foreground"
        android:value="false"/>

    <meta-data
      android:name="com.google.firebase.messaging.default_notification_icon"
      android:resource="@drawable/notification_icon"
    />
<activity.... 

From android/build.gradle

buildscript {
    ext {
        googlePlayServicesVersion = "+"
        firebaseMessagingVersion = "+"
        buildToolsVersion = "28.0.3"
        minSdkVersion = 19
        compileSdkVersion = 29
        targetSdkVersion = 29
    }
    repositories {
        google()
        mavenLocal()
        jcenter()
        ...
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:3.5.3'
        classpath 'com.google.gms:google-services:+'
    }
}

allprojects {
    repositories {
        google()
        jcenter()
        mavenLocal()...

inside index.js

import PushNotification from 'react-native-push-notification';
import PushNotificationIOS from '@react-native-community/push-notification-ios';

PushNotification.configure({
  // (optional) Called when Token is generated (iOS and Android)
  onRegister: token => {
    console.log('TOKEN:', token);
  },

  // (required) Called when a remote is received or opened, or local notification is opened
  onNotification: notification => {
    console.log('NOTIFICATION:', notification);
    // process the notification
    PushNotification.localNotification(notification);
    // (required) Called when a remote is received or opened, or local notification is opened
    notification.finish(PushNotificationIOS.FetchResult.NoData);
  },

  onRegistrationError: err => {
    console.error(err.message, err);
  },

  permissions: {
    alert: true,
    badge: true,
    sound: true
  },
  popInitialNotification: false,
  requestPermissions: true
});

[piavW]

SOLVED: I wasn’t sending in the specified channelId when I sent my remote notifications from the Firebase Console (I was targeting my plugged in android (using usb-debugging through Android Studios) and only sending notifications to it using it’s FCM token and thus not setting a channelId.

For anyone having issues in the future, I used the wonderful example and the class NotifService to create a default channel - I did also try to create my own channel in android/MainAcitvity.Java using code found here https://developer.android.com/training/notify-user/channels#CreateChannel - both ways work and create the channel - which you can check using the following code (also from the example’s NotifsService:

PushNotification.getChannels(function(channels) {
      console.log('getchannels gives us', channels);
    });

@Dallas62 you’re the best - thank you for helping me and answering quickly - have a great day!

[Dallas62]

You can take a look to #1462