import { useCoHostState, CoHostLayoutTemplate } from "tuikit-atomicx-vue3";

// Get the CoHostState instance
const { requestHostConnection } = useCoHostState();

// User clicks the "Co-Host" button and selects Host B (targetLiveId)
const inviteHostB = async (targetLiveId: string) => {
  try {
    await requestHostConnection({
      liveId: targetLiveId, // Room ID of target Host B
      layoutTemplate: CoHostLayoutTemplate.Grid, // Select a layout template
      timeout: 30, // Invitation timeout (seconds)
      extensionInfo: '', // Optional extension info
    });
    console.log("Co-host invitation sent, waiting for response...");
  } catch (error) {
    console.error("Failed to send invitation", error);
    // Optionally show a Toast notification here
  }
};

import { useCoHostState, CoHostEvent } from "tuikit-atomicx-vue3";
import { onMounted, onUnmounted } from 'vue';

const { subscribeEvent, unsubscribeEvent } = useCoHostState();

const onAccepted = (eventInfo: any) => {
    console.log(`Host ${eventInfo.invitee.userName} accepted your co-host invitation`);
};

const onRejected = (eventInfo: any) => {
    console.log(`Host ${eventInfo.invitee.userName} rejected your co-host invitation`);
};

const onTimeout = (eventInfo: any) => {
    console.log('Invitation timed out, no response from the other party');
};

onMounted(() => {
    subscribeEvent(CoHostEvent.onCoHostRequestAccepted, onAccepted);
    subscribeEvent(CoHostEvent.onCoHostRequestRejected, onRejected);
    subscribeEvent(CoHostEvent.onCoHostRequestTimeout, onTimeout);
});

onUnmounted(() => {
    unsubscribeEvent(CoHostEvent.onCoHostRequestAccepted, onAccepted);
    unsubscribeEvent(CoHostEvent.onCoHostRequestRejected, onRejected);
    unsubscribeEvent(CoHostEvent.onCoHostRequestTimeout, onTimeout);
});

import { useCoHostState, CoHostEvent } from "tuikit-atomicx-vue3";
import { onMounted, onUnmounted } from 'vue';

const { subscribeEvent, unsubscribeEvent } = useCoHostState();

const onRequestReceived = (eventInfo: any) => {
    const { inviter } = eventInfo;
    console.log(`Received co-host invitation from Host ${inviter.userName}`);
    // Display a dialog to let the user accept or reject
};

onMounted(() => {
    subscribeEvent(CoHostEvent.onCoHostRequestReceived, onRequestReceived);
});

onUnmounted(() => {
    unsubscribeEvent(CoHostEvent.onCoHostRequestReceived, onRequestReceived);
});

import { useCoHostState } from "tuikit-atomicx-vue3";

// Get the CoHostState instance
const { acceptHostConnection, rejectHostConnection, applicant } = useCoHostState();

// Accept the invitation
const acceptInvitation = async () => {
    if (applicant.value) {
        try {
            // Pass in the inviter's liveId (roomId)
            await acceptHostConnection({ liveId: applicant.value.liveId });
            console.log('Co-hosting accepted');
        } catch (error) {
            console.error('Failed to accept co-hosting', error);
        }
    }
 };

// Reject the invitation
const rejectInvitation = async () => {
    if (applicant.value) {
        try {
            await rejectHostConnection({ liveId: applicant.value.liveId });
            console.log('Co-hosting rejected');
        } catch (error) {
            console.error('Failed to reject co-hosting', error);
        }
    }
 };

import { useCoHostState, CoHostStatus } from "tuikit-atomicx-vue3";

// Get the CoHostState instance
const { exitHostConnection, coHostStatus } = useCoHostState();

// Handler for the "End PK" button
const stopPK = async () => {
  // Check if currently in co-hosting state
  if (coHostStatus.value === CoHostStatus.Connected) {
    try {
      await exitHostConnection();
      console.log('Exited co-hosting');
      // Reset UI layout and handle any additional business logic here
    } catch (error) {
      console.error('Failed to exit co-hosting:', error);
    }
  }
};

import { useCoHostState, CoHostEvent } from "tuikit-atomicx-vue3";
import { onMounted, onUnmounted } from 'vue';

const { subscribeEvent, unsubscribeEvent } = useCoHostState();

const onUserLeft = (eventInfo: any) => {
    const { userInfo } = eventInfo;
    console.log(`Host ${userInfo.userName} has disconnected from co-hosting`);
    
    // Restore single-host layout and remove the other host's video stream
};

onMounted(() => {
    // Subscribe to user left event
    subscribeEvent(CoHostEvent.onCoHostUserLeft, onUserLeft);
});

onUnmounted(() => {
    unsubscribeEvent(CoHostEvent.onCoHostUserLeft, onUserLeft);
});