Hand Raise

Prerequisites:

Minimum required SDK version

Raise Hand and lower hand is now supported as a first class API with 100ms.


interface HMSPeer {
    ...
    isHandRaised: boolean;
}

Raise Hand


async function toggleRaiseHand() {
    const localPeerId = hmsStore.getState(selectLocalPeerID);
    const isHandRaised = hmsStore.getState(selectHasPeerHandRaised(localPeerId));
    if (isHandRaised) {
        await hmsActions.lowerLocalPeerHand();
    } else {
        await hmsActions.raiseLocalPeerHand();
    }
}


const RaiseHand = () => {
    const localPeerId = useHMSStore(selectLocalPeerID);
    const isHandRaised = useHMSStore(selectHasPeerHandRaised(localPeerId));
    const hmsActions = useHMSActions();
    const toggleRaiseHand = useCallback(async () => {
        if (isHandRaised) {
            await hmsActions.lowerLocalPeerHand();
        } else {
            await hmsActions.raiseLocalPeerHand();
        }
    }, [hmsActions, isHandRaised]);
    return (
        <button onClick={toggleRaiseHand}>
            {isHandRaised ? 'Lower Hand' : 'Raise Hand'}
        </button>
    );
};

Hand Raise update Notification

Once the hand raise is updated by local peer, all the peers will receive a notification with type HAND_RAISE_CHANGED and HMSPeer object as notification data.


hmsNotifications.onNotification((notification) => {
    const peer = notification.data;
    const isHandRaised  = peer.isHandRaised;
    if (isHandRaised && !peer.isLocal) {
        toast(`${peer.name} raised their hand.`);
    }
}, HMSNotificationTypes.HAND_RAISE_CHANGED);


const notification = useHMSNotifications(HMSNotificationTypes.HAND_RAISE_CHANGED);
const peer = notification?.data;

useEffect(() => {
    if (peer && !peer.isLocal && peer.isHandRaised) {
        toast(`${peer.name} raised their hand.`);
    }
}, [peer]);

Connection Quality Stats For Nerds

Have a suggestion? Recommend changes ->