Firebase keep receiving multiple respond on every new app launch

Issue:

I have integrated react native firebase v5 to my project. However on every new app launch (via tapping on the push notification at notification tray), then on the next push notification that is coming to my mobile will appear twice.

If I do repeat the steps above (open app via notification from tray) multiple times, then my application will receive the message from App Server multiple times.

I'm suspecting because every new launch there is a listener being added again into my app? Also to point out, on every app launch (open app via notification tray), componentDidMount is being trigger again.

Any thoughts?

Code:

I'm calling the code below my componentDidMount()

this.notificationOpenedListener = firebase
      .notifications()
      .onNotificationOpened(notificationOpen => {
        const {title, body} = notificationOpen.notification;
        console.log('onNotificationOpened(): open notificaiton, show alert');
        // this.showAlert(title, body);
      });


const notificationOpen = await firebase
      .notifications()
      .getInitialNotification();
    console.log('getInitialNotification()');
    console.log(notificationOpen);
    if (notificationOpen) {
      const {title, body} = notificationOpen.notification;

      // Prevent the alert box keep showing when App Reload
      if (title) {
        console.log(
          'getInitialNotification(): check to see if the application was opened by a notification',
        );
        // this.showAlert(title, body);
      }
    }


this.notificationOpenedListener = firebase
      .notifications()
      .onNotificationOpened(notificationOpen => {
        const {title, body} = notificationOpen.notification;
        console.log('onNotificationOpened(): open notificaiton, show alert');
        // this.showAlert(title, body);
      });

Environment info:

"react-native-firebase": "^5.6.0"

react-native: 0.61.5 => 0.61.5