Useful Selectors

Here's a list of useful Selector hooks that you might want to use while building your application. Before using these make sure you have initialized the SDK, you can refer to this guide.

Selector functions would fetch you information from the state at any point in time, it can be anything ranging from "how many people are in the room?" to "is my audio on or not?". The answer to all these questions is the store.

Am I connected to the Room?

Knowing if you're in the room or not is the barest model information you need. selectIsConnectedToRoom returns a boolean flag denoting whether you've joined a room. NOTE: Returns true only after join, returns false during the preview.

const isConnected = hmsStore.getState(selectIsConnectedToRoom);

const isConnected = useHMSStore(selectIsConnectedToRoom);

Am I in the Preview?

selectIsInPreview returns a boolean denoting whether the room is in Preview state.

const isInPreview = hmsStore.getState(selectIsInPreview);

const isInPreview = useHMSStore(selectIsInPreview);

How many people have joined the room?

selectPeerCount returns the number of peers inside the room. If you have turned on peer list in preview, this count won't include the local peer if they're still in preview.

const count = hmsStore.getState(selectPeerCount);

const count = useHMSStore(selectPeerCount);

Who all are in my room?

selectPeers returns you an array of peers(remote peers and your local peer) present in the room. It will include the local peer in preview phase.

const peers = hmsStore.getState(selectPeers);

const peers = useHMSStore(selectPeers);

What is my current state of room?

What if you fail to join the room? How do you know if the user is reconnecting? This is where selectRoomState comes in handy, it returns you the current state of your room. You can refer to the ENUMS types for reference.

const roomState = hmsStore.getState(selectRoomState);

const roomState = useHMSStore(selectRoomState);

How do I know if my mic/video is on?

Mic/Video being turned on can lead to a lot of blunders, therefore it's critical to show it to the end-user. selectIsLocalAudioEnabled & selectIsLocalVideoEnabled helps you know if the local audio/video is enabled or not.

const audioOn = hmsStore.getState(selectIsLocalAudioEnabled);
const videoOn = hmsStore.getState(selectIsLocalVideoEnabled);

const audioOn = useHMSStore(selectIsLocalAudioEnabled);
const videoOn = useHMSStore(selectIsLocalVideoEnabled);

How do I know the status of remote mic/video status?

selectIsPeerAudioEnabled & selectIsPeerVideoEnabled returns a boolean denoting the peer's Audio/Video status.

const audioOn = hmsStore.getState(selectIsPeerAudioEnabled(peerId));
const videoOn = hmsStore.getState(selectIsPeerVideoEnabled(peerId));

const audioOn = useHMSStore(selectIsPeerAudioEnabled(peerId));
const videoOn = useHMSStore(selectIsPeerVideoEnabled(peerId));

How do I get the video stream of a user?

You can get video stream of a user using selectCameraStreamByPeer it returns HMSVideoTrack which you can use to call attach/detach actions.

const videoTrack = hmsStore.getState(selectCameraStreamByPeer(peerId));

const videoTrack = useHMSStore(selectCameraStreamByPeer(peerId));