diff --git a/packages/hms-video-web/src/connection/subscribe/subscribeConnection.ts b/packages/hms-video-web/src/connection/subscribe/subscribeConnection.ts index 70bd17ea8c..ef9054f81b 100644 --- a/packages/hms-video-web/src/connection/subscribe/subscribeConnection.ts +++ b/packages/hms-video-web/src/connection/subscribe/subscribeConnection.ts @@ -99,6 +99,10 @@ export default class HMSSubscribeConnection extends HMSConnection { const remote = this.remoteStreams.get(streamId)!; const TrackCls = e.track.kind === 'audio' ? HMSRemoteAudioTrack : HMSRemoteVideoTrack; const track = new TrackCls(remote, e.track); + // reset the simulcast layer to none when new video tracks are added, UI will subscribe when required + if (e.track.kind === 'video') { + remote.setVideoLayerLocally(HMSSimulcastLayer.NONE, 'addTrack', 'subscribeConnection'); + } track.transceiver = e.transceiver; const trackId = getSdpTrackIdForMid(this.remoteDescription, e.transceiver?.mid); trackId && track.setSdpTrackId(trackId); diff --git a/packages/roomkit-react/src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx b/packages/roomkit-react/src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx index 32199ba117..718596334b 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/Leave/DesktopLeaveRoom.tsx @@ -29,6 +29,7 @@ export const DesktopLeaveRoom = ({ const permissions = useHMSStore(selectPermissions); const { isStreamingOn } = useRecordingStreaming(); const showStream = screenType !== 'hls_live_streaming' && isStreamingOn; + const showLeaveOptions = (permissions?.hlsStreaming && isStreamingOn) || permissions?.endRoom; useDropdownList({ open: open || showEndStreamAlert || showLeaveRoomAlert, name: 'LeaveRoom' }); @@ -38,7 +39,7 @@ export const DesktopLeaveRoom = ({ return ( - {screenType !== 'hls_live_streaming' && (permissions?.hlsStreaming || permissions?.endRoom) ? ( + {showLeaveOptions ? ( { - leaveRoom({ endstream: false }); - }} + onClick={() => setShowLeaveRoomAlert(true)} > @@ -92,42 +91,37 @@ export const DesktopLeaveRoom = ({ css={{ p: 0 }} /> - {permissions?.endRoom || permissions?.hlsStreaming ? ( - + } + onClick={() => { + setOpen(false); + setShowEndStreamAlert(true); }} - data-testid="end_room_btn" - > - } - onClick={() => { - setOpen(false); - setShowEndStreamAlert(true); - }} - css={{ p: 0 }} - /> - - ) : null} + css={{ p: 0 }} + /> + ) : ( { - if (screenType === 'hls_live_streaming') { - setShowLeaveRoomAlert(true); - } else { - leaveRoom({ endstream: false }); - } + setShowLeaveRoomAlert(true); }} key="LeaveRoom" data-testid="leave_room_btn" @@ -154,16 +148,14 @@ export const DesktopLeaveRoom = ({ - {screenType === 'hls_live_streaming' ? ( - - - - - - - - - ) : null} + + + + + + + + ); }; diff --git a/packages/roomkit-react/src/Prebuilt/components/Leave/MwebLeaveRoom.tsx b/packages/roomkit-react/src/Prebuilt/components/Leave/MwebLeaveRoom.tsx index fabd3d70b4..e229e4f276 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Leave/MwebLeaveRoom.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/Leave/MwebLeaveRoom.tsx @@ -30,6 +30,7 @@ export const MwebLeaveRoom = ({ const permissions = useHMSStore(selectPermissions); const { isStreamingOn } = useRecordingStreaming(); const showStream = screenType !== 'hls_live_streaming' && isStreamingOn; + const showLeaveOptions = (permissions?.hlsStreaming && isStreamingOn) || permissions?.endRoom; useDropdownList({ open, name: 'LeaveRoom' }); @@ -39,7 +40,7 @@ export const MwebLeaveRoom = ({ return ( - {screenType !== 'hls_live_streaming' ? ( + {showLeaveOptions ? ( - {permissions?.endRoom || permissions?.hlsStreaming ? ( - } - onClick={() => { - setOpen(false); - setShowEndStreamAlert(true); - }} - /> - ) : null} + } + onClick={() => { + setOpen(false); + setShowEndStreamAlert(true); + }} + /> ) : ( - { - if (screenType === 'hls_live_streaming') { - setShowLeaveRoomAlert(true); - } else { - leaveRoom({ endstream: false }); - } - }} - > + setShowLeaveRoomAlert(true)}> @@ -116,13 +105,12 @@ export const MwebLeaveRoom = ({ /> - {screenType === 'hls_live_streaming' ? ( - - - - - - ) : null} + + + + + + ); }; diff --git a/packages/roomkit-react/src/Prebuilt/components/MwebLandscapePrompt.jsx b/packages/roomkit-react/src/Prebuilt/components/MwebLandscapePrompt.jsx index bca4f0e0a9..5725f59228 100644 --- a/packages/roomkit-react/src/Prebuilt/components/MwebLandscapePrompt.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/MwebLandscapePrompt.jsx @@ -20,7 +20,7 @@ export const MwebLandscapePrompt = () => { setShowMwebLandscapePrompt(window.screen.orientation.type.includes('landscape') && isMobile); window.screen.orientation.addEventListener('change', handleOrientationChange); } - return () => window.screen.orientation.removeEventListener(handleOrientationChange); + return () => window.screen.orientation.removeEventListener('change', handleOrientationChange); }, []); return ( diff --git a/packages/roomkit-react/src/Prebuilt/components/RaiseHand.jsx b/packages/roomkit-react/src/Prebuilt/components/RaiseHand.jsx index c8daed0da9..71a85ed1d4 100644 --- a/packages/roomkit-react/src/Prebuilt/components/RaiseHand.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/RaiseHand.jsx @@ -1,22 +1,14 @@ import React from 'react'; -import { selectHasPeerHandRaised, selectLocalPeerID, useHMSActions, useHMSStore } from '@100mslive/react-sdk'; import { HandIcon } from '@100mslive/react-icons'; import { Tooltip } from '../../Tooltip'; import IconButton from '../IconButton'; +import { useMyMetadata } from './hooks/useMetadata'; export const RaiseHand = () => { - const localPeerId = useHMSStore(selectLocalPeerID); - const isHandRaised = useHMSStore(selectHasPeerHandRaised(localPeerId)); - const actions = useHMSActions(); - + const { isHandRaised, toggleHandRaise } = useMyMetadata(); return ( - { - isHandRaised ? actions.lowerLocalPeerHand() : actions.raiseLocalPeerHand(); - }} - > + await toggleHandRaise()}> diff --git a/packages/roomkit-react/src/Prebuilt/components/hooks/useMetadata.jsx b/packages/roomkit-react/src/Prebuilt/components/hooks/useMetadata.jsx index 380aa5b777..0057cfb309 100644 --- a/packages/roomkit-react/src/Prebuilt/components/hooks/useMetadata.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/hooks/useMetadata.jsx @@ -31,12 +31,13 @@ export const useMyMetadata = () => { await hmsActions.lowerLocalPeerHand(); } else { await hmsActions.raiseLocalPeerHand(); + await update({ isBRBOn: false }); } }, [isHandRaised]); //eslint-disable-line const toggleBRB = useCallback(async () => { const newValue = !metaData?.isBRBOn; - await update({ isBRBOn: !metaData?.isBRBOn }); + await update({ isBRBOn: newValue }); if (newValue) { await hmsActions.lowerLocalPeerHand(); }