Getting double notification popup for single event on ios when sending notification using FCM

Question

Issue Description::

I am working on react native application and using react native firebase messaging service for push notification. I am having a problem on IOS platform. I am getting double notification popups for single event.

Steps I am following to generate the case::

1. After app installation if I am login and sending notification through FCM I just received a single popup. After this I logged out and login again, now this time I got double popups for single notification. In this case I am not clearing an app from background.

2. If after every logout I am clearing an app from background I just received a single popup for single event.

3. When I am logged out from the application, and forcefully sending notification from FCM, I am getting double popup on app initialization screen(login screen).

I am generating a new device token when user login and saving this token inside local storage, we are clearing local storage data on logout.

Code::

async mountDashboard() {
    const enabled = await firebase.messaging().hasPermission();
    if (enabled) {
        const fcmToken = await firebase.messaging().getToken();
        await AsyncStorage.setItem(LocalStorageKeys.DEVICE_TOKEN, fcmToken);
        if (fcmToken) {
            //--- here we are saving our token and sendind data to API
        }
    }

    // in Foreground
    this.notificationListener = firebase.notifications().onNotification((notification) => {
        new RegisterLocalNotification(notification);
    });

    // App in Foreground and background
    let notificationHandler = new NotificationsHandler();
    this.notificationOpenedListener = firebase.notifications().onNotificationOpened((notificationOpen) => {
        notificationHandler.handleNotification(notificationOpen.notification);
    });

    // app close notification handler
    AppCloseNotificationHandler.getInstance().handleNotification();

}

componentDidMount() {
    this.mountDashboard();
}

Environment::

Binaries:

• Node: 10.15.0 - /usr/local/opt/node@10/bin/node
• Yarn: 1.10.1 -/usr/local/bin/yarn
• npm: 6.4.1 - /usr/local/opt/node@10/bin/npm
• Watchman: 4.9.0 - /usr/local/bin/watchman
• List item

npm Packages:

• react: ^16.8.4 => 16.8.4
• react-native: ^0.58.6 => 0.58.6

npm Global Packages:

• react-native-cli: 2.0.1
• react-native-firebase: 5.2.3

Answer 1

You have to unsubscribe from your listener when the component will unmount. If you don't do that you are subscribing two listeners.

componentWillUnmount() {
    this.notificationListener(); // it's unsubscribing your listener
}