/* eslint-disable no-underscore-dangle */
import React, { useContext, useEffect } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { resetEverything } from '../store/store';
import { GridManager } from '../components/video/GridManager';
import { useWindowDimensions, NativeModules, Platform, BackHandler, NativeEventEmitter, } from 'react-native';
import ConfirmExitModal from '../components/ConfirmExitModal';
import HostWaitingListModal from '../components/HostWaitlistManagerModal';
import { ConfigServiceContext } from '../utils/ConfigProvider';
import useCopyClipboard, { useDisclosure } from '../utils/browser-utils';
import { Flex } from '../themes/components';
import StageHeader from '../components/StageHeader';
import StageControlBar from '../components/StageControlBar';
import RequestToJoinStageModal from '../components/RequestToJoinStageModal';
import StartPresentingModal from '../components/StartPresentingModal';
import PIPModeContainer from '../components/video/PIPModeContainer';
import StageService from '../services/StageService';
import { MediaRoomContext } from '../services/MediaRoomService';
import { setScreenShareRequested } from '../store/roomSlice';
import { RequestToJoinStageState, stoppedPresenting } from '../store/participantSlice';
import { WebinarAcceptRequestType } from '../types/newTypes';
const { DyteHelper } = NativeModules;
export default function Stage(props) {
    const dispatch = useDispatch();
    const { isOpen, onClose, onOpen } = useDisclosure();
    const isMobile = true;
    const { roomName } = props;
    const { sessionConfig, meeting } = useContext(ConfigServiceContext);
    const roomDisplayTitle = useSelector((state) => state.room.roomDisplayTitle);
    const waitlistedPeers = useSelector((state) => state.room.waitlistedPeers);
    const joinedPeers = useSelector((state) => state.peers.joinedPeers);
    const plugins = useSelector((state) => state.plugin);
    const windowDimensions = useWindowDimensions();
    const sharingScreen = useSelector((state) => state.participant.sharingScreen);
    const { height, width } = sessionConfig.theme.dimensions || windowDimensions;
    const [hasCopied, onCopy] = useCopyClipboard(`/stage/${roomName}`);
    const { mediaRoom } = useContext(MediaRoomContext);
    const joinToStageState = useSelector((state) => state.participant.requestToJoinStageState);
    const kicked = useSelector((state) => state.room.kicked);
    useEffect(() => {
        // remove when ios native module for the same is implemented
        if (Platform.OS === 'android') {
            DyteHelper.activateScreenWake();
            return () => DyteHelper.deactivateScreenWake();
        }
        return () => { };
    });
    useEffect(() => {
        const listener = BackHandler.addEventListener('hardwareBackPress', () => {
            // If ConfirmExitModal is already open, exit
            if (isOpen) {
                return false;
            }
            onOpen();
            return true;
        });
        return () => {
            if (listener) {
                listener.remove();
            }
            else {
                BackHandler.removeEventListener('hardwareBackPress', () => null);
            }
        };
    }, []);
    const onLeaveMeetingCalled = () => {
        setTimeout(() => {
            DyteHelper.stopService();
            if (sharingScreen) {
                dispatch(setScreenShareRequested(false));
                mediaRoom.disableScreenShare();
            }
        });
        if (joinToStageState === RequestToJoinStageState.ACCEPTED) {
            mediaRoom.removePeerFromStage(mediaRoom.peerid, WebinarAcceptRequestType.REQUESTED_BY_PARTICIPANT);
        }
        else {
            mediaRoom.stopPresenting();
            dispatch(stoppedPresenting());
        }
        meeting.emit(meeting.Events.disconnect);
        meeting.emit(meeting.Events.meetingEnded, { kicked });
        mediaRoom?.stopAllProducers();
        dispatch(resetEverything());
        if (isOpen) {
            onClose();
        }
    };
    useEffect(() => {
        if (meeting) {
            meeting.leaveRoom = onLeaveMeetingCalled;
        }
    }, [meeting]);
    useEffect(() => {
        if (kicked) {
            onLeaveMeetingCalled();
        }
    }, [kicked]);
    useEffect(() => {
        const ne = new NativeEventEmitter(DyteHelper);
        const lesveRoomListener = ne.addListener('LEAVE_ROOM', () => {
            onLeaveMeetingCalled();
        });
        return (() => {
            lesveRoomListener.remove();
        });
    }, []);
    return (<Flex direction="column" bg="secondary.1000" height={height} width={width}>
			<Flex direction="column" width={width} height={height}>
				<StageService />
				<ConfirmExitModal isOpen={isOpen} onClose={onClose} onLeave={onLeaveMeetingCalled}/>
				<HostWaitingListModal isOpen={waitlistedPeers.length > 0} peers={waitlistedPeers}/>
				{sessionConfig.theme.header.is_enabled && (<StageHeader title={roomDisplayTitle !== '' ? roomDisplayTitle : roomName} linkCopied={hasCopied} copyLink={onCopy} width={width} height={height} noOfParticipants={joinedPeers
        .filter((v, i, a) => a.findIndex((t) => (t.id === v.id)) === i)
        .length}/>)}
				<PIPModeContainer isMobile={isMobile}/>
				<GridManager widthOffset={0} singleSpeakerView={plugins.main.length > 0 && !isMobile}/>
				<RequestToJoinStageModal isMobile={isMobile}/>
				<StartPresentingModal />
				{sessionConfig.theme.control_bar.is_enabled && (<StageControlBar linkCopied={hasCopied} copyLink={onCopy} isMobile={isMobile} leaveCall={onOpen}/>)}
			</Flex>
		</Flex>);
}
//# sourceMappingURL=Stage.js.map