Notifications

Join Notification

Poor Connection Notification

Notifications can be used to display toast to user about activities happening in the room, such as peer join/leave or new messages. It can also be used to know about any mid call sdk level error.

In order to subscribe for notifications we can use the hmsNotifications object created in the integration step.

import { hmsNotifications } from './hms'; hmsNotifications.onNotification((notification) => { // This function will be called when a notification is received console.log('notification type', notification.type); // The data in notification depends on the notification type console.log('data', notification.data); });

Notification types

The notification type is a string and can only take values from the list here. You can use it to check the type of the notification.

The data in notification depends on the notification type. You can use the switch construct to the handle the notification type.

import { hmsNotifications, HMSNotificationTypes } from '@100mslive/hms-video-store'; const unsubscribe = hmsNotifications.onNotification((notification) => { console.log('notification type', notification.type); console.log('data', notification.data); // you can use the following to show appropriate toast notifications for example switch (notification.type) { case HMSNotificationTypes.PEER_LIST: console.log(`${notification.data} are the peers in the room`); // received right after join break; case HMSNotificationTypes.PEER_JOINED: console.log(`${notification.data.name} joined`); break; case HMSNotificationTypes.PEER_LEFT: console.log(`${notification.data.name} left`); break; case HMSNotificationTypes.NEW_MESSAGE: console.log( `${notification.data.message} received from ${notification.data.senderName}` ); break; case HMSNotificationTypes.ERROR: console.log('[Error]', notification.data); console.log('[Error Code]', notfication.data.code); break; case HMSNotificationTypes.RECONNECTING: console.log('[Reconnecting]', notification.data); break; case HMSNotificationTypes.RECONNECTED: console.log('[Reconnected]'); break; case HMSNotificationTypes.NAME_UPDATED: case HMSNotificationTypes.METADATA_UPDATED: case HMSNotificationTypes.ROLE_UPDATED: console.log(`peer updated(${notification.type}), new peer=`, notification.data); break; case HMSNotificationTypes.TRACK_DEGRADED: console.log(`track - ${notification.data} degraded due to poor network`); break; case HMSNotificationTypes.TRACK_RESTORED: console.log(`track - ${notification.data} recovered`); break; case HMSNotificationTypes.ROOM_ENDED: console.log(`room ended, reason - ${notification.data.reason}`); break; case HMSNotificationTypes.REMOVED_FROM_ROOM: console.log(`removed from room, reason - ${notification.data.reason}`); break; case HMSNotificationTypes.DEVICE_CHANGE_UPDATE: console.log(`device changed - ${notification.data}`); break; default: break; } });

Listening to specific notifications

You can pass a single notification or array of notifications from one of HMSNotificationTypes.

import { hmsNotifications } from './hms'; const unsubscribe = hmsNotifications.onNotification((notification) => { console.log('notification type', notification.type); console.log('data', notification.data); }, HMSNotificationTypes.PEER_JOINED); const unsubscribePeerNotifications = hmsNotifications.onNotification( (notification) => { if (!notification) { return; } // this will be called when one of HMSNotificationTypes.PEER_JOINED, HMSNotificationTypes.PEER_LEFT is arrived console.log('notification type', notification.type); console.log('data', notification.data); }, [HMSNotificationTypes.PEER_JOINED, HMSNotificationTypes.PEER_LEFT] );

Unsubscribing from notifications

You can unsubscribe to the notifications by calling the method returned by the hmsNotifications.onNotification function.

const unsubscribe = hmsNotifications.onNotification((notification) => { //... }); unsubscribe();

Ideas

You can create notifications with buttons in them, to make it easier for the end user to respond to those notifications. For example -

Screenshare Notification


Have a suggestion? Recommend changes ->

Was this helpful?

1234