'RN notifee onBackgroundEvent dosen't called when an action get pressed

I'm using @notifee/react-native & Firebase messaging service to display an incoming call notification on Android that has two actions (accept-call and reject-call).

  1. accept-call: Opens the app & the call starts (Works when the application on foreground and on background ✅)
  2. reject-call: Remove the notification & preform an API request to cancel the call (Works only when the application is running foreground ✅ but not when the app onbackgroud- killed state ❌ )

Notification screentshot

Producing the issue

// displays a notification when a message is received
messaging().onMessage(onMessageReceived);
messaging().setBackgroundMessageHandler(onMessageReceived);

// displayNotification using notifee
const  onMessageReceived = async (data) => {
// ... more mogic
 await notifee.displayNotification({
      title,
      body,
      id: notificationId,
      android: {
        channelId: callChannelId,
        category: AndroidCategory.CALL,
        circularLargeIcon: true,
        color: AndroidColor.BLUE,
        importance: AndroidImportance.HIGH,
        ongoing: true,
        fullScreenAction: {
          id: 'incoming-call',
        },
        largeIcon: largeIcon,
        actions: [
          {
            title: '<p style="color: #FF0000;">Cancel</p>',
            pressAction: { id: NOTIFICATION_ACTIONS_ID.cancelIncomingCall }, // this not working onbackground
          },
          {
            title: '<p style="color: #00FF00;">Accept</p>',
            pressAction: { id: NOTIFICATION_ACTIONS_ID.acceptIncomingCall, launchActivity: 'default' }, // works fine
          },
        ],
        badgeCount: 1,
        timeoutAfter: ONE_MINUTE,
        autoCancel: false,
      },
      ios: {
        categoryId: 'incoming-call',
        attachments: [
          {
            // iOS resource

            url: largeIcon,
            thumbnailHidden: true,
          },
        ],
        foregroundPresentationOptions: {
          alert: true,
          sound: true,
        },

        critical: true,
      },
      data: {
        notification: JSON.stringify({ ...notification, notificationId }),
      },
    });
}
// Background tasks run without React context, meaning you cannot update your application UI. You can however perform logic to update a remote database, update local device storage or even display/update a notification with Notifee!
notifee.onBackgroundEvent(async ({ type, detail }) => {
 const { notification, pressAction } = detail;

  // Check if the user pressed the "accept" action
  if (type === EventType.ACTION_PRESS && pressAction.id === NOTIFICATION_ACTIONS_ID.acceptIncomingCall) {
    // Update external API
    await fetch(`https://my-api.com/chat/${notification.data.chatId}/read`, {
      method: 'POST',
    });

    // Remove the notification
    await notifee.cancelNotification(notification.id);
  }
// Check if the user pressed the "reject" action 
  if (type === EventType.ACTION_PRESS && pressAction.id === NOTIFICATION_ACTIONS_ID.cancelIncomingCall) {
    // Update external API
    await fetch(`..../cancel`, {
      method: 'POST',
    });

    // Remove the notification
    await notifee.cancelNotification(notification.id);
  }

});

the issue is notifee.onBackgroundEvent get called when the notification get displayed but not when an action get pressed like (accept or reject).



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source