usePeerIds

usePeerIds

The usePeerIds hook returns peerIds of all peers inside a Huddle01 room.

NameDescriptionReturn Type
peerIdsList of peerIds.string[]

Example Usage

import { usePeerIds } from "@huddle01/react/hooks";
import { RemotePeerCard } from "@components/RemotePeerCard";
 
const {
    peerIds
  } = usePeerIds({
  roles: [],
  labels: [],
  onPeerRoleUpdate(data) {}
  });
 
return (
  <div>
    {peerIds.map((peerId) => (
      {/* Use this peerId and pass it in custom component which shows viewport by using hooks such as `useRemotePeer` */}
      <RemotePeerCard key={peerId}>{peerId} />
    ))}
  </div>
)

Props

The usePeerIds hook accepts an object with the following fields as props.

roles

Optional
DescriptionType
The user roles for which you want the corressponding peerIds.string[]

Example Usage

const peerIds = usePeerIds({ roles: ["speaker"] });

labels

Optional
DescriptionType
The media type being shared by the users for which you want the corressponding peerIds.Array<'audio' | 'video' | 'screen-video' | 'screen-audio' | string>

Example Usage

const peerIds = usePeerIds({ labels: ["audio"] });

onLobbyPeersUpdated

Optional
DescriptionReturn Type
This function will be called when a peer's role is updated.void
Parameter NameTypeDescriptionRequired
data{ peerId: string; newRole: string; prevRole: string; }Data related to the peer role updateYes

Example Usage

const lobby = useLobby({ onLobbyPeersUpdated: (data) => {
	console.log("Peer role updated!");
  console.log("peerId: ", data.peerId);
  console.log("prevRole: ", data.prevRole);
  console.log("newRole: ", data.newRole);
    // your code here
}});
 
const peerIds = usePeerIds({ labels: ["audio"] });
Audio/Video Infrastructure designed for developers to empower them to ship simple yet powerful Audio/Video Apps.
support
company
Copyright © 2024 Graphene 01, Inc. All Rights Reserved.