Co-Host Management
Manage co-hosts, transfer ownership, and control permissions in video conferences
Overview
Co-hosting allows you to delegate moderation and control capabilities to trusted participants in video conferences. Co-hosts can help manage large meetings by controlling participant permissions, moderating content, and handling administrative tasks. This is essential for professional webinars, online classes, and large team meetings.
Host Transfer
Transfer primary host role to another user
Promote/Demote
Grant or revoke co-host privileges
Permission Control
Fine-grained control over co-host capabilities
Common Use Cases
Professional Webinars
Designate team members as co-hosts to handle Q&A, manage breakout rooms, and monitor chat while you focus on presenting content.
Online Classes
Teachers can promote teaching assistants to co-hosts to help manage student behavior, mute disruptive participants, and handle technical issues.
Team Meetings
Rotate host responsibilities during recurring meetings. Transfer host role when the primary host needs to leave early.
Moderated Events
Large events with multiple moderators who need permission to mute participants, manage screen sharing, and control recordings.
How Co-Hosting Works
BaxCloud uses a role-based permission system for co-hosting:
1. Role Hierarchy
- Full control over the room
- Can promote/demote co-hosts and participants
- Can transfer host role to another user
- Can end the meeting for everyone
- Can configure room settings
- Can mute/unmute participants
- Can remove participants
- Can start/stop recording (if permitted)
- Can manage screen sharing
- Cannot promote other co-hosts (host only)
- Cannot transfer host role
- Can publish audio/video if permitted
- Can share screen if permitted
- Can send chat messages
- No moderation capabilities
2. Permission System
Co-host permissions can be customized. You can grant specific capabilities like recording, but restrict others like removing participants. This allows fine-grained control based on your needs.
3. Host Transfer
When the host transfers ownership to another user, the new host gains full control and the previous host becomes a co-host. This is useful when the original host needs to leave but wants the meeting to continue.
Step-by-Step Implementation
Implement co-hosting features in your application
Create Room as Host
Initialize a room with host privileges
The room creator automatically becomes the host:
1import { BaxCloudClient } from '@baxcloud/react-sdk';
2
3const createRoomAsHost = async () => {
4 const client = new BaxCloudClient({
5 projectId: 'your-project-id',
6 apiKey: 'your-api-key',
7 });
8
9 await client.connect({
10 roomName: 'team-meeting',
11 liveType: 'video_conference',
12 participant: {
13 userId: 'user-123',
14 name: 'Host Alice',
15 avatarUrl: 'https://example.com/avatar.jpg',
16 isHost: true,
17 },
18 });
19
20 // Enable camera and microphone
21 await client.enableCamera();
22 await client.enableMicrophone();
23
24 console.log('Room created, you are the host');
25};Promote Participant to Co-Host
Grant co-host privileges
The host can promote regular participants to co-host status:
1import { BaxCloudRoomController } from '@baxcloud/react-sdk';
2
3const controller = BaxCloudRoomController.instance;
4
5// Promote a participant to co-host
6const promoteToCoHost = async (userId: string) => {
7 try {
8 await controller.promoteToCoHost(userId);
9 console.log('Participant promoted to co-host');
10 } catch (error) {
11 console.error('Failed to promote to co-host:', error);
12 }
13};
14
15// Listen for co-host promotion events
16controller.onCoHostPromoted((user) => {
17 console.log(`${user.name} has been promoted to co-host!`);
18
19 // If this is the current user, update UI
20 if (user.userId === currentUserId) {
21 console.log('You are now a co-host!');
22 // Show co-host controls in UI
23 }
24});
25
26// Get list of co-hosts
27const coHosts = controller.getCoHosts();Demote Co-Host to Participant
Revoke co-host privileges
Remove co-host privileges and return them to regular participant status:
1import { BaxCloudRoomController } from '@baxcloud/react-sdk';
2
3const controller = BaxCloudRoomController.instance;
4
5// Demote co-host to participant
6const demoteFromCoHost = async (userId: string) => {
7 try {
8 await controller.demoteFromCoHost(userId);
9 console.log('Co-host demoted to participant');
10 } catch (error) {
11 console.error('Failed to demote co-host:', error);
12 }
13};
14
15// Listen for co-host demotion
16controller.onCoHostDemoted((user) => {
17 console.log(`${user.name} is no longer a co-host`);
18
19 // If this is the current user, update UI
20 if (user.userId === currentUserId) {
21 console.log('You are no longer a co-host');
22 // Hide co-host controls in UI
23 }
24});
25
26// Get list of co-hosts
27const coHosts = controller.getCoHosts();Transfer Host Role
Make another user the primary host
Transfer primary host responsibilities to another participant:
1import { BaxCloudRoomController } from '@baxcloud/react-sdk';
2
3const controller = BaxCloudRoomController.instance;
4
5// Transfer host role to another user
6const transferHost = async (userId: string) => {
7 try {
8 await controller.transferHost(userId);
9 console.log('Host role transferred successfully');
10 } catch (error) {
11 console.error('Failed to transfer host:', error);
12 }
13};
14
15// Listen for host transfer events
16controller.onHostTransferred(({ newHost, previousHost }) => {
17 console.log(`Host transferred from ${previousHost.name} to ${newHost.name}`);
18
19 // If this is the current user, update UI
20 if (newHost.userId === currentUserId) {
21 console.log('You are now the host!');
22 } else if (previousHost.userId === currentUserId) {
23 console.log('You are now a co-host');
24 }
25});Irreversible Action
Check Co-Host Status
Monitor co-host roles and permissions
Check if a user is a co-host and get the list of co-hosts:
1import { BaxCloudRoomController } from '@baxcloud/react-sdk';
2
3const controller = BaxCloudRoomController.instance;
4
5// Check if current user is host
6const isCurrentUserHost = controller.isHost();
7
8// Check if specific user is host
9const isUserHost = controller.isHost(userId);
10
11// Get all participants
12const participants = controller.getParticipants();
13
14// Get list of co-host user IDs
15const coHosts = controller.getCoHosts();
16
17// Check if a user is a co-host
18const isCoHost = (userId: string) => {
19 return coHosts.includes(userId);
20};
21
22// Get all co-hosts as BaxcloudUser objects
23const coHostUsers = participants.filter(p => coHosts.includes(p.userId));Monitor Role Changes
Track and respond to role updates
Keep your UI in sync with role changes:
1import { BaxCloudRoomController } from '@baxcloud/react-sdk';
2import { useEffect } from 'react';
3
4const controller = BaxCloudRoomController.instance;
5
6useEffect(() => {
7 // Track co-host promotions
8 const unsubscribePromoted = controller.onCoHostPromoted((user) => {
9 console.log(`${user.name} promoted to co-host`);
10
11 if (user.userId === currentUserId) {
12 console.log('You are now a co-host!');
13 // Update UI to show co-host controls
14 }
15 });
16
17 // Track co-host demotions
18 const unsubscribeDemoted = controller.onCoHostDemoted((user) => {
19 console.log(`${user.name} demoted from co-host`);
20
21 if (user.userId === currentUserId) {
22 console.log('You are no longer a co-host');
23 // Update UI to hide co-host controls
24 }
25 });
26
27 // Track host transfers
28 const unsubscribeTransfer = controller.onHostTransferred(({ newHost, previousHost }) => {
29 console.log(`Host: ${previousHost.name} → ${newHost.name}`);
30
31 if (newHost.userId === currentUserId) {
32 console.log('You are now the host!');
33 } else if (previousHost.userId === currentUserId) {
34 console.log('You are now a co-host');
35 }
36 });
37
38 return () => {
39 unsubscribePromoted();
40 unsubscribeDemoted();
41 unsubscribeTransfer();
42 };
43}, []);Best Practices
Clearly indicate roles visually
Use badges, icons, or colors to distinguish hosts, co-hosts, and participants. This helps everyone understand who has moderation capabilities.
Limit number of co-hosts
Too many co-hosts can create confusion. Generally, 1-3 co-hosts is sufficient for most meetings, even with hundreds of participants.
Confirm before transferring host
Always show a confirmation dialog before transferring host role. This prevents accidental transfers and ensures the user understands the implications.
Grant minimal necessary permissions
Follow the principle of least privilege. Only grant co-hosts the permissions they actually need. For example, don't give everyone recording permissions if not required.
Notify on role changes
Show clear notifications when users are promoted, demoted, or when host is transferred. This keeps everyone informed and prevents confusion.
Log moderation actions
Track who performed what actions (muted, removed, etc.) for accountability and debugging. This is especially important for professional or educational settings.
Troubleshooting
Can't Promote to Co-Host
- Verify you have host role (only hosts can promote co-hosts)
- Check that target participant is in the room
- Ensure target participant isn't already a co-host or host
- Check for API errors in browser console
Co-Host Can't Perform Actions
- Verify the specific permission is granted (check permissions object)
- Ensure role update was successful and received
- Check that action is allowed for co-hosts (e.g., can't promote other co-hosts)
- Verify network connectivity for API requests
Host Transfer Failed
- Verify you are the current host (co-hosts can't transfer)
- Check that target participant is connected to the room
- Ensure target participant accepts the transfer (if confirmation required)
- Check network connection and API response
Role Updates Not Reflecting in UI
- Verify you're listening to 'roleUpdated' events
- Check that state updates trigger UI re-render
- Ensure event listeners are properly attached
- Look for JavaScript errors in console