diff --git a/packages/roomkit-react/src/Prebuilt/components/Leave/LeaveRoom.tsx b/packages/roomkit-react/src/Prebuilt/components/Leave/LeaveRoom.tsx index 3965109183..ad4d540591 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Leave/LeaveRoom.tsx +++ b/packages/roomkit-react/src/Prebuilt/components/Leave/LeaveRoom.tsx @@ -1,5 +1,4 @@ import React from 'react'; -import { useNavigate, useParams } from 'react-router-dom'; import { useMedia } from 'react-use'; import { ConferencingScreen } from '@100mslive/types-prebuilt'; import { @@ -15,18 +14,13 @@ import { } from '@100mslive/react-sdk'; import { config as cssConfig } from '../../../Theme'; // @ts-ignore: No implicit Any -import { useHMSPrebuiltContext } from '../../AppContext'; -// @ts-ignore: No implicit Any -import { PictureInPicture } from '../PIP/PIPManager'; // @ts-ignore: No implicit Any import { ToastManager } from '../Toast/ToastManager'; import { DesktopLeaveRoom } from './DesktopLeaveRoom'; import { MwebLeaveRoom } from './MwebLeaveRoom'; -import { useRoomLayoutLeaveScreen } from '../../provider/roomLayoutProvider/hooks/useRoomLayoutScreen'; +import { useRedirectToLeave } from '../hooks/useRedirectToLeave'; export const LeaveRoom = ({ screenType }: { screenType: keyof ConferencingScreen }) => { - const navigate = useNavigate(); - const params = useParams(); const isConnected = useHMSStore(selectIsConnectedToRoom); const permissions = useHMSStore(selectPermissions); const isMobile = useMedia(cssConfig.media.md); @@ -40,8 +34,7 @@ export const LeaveRoom = ({ screenType }: { screenType: keyof ConferencingScreen ); const hlsState = useHMSStore(selectHLSState); const hmsActions = useHMSActions(); - const { onLeave } = useHMSPrebuiltContext(); - const { isLeaveScreenEnabled } = useRoomLayoutLeaveScreen(); + const { redirectToLeave } = useRedirectToLeave(); const stopStream = async () => { try { @@ -54,24 +47,12 @@ export const LeaveRoom = ({ screenType }: { screenType: keyof ConferencingScreen } }; - const redirectToLeavePage = () => { - const prefix = isLeaveScreenEnabled ? '/leave/' : '/'; - if (params.role) { - navigate(prefix + params.roomId + '/' + params.role); - } else { - navigate(prefix + params.roomId); - } - PictureInPicture.stop().catch(() => console.error('stopping pip')); - ToastManager.clearAllToast(); - onLeave?.(); - }; - const leaveRoom = async () => { if (hlsState.running && peersWithStreamingRights.length <= 1) { await stopStream(); } hmsActions.leave(); - redirectToLeavePage(); + redirectToLeave(); }; if (!permissions || !isConnected) { diff --git a/packages/roomkit-react/src/Prebuilt/components/Notifications/Notifications.jsx b/packages/roomkit-react/src/Prebuilt/components/Notifications/Notifications.jsx index cd690216a5..393caaa977 100644 --- a/packages/roomkit-react/src/Prebuilt/components/Notifications/Notifications.jsx +++ b/packages/roomkit-react/src/Prebuilt/components/Notifications/Notifications.jsx @@ -1,6 +1,6 @@ /* eslint-disable no-case-declarations */ import React, { useCallback, useEffect } from 'react'; -import { useNavigate } from 'react-router-dom'; +import { useNavigate, useParams } from 'react-router-dom'; import { HMSNotificationTypes, HMSRoomState, @@ -22,16 +22,18 @@ import { TrackBulkUnmuteModal } from './TrackBulkUnmuteModal'; import { TrackNotifications } from './TrackNotifications'; import { TrackUnmuteModal } from './TrackUnmuteModal'; import { useIsNotificationDisabled, useSubscribedNotifications } from '../AppData/useUISettings'; +import { useRedirectToLeave } from '../hooks/useRedirectToLeave'; import { getMetadata } from '../../common/utils'; import { ROLE_CHANGE_DECLINED } from '../../common/constants'; - export function Notifications() { const notification = useHMSNotifications(); const navigate = useNavigate(); + const params = useParams(); const subscribedNotifications = useSubscribedNotifications() || {}; const roomState = useHMSStore(selectRoomState); const updateRoomLayoutForRole = useUpdateRoomLayout(); const isNotificationDisabled = useIsNotificationDisabled(); + const { redirectToLeave } = useRedirectToLeave(); const handleRoleChangeDenied = useCallback(request => { ToastManager.addToast({ @@ -80,7 +82,7 @@ export function Notifications() {