观众上麦（React Native）

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';

// 先获取要加入的语聊房 ID（liveID）。通常有以下方式：
// 通过房间列表选择（可从 LiveListState 的 liveList 数据中获取）
const liveID = "xxx" // 您当前加入语聊房的 liveID

//通过 liveID 获取 CoGuestState 的实例
const { applyForSeat } = useCoGuestState(liveID);

// 用户点击“申请连麦”
const handleApplyForSeat = () => {
  applyForSeat({
    liveID,
    seatIndex: -1, // 申请的麦位，申请上麦传 -1, 随机分配麦位
    timeout: 30,   // 请求超时时间，例如 30s
  });
};

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
import { useDeviceState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/DeviceState';

const { addCoGuestGuestListener } = useCoGuestState(liveID);
const { openLocalMicrophone } = useDeviceState(liveID);

// 页面初始化时订阅连麦申请响应事件
useEffect(() => {
  addCoGuestGuestListener('onGuestApplicationResponded', (event) => {
    const res = typeof event === 'string' ? JSON.parse(event) : event;
    if (res.isAccept) {
      console.log('上麦申请被同意');
      // 1.打开麦克风
      openLocalMicrophone();
      // 2. 在此更新 UI，例如变更申请按钮状态，显示为连麦中
    } else {
      console.log('上麦申请被拒绝');
      // 弹窗提示用户申请被拒绝
    }
  });
}, [liveID]);

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
const { disconnect } = useCoGuestState(liveID);

// 用户点击"下麦"按钮
const handleLeaveSeat = () => {
  disconnect({
    liveID,
    onSuccess: () => {
      console.log('下麦成功');
    },
    onError: (error) => {
      console.log('下麦失败', error);
    },
  });
};

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
const { cancelApplication } = useCoGuestState(liveID);

// 用户在等待时，点击"取消申请"
const handleCancelRequest = () => {
  cancelApplication({
    liveID,
    onSuccess: () => {
      console.log('取消申请成功');
    },
    onError: (error) => {
      console.log('取消申请失败', error);
    },
  });
};

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';

// 获取 CoGuestState 实例
const { addCoGuestHostListener } = useCoGuestState(liveID);

// 在页面初始化时订阅事件
useEffect(() => {
  addCoGuestHostListener('onGuestApplicationReceived', (event) => {
    const res = JSON.parse(event);
    console.log('收到观众的连麦申请');
    // 在此更新 UI，例如在"申请列表"按钮上显示红点
  });
}, [liveID]);

const { addCoGuestHostListener, applicants } = useCoGuestState(liveID);

{/* 申请者列表 */}
{applicants && applicants.length > 0 ? (
  <View style={styles.applicantContainer}>
    <Text style={styles.applicantTitle}>申请列表（{applicants.length}）</Text>
    {applicants.map((audience) => (
      <View key={audience?.userID} style={styles.applicantItem}>
        <Text style={styles.applicantName}>{audience.userName}</Text>
        <Text style={styles.applicantId}>{audience.userID}</Text>
      </View>
    ))}
  </View>
) : null}

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
const { acceptApplication, rejectApplication } = useCoGuestState(liveID);

// 主播点击"同意"按钮，传入申请者的 userID
const handleAccept = (userID) => {
  acceptApplication({
    liveID,
    userID,
    onSuccess: () => {
      console.log('已同意上麦申请');
    },
    onError: (error) => {
      console.log('同意上麦申请失败', error);
    },
  });
};

// 主播点击"拒绝"按钮，传入申请者的 userID
const handleReject = (userID) => {
  rejectApplication({
    liveID,
    userID,
    onSuccess: () => {
      console.log('已拒绝上麦申请');
    },
    onError: (error) => {
      console.log('拒绝上麦申请失败', error);
    },
  });
};

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
const { inviteToSeat } = useCoGuestState(liveID);

// 主播选择观众并发起邀请
const handleInviteToSeat = (inviteeID) => {
  inviteToSeat({
    liveID,
    inviteeID,
    seatIndex: -1, // 邀请的麦位，传 -1, 随机分配麦位
    timeout: 30,   // 超时时间
    onSuccess: () => {
      console.log('已向观众发送上麦邀请，请等待回应...');
    },
    onError: (error) => {
      console.log('向观众发送上麦邀请失败', error);
    },
  });
};

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
const { addCoGuestHostListener } = useCoGuestState(liveID);

// 在页面初始化时订阅事件
useEffect(() => {
  addCoGuestHostListener('onHostInvitationResponded', (event) => {
    const res = JSON.parse(event);
    if (res.isAccept) {
      console.log('观众接受了您的邀请');
    } else {
      console.log('观众拒绝了您的邀请');
    }
  });
}, [liveID]);

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
import { useLiveListState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/LiveListState';

const { addCoGuestGuestListener } = useCoGuestState(liveID);
const { currentLive } = useLiveListState();

// 页面初始化时订阅连麦申请响应事件
useEffect(() => {
  addCoGuestGuestListener('onHostInvitationReceived', (event) => {
    const inviterID = currentLive?.liveOwner?.userID || '';
    console.log('邀请人ID:', inviterID);
    // 弹出对话框，让用户选择"接受"或"拒绝"
  });
}, [liveID]);

import { useCoGuestState } from 'react-native-tuikit-atomic-x/lib/module/atomic-x/state/CoGuestState';
const { acceptInvitation, rejectInvitation } = useCoGuestState(liveID);
const { openLocalMicrophone } = useDeviceState(liveID);

// 用户点击“接受”
const handleAcceptInvitation = (inviterID) => {
  acceptInvitation({
    liveID,
    inviterID,
    onSuccess: () => {
      console.log('已接受上麦邀请');
      openLocalMicrophone(); // 可以选择在此处打开麦克风
    },
    onError: (error) => {
      console.log('接受上麦邀请失败', error);
    },
  });
};

// 用户点击“拒绝”
const handleRejectInvitation = (inviterID) => {
  rejectInvitation({
    liveID,
    inviterID,
    onSuccess: () => {
      console.log('已拒绝上麦邀请');
    },
    onError: (error) => {
      console.log('拒绝上麦邀请失败', error);
    },
  });
};