daily-examples/custom/fitness-demo/components/Tray/ScreenShare.js

38 lines
1.1 KiB
JavaScript

import React from 'react';
import { TrayButton } from '@custom/shared/components/Tray';
import { useCallState } from '@custom/shared/contexts/CallProvider';
import { useParticipants } from '@custom/shared/contexts/ParticipantsProvider';
import { useScreenShare } from '@custom/shared/contexts/ScreenShareProvider';
import { ReactComponent as IconShare } from '@custom/shared/icons/share-sm.svg';
export const ScreenShareTray = () => {
const { enableScreenShare } = useCallState();
const { localParticipant } = useParticipants();
const {
isSharingScreen,
isDisabled,
startScreenShare,
stopScreenShare
} = useScreenShare();
const toggleScreenShare = () =>
isSharingScreen ? stopScreenShare() : startScreenShare();
if (!enableScreenShare) return null;
if (!localParticipant.isOwner) return null;
return (
<TrayButton
label={isSharingScreen ? 'Stop': 'Share'}
orange={isSharingScreen}
disabled={isDisabled}
onClick={toggleScreenShare}
>
<IconShare />
</TrayButton>
);
};
export default ScreenShareTray;