@100mslive/react-native-room-kit 1.0.7 → 1.0.9

package/src/components/RoomSettingsModalDebugModeContent.tsx

@@ -10,7 +10,6 @@ import {
 } from 'react-native';
 import {
   HMSAudioMixingMode,
-  HMSStreamingState,
   HMSUpdateListenerActions,
   checkNotifications,
 } from '@100mslive/react-native-hms';
@@ -27,6 +26,7 @@ import {
 } from '../redux/actions';
 import { ModalTypes, PipModes } from '../utils/types';
 import { useIsHLSViewer } from '../hooks-util';
+import { useIsHLSStreamingOn } from '../hooks-sdk';
 
 interface RoomSettingsModalDebugModeContentProps {
   newAudioMixingMode: HMSAudioMixingMode;
@@ -60,10 +60,7 @@ export const RoomSettingsModalDebugModeContent: React.FC<
   const localPeerRole = useSelector(
     (state: RootState) => state.hmsStates.localPeer?.role
   );
-  const isHLSStreaming = useSelector(
-    (state: RootState) =>
-      state.hmsStates.room?.hlsStreamingState?.state === HMSStreamingState.STARTED ?? false
-  );
+  const isHLSStreaming = useIsHLSStreamingOn();
 
   const pipModeStatus = useSelector(
     (state: RootState) => state.app.pipModeStatus

package/src/components/WebrtcView.tsx

@@ -1,6 +1,10 @@
 import React, { useMemo } from 'react';
 import { useSelector } from 'react-redux';
-import { SafeAreaView, useSafeAreaFrame, useSafeAreaInsets } from 'react-native-safe-area-context';
+import {
+  SafeAreaView,
+  useSafeAreaFrame,
+  useSafeAreaInsets,
+} from 'react-native-safe-area-context';
 import type { SharedValue } from 'react-native-reanimated';
 import Animated, {
   interpolate,
@@ -100,7 +104,7 @@ export const WebrtcView = React.forwardRef<GridViewRefAttrs, WebrtcViewProps>(
     }
 
     return (
-      <SafeAreaView edges={['left','right']} style={{ flex: 1 }}>
+      <SafeAreaView edges={['left', 'right']} style={{ flex: 1 }}>
         <Animated.View style={headerPlaceholderAnimatedStyles} />
 
         <Animated.View style={animatedStyles}>

package/src/hooks-sdk-selectors.tsx

@@ -1,3 +1,4 @@
+import { HMSStreamingState } from '@100mslive/react-native-hms';
 import type { HMSRole } from '@100mslive/react-native-hms';
 
 import type { RootState } from './redux';
@@ -14,3 +15,21 @@ export const selectCanPublishTrackForRole = (
   role: HMSRole | undefined,
   track: 'audio' | 'video' | 'screen'
 ) => role?.publishSettings?.allowed?.includes(track) ?? false;
+
+export const selectIsHLSStreamingOn = (state: RootState) => {
+  return (
+    state.hmsStates.room?.hlsStreamingState?.state ===
+      HMSStreamingState.STARTED ?? false
+  );
+};
+
+export const selectIsRTMPStreamingOn = (state: RootState) => {
+  return (
+    state.hmsStates.room?.rtmpHMSRtmpStreamingState?.state ===
+      HMSStreamingState.STARTED ?? false
+  );
+};
+
+export const selectIsAnyStreamingOn = (state: RootState) => {
+  return selectIsHLSStreamingOn(state) || selectIsRTMPStreamingOn(state);
+};

package/src/hooks-sdk.ts

@@ -10,9 +10,12 @@ import {
 import {
   selectAllowedTracksToPublish,
   selectCanPublishTrack,
+  selectIsAnyStreamingOn,
+  selectIsHLSStreamingOn,
 } from './hooks-sdk-selectors';
 import { useCallback } from 'react';
 import type { HMSPeer } from '@100mslive/react-native-hms';
+import { HMSRecordingState } from '@100mslive/react-native-hms';
 
 export const useAllowedTracksToPublish = () => {
   return useSelector(selectAllowedTracksToPublish);
@@ -254,3 +257,37 @@ export const useHMSActions = () => {
     setRoomMuteLocally,
   };
 };
+
+export const useIsHLSStreamingOn = () => {
+  return useSelector(selectIsHLSStreamingOn);
+};
+
+export const useIsAnyStreamingOn = () => {
+  return useSelector(selectIsAnyStreamingOn);
+};
+
+export const useIsAnyRecordingOn = () => {
+  return useSelector((state: RootState) => {
+    const room = state.hmsStates.room;
+    return (
+      room?.browserRecordingState?.state === HMSRecordingState.STARTED ||
+      room?.browserRecordingState?.state === HMSRecordingState.RESUMED ||
+      room?.serverRecordingState?.state === HMSRecordingState.STARTED ||
+      room?.serverRecordingState?.state === HMSRecordingState.RESUMED ||
+      room?.hlsRecordingState?.state === HMSRecordingState.STARTED ||
+      room?.hlsRecordingState?.state === HMSRecordingState.RESUMED
+    );
+  });
+};
+
+export const useIsAnyRecordingPaused = () => {
+  const isRecordingPaused = useSelector((state: RootState) => {
+    const room = state.hmsStates.room;
+    return (
+      room?.browserRecordingState?.state === HMSRecordingState.PAUSED ||
+      room?.serverRecordingState?.state === HMSRecordingState.PAUSED ||
+      room?.hlsRecordingState?.state === HMSRecordingState.PAUSED
+    );
+  });
+  return isRecordingPaused;
+};

package/src/hooks-util-selectors.tsx

@@ -3,11 +3,11 @@ import type {
   HLSLiveStreamingScreen,
   Layout,
 } from '@100mslive/types-prebuilt';
-import { HMSStreamingState } from '@100mslive/react-native-hms';
 import type { HMSRole } from '@100mslive/react-native-hms';
 import { JoinForm_JoinBtnType } from '@100mslive/types-prebuilt/elements/join_form';
 
 import type { RootState } from './redux';
+import { selectIsHLSStreamingOn } from './hooks-sdk-selectors';
 
 export const selectIsHLSViewer = (
   role: HMSRole | null | undefined,
@@ -46,8 +46,7 @@ export const selectShouldGoLive = (state: RootState) => {
     currentRole
   );
 
-  const isHLSStreaming =
-    state.hmsStates.room?.hlsStreamingState?.state === HMSStreamingState.STARTED ?? false;
+  const isHLSStreaming = selectIsHLSStreamingOn(state);
 
   const joinButtonType =
     layoutConfig?.screens?.preview?.default?.elements?.join_form