MM-55036 - Calls: Fix: Receiving in-app notifications for calls notifications while active (#7623)

* when active, do not show overlay if this is a calls-started notification

* add calls notification type; keep message test for backwards compat

* process calls notifications properly

* revert NOTIFICATION_TYPE.CALLS; use sub_type for backwards compatibility

* add ticket and comment for future refactoring of isCallsStartedMessage

app/constants/push_notification.ts

@@ -11,6 +11,10 @@ export const NOTIFICATION_TYPE = {
     SESSION: 'session',
 };
 
+export const NOTIFICATION_SUB_TYPE = {
+    CALLS: 'calls',
+};
+
 export default {
     CATEGORY,
     NOTIFICATION_TYPE,

app/init/push_notifications.ts

@@ -18,6 +18,7 @@ import {storeDeviceToken} from '@actions/app/global';
 import {markChannelAsViewed} from '@actions/local/channel';
 import {updateThread} from '@actions/local/thread';
 import {backgroundNotification, openNotification} from '@actions/remote/notifications';
+import {isCallsStartedMessage} from '@calls/utils';
 import {Device, Events, Navigation, PushNotification, Screens} from '@constants';
 import DatabaseManager from '@database/manager';
 import {DEFAULT_LOCALE, getLocalizedMessage, t} from '@i18n';
@@ -107,6 +108,11 @@ class PushNotifications {
     handleInAppNotification = async (serverUrl: string, notification: NotificationWithData) => {
         const {payload} = notification;
 
+        // Do not show overlay if this is a call-started message (the call_notification will alert the user)
+        if (isCallsStartedMessage(payload)) {
+            return;
+        }
+
         const database = DatabaseManager.serverDatabases[serverUrl]?.database;
         if (database) {
             const isTabletDevice = await isTablet();

app/products/calls/utils.ts

@@ -5,6 +5,7 @@ import {makeCallsBaseAndBadgeRGB, rgbToCSS} from '@mattermost/calls';
 import {Alert} from 'react-native';
 
 import {Calls, Post} from '@constants';
+import {NOTIFICATION_SUB_TYPE} from '@constants/push_notification';
 import {isMinimumServerVersion} from '@utils/helpers';
 import {displayUsername} from '@utils/user';
 
@@ -14,6 +15,8 @@ import type PostModel from '@typings/database/models/servers/post';
 import type {IntlShape} from 'react-intl';
 import type {RTCIceServer} from 'react-native-webrtc';
 
+const callsMessageRegex = /^\u200b.* is inviting you to a call$/;
+
 export function sortParticipants(locale: string, teammateNameDisplay: string, participants?: Dictionary<CallParticipant>, presenterID?: string): CallParticipant[] {
     if (!participants) {
         return [];
@@ -150,3 +153,13 @@ export function makeCallsTheme(theme: Theme): CallsTheme {
 
     return newTheme;
 }
+
+export function isCallsStartedMessage(payload?: NotificationData) {
+    if (payload?.sub_type === NOTIFICATION_SUB_TYPE.CALLS) {
+        return true;
+    }
+
+    // MM-55506 - Remove once we can assume MM servers will be >= 9.3.0, mobile will be >= 2.11.0,
+    // calls will be >= 0.21.0, and push proxy will be >= 5.27.0
+    return (payload?.message === 'You\'ve been invited to a call' || callsMessageRegex.test(payload?.message || ''));
+}

app/utils/notification/index.ts

@@ -6,6 +6,7 @@ import {createIntl, type IntlShape} from 'react-intl';
 import {Alert, DeviceEventEmitter} from 'react-native';
 
 import {Events} from '@constants';
+import {NOTIFICATION_TYPE} from '@constants/push_notification';
 import {DEFAULT_LOCALE, getTranslations} from '@i18n';
 import PushNotifications from '@init/push_notifications';
 import {popToRoot} from '@screens/navigation';
@@ -24,7 +25,7 @@ export const convertToNotificationData = (notification: Notification, tapped = t
             channel_name: payload.channel_name,
             identifier: payload.identifier || notification.identifier,
             from_webhook: payload.from_webhook,
-            message: ((payload.type === 'message') ? payload.message || notification.body : payload.body),
+            message: ((payload.type === NOTIFICATION_TYPE.MESSAGE) ? payload.message || notification.body : payload.body),
             override_icon_url: payload.override_icon_url,
             override_username: payload.override_username,
             post_id: payload.post_id,
@@ -35,6 +36,7 @@ export const convertToNotificationData = (notification: Notification, tapped = t
             server_url: payload.server_url,
             team_id: payload.team_id,
             type: payload.type,
+            sub_type: payload.sub_type,
             use_user_icon: payload.use_user_icon,
             version: payload.version,
             isCRTEnabled: typeof payload.is_crt_enabled === 'string' ? payload.is_crt_enabled === 'true' : Boolean(payload.is_crt_enabled),

types/global/push_notifications.d.ts

@@ -36,6 +36,7 @@ interface NotificationData {
     server_url?: string;
     team_id?: string;
     type: string;
+    sub_type?: string;
     use_user_icon?: string;
     userInfo?: NotificationUserInfo;
     version: string;