Enable app icon badging for your Teams app

App icon badging helps a meeting participant identify any app activity during a meeting. Participants get activity notification for the meeting apps.

When there's new activity during the meeting, the app calls the targetedMeetingNotification API and displays a red badge on the app icon in the meeting unified bar (U-bar). When the participant selects the app icon, the app opens in the meeting side panel, and the badge goes away.

For example, during a real time collaboration in a meeting, if a participant adds a comment in a file added to the meeting, the app calls the targetedMeetingNotification API from the participant's meeting side panel. The API triggers a badge on the app icon to make other participants aware of the comment activity.

The following image shows you the app icon badging in the meeting U-bar:

Note

• App icon badging isn't available for Government Community Cloud (GCC)-High and Department of Defense (DOD) environments.
• App icon badging isn't supported for mobile clients.
• App icon badging isn't supported for channel meetings.

To enable app icon badging, follow these steps:

1. Enable app manifest settings for app icon badging
2. Enable app icon badging for your app

Enable app manifest settings for app icon badging

To enable app icon badging, you must:

• Ensure that you've configured meetingSidePanel as a context property for your app.
• Configure the authorization property and the name and type properties under the resourceSpecific field in the app manifest as follows:

"webApplicationInfo": {
    "id": "<<MICROSOFT-APP-ID>>",
    "resource": "https://RscBasedStoreApp"  },
  "authorization": {
    "permissions": {
      "resourceSpecific": [
        {
          "name": "OnlineMeetingNotification.Send.Chat",
          "type": "Application"        }
      ]
    }
  }

Enable app icon badging for your app

To enable app icon badging, ensure that you've enabled targeted in-meeting notification.

The Targeted meeting notification and app icon badging API is extended to support the app icon badging capability on the app icon and pass the user MRI IDs of the intended recipients. The surfaces parameter now supports meetingTabIcon value, which is used by the app.

App can also pass the tabEntityId, if there are multiple instances of the app added to the same meeting. If the tabEntityId isn't passed, then Teams displays the badge on the first app icon on the users meeting window.

Example

C#

Sample code reference

TeamsInfo.SendMeetingNotificationAsync(context, notificationPayload, meetingId);

JavaScript

Sample code reference

TeamsInfo.sendMeetingNotification(context, notificationPayload, meetingId);

JSON

{
    "type": "targetedMeetingNotification",
    "value": {
        "recipients": [
            "<participant1 MRI>",
            "<participant2 MRI>" 
        ],
        "surfaces": [
            {
                "surface": "meetingTabIcon",
                "tabEntityId": "<tab id from tab sdk>" // optional           
            }
        ]
    }
}

Response code

The following table includes the response codes:

Response code	Description
202	Notification is successfully sent.
207	Notifications are sent only to a few participants.
400	Meeting notification request payload validation failed.
401	Bot token is invalid.
403	Bot isn't allowed to send the notification.
404	Meeting chat isn't found or none of the participants were found in the roster.

Limitations

• App icon badging displays only one notification for a user in a minute per meeting.

• App icon badging is displayed to a maximum of first 50 participants for a particular meeting.

Code sample

Sample name	Description	Node.js	.NET
App icon badging for your Teams app	This sample demonstrates how to enable app icon badging for your Teams app.	View	View

See also

• Build tabs for meeting
• Build in-meeting notification for Teams meeting
• Targeted meeting notification and app icon badging API