@100mslive/react-native-room-kit 1.1.5 → 1.1.7

package/lib/commonjs/hooks-util.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useStartRecording = exports.useShowLandscapeLayout = exports.useShowChatAndParticipants = exports.useShouldGoLive = exports.useSetDefaultChatRecipient = exports.useSendMessage = exports.useSavePropsToStore = exports.usePortraitChatViewVisible = exports.usePipAspectRatio = exports.usePIPListener = exports.useOffStageParticipants = exports.useModalType = exports.useLeaveMethods = exports.useLandscapeImmersiveMode = exports.useLandscapeChatViewVisible = exports.useKeyboardState = exports.useIsPeerBlocked = exports.useIsMessagePinned = exports.useIsLocalPeerBlockedFromChat = exports.useIsHLSViewer = exports.useIsAllowedToSendMessage = exports.useHMSSessionStoreListeners = exports.useHMSSessionStore = exports.useHMSRoomTypography = exports.useHMSRoomTheme = exports.useHMSRoomStyleSheet = exports.useHMSRoomStyle = exports.useHMSRoomColorPalette = exports.useHMSRoleChangeRequest = exports.useHMSRemovedFromRoomUpdate = exports.useHMSReconnection = exports.useHMSPIPRoomLeave = exports.useHMSNetworkQualityUpdate = exports.useHMSMessages = exports.useHMSMessagePinningActions = exports.useHMSListeners = exports.useHMSLayoutConfig = exports.useHMSInstance = exports.useHMSConfig = exports.useHMSConferencingScreenConfig = exports.useHMSChatState = exports.useHMSChatRecipientSelector = exports.useHMSChatLayoutConfig = exports.useHMSChangeTrackStateRequest = exports.useHMSCanDisableChat = exports.useHMSActiveSpeakerUpdates = exports.useHLSCuedPolls = exports.useFilteredParticipants = exports.useFetchHMSRoles = exports.useEnableAutoPip = exports.useDisableAutoPip = exports.useBlockPeerActions = exports.useBackButtonPress = exports.useAutoPip = exports.useAndroidSoftInputAdjustResize = exports.useAllowPinningMessage = exports.useAllowBlockingPeerFromChat = exports.isPublishingAllowed = exports.clearPendingModalTasks = exports.clearConfig = void 0;
+exports.useStartRecording = exports.useShowLandscapeLayout = exports.useShowChatAndParticipants = exports.useShouldGoLive = exports.useSetDefaultChatRecipient = exports.useSendMessage = exports.useSavePropsToStore = exports.usePortraitChatViewVisible = exports.usePipAspectRatio = exports.usePIPListener = exports.useOffStageParticipants = exports.useModalType = exports.useLeaveMethods = exports.useLandscapeImmersiveMode = exports.useLandscapeChatViewVisible = exports.useKeyboardState = exports.useIsPeerBlocked = exports.useIsMessagePinned = exports.useIsLocalPeerBlockedFromChat = exports.useIsHLSViewer = exports.useIsAllowedToSendMessage = exports.useHMSSessionStoreListeners = exports.useHMSSessionStore = exports.useHMSRoomTypography = exports.useHMSRoomTheme = exports.useHMSRoomStyleSheet = exports.useHMSRoomStyle = exports.useHMSRoomColorPalette = exports.useHMSRoleChangeRequest = exports.useHMSRemovedFromRoomUpdate = exports.useHMSReconnection = exports.useHMSPIPRoomLeave = exports.useHMSNetworkQualityUpdate = exports.useHMSMessages = exports.useHMSMessagePinningActions = exports.useHMSListeners = exports.useHMSLayoutConfig = exports.useHMSInstance = exports.useHMSConfig = exports.useHMSConferencingScreenConfig = exports.useHMSChatState = exports.useHMSChatRecipientSelector = exports.useHMSChatLayoutConfig = exports.useHMSChangeTrackStateRequest = exports.useHMSCanDisableChat = exports.useHMSActiveSpeakerUpdates = exports.useHLSViewsConstraints = exports.useHLSStreamResumePause = exports.useHLSPlayerConstraints = exports.useHLSCuedPolls = exports.useFilteredParticipants = exports.useFetchHMSRoles = exports.useEnableAutoPip = exports.useDisableAutoPip = exports.useCanShowRoomOptionsButton = exports.useBlockPeerActions = exports.useBackButtonPress = exports.useAutoPip = exports.useAndroidSoftInputAdjustResize = exports.useAllowPinningMessage = exports.useAllowBlockingPeerFromChat = exports.isPublishingAllowed = exports.clearPendingModalTasks = exports.clearConfig = void 0;
 var _reactNativeHms = require("@100mslive/react-native-hms");
 var _reactNativeSimpleToast = _interopRequireDefault(require("react-native-simple-toast"));
 var _react = require("react");
@@ -21,6 +21,7 @@ var _HMSManager = require("./modules/HMSManager");
 var _theme = require("./utils/theme");
 var _reactNativeReanimated = require("react-native-reanimated");
 var _hooksSdk = require("./hooks-sdk");
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const useHMSListeners = setPeerTrackNodes => {
   const hmsInstance = useHMSInstance();
@@ -678,7 +679,7 @@ const useHMSSessionStoreListeners = gridViewRef => {
               spotlightTrackId: id
             }));
             // Scroll to start of the list
-            (_gridViewRef$current = gridViewRef.current) === null || _gridViewRef$current === void 0 || (_gridViewRef$current = _gridViewRef$current.getRegularTilesFlatlistRef().current) === null || _gridViewRef$current === void 0 || _gridViewRef$current.scrollToOffset({
+            gridViewRef === null || gridViewRef === void 0 || (_gridViewRef$current = gridViewRef.current) === null || _gridViewRef$current === void 0 || (_gridViewRef$current = _gridViewRef$current.getRegularTilesFlatlistRef().current) === null || _gridViewRef$current === void 0 || _gridViewRef$current.scrollToOffset({
               animated: true,
               offset: 0
             });
@@ -1237,6 +1238,7 @@ const useHMSConfig = () => {
 };
 exports.useHMSConfig = useHMSConfig;
 const useShowChatAndParticipants = () => {
+  const isHLSViewer = useIsHLSViewer();
   const dispatch = (0, _reactRedux.useDispatch)();
   const {
     modalVisibleType,
@@ -1245,7 +1247,7 @@ const useShowChatAndParticipants = () => {
   const overlayChatLayout = useHMSChatLayoutConfig(chatConfig => chatConfig === null || chatConfig === void 0 ? void 0 : chatConfig.is_overlay);
   const canShowChat = useHMSConferencingScreenConfig(conferencingScreenConfig => {
     var _conferencingScreenCo2;
-    return !!(conferencingScreenConfig !== null && conferencingScreenConfig !== void 0 && (_conferencingScreenCo2 = conferencingScreenConfig.elements) !== null && _conferencingScreenCo2 !== void 0 && _conferencingScreenCo2.chat);
+    return !!(conferencingScreenConfig !== null && conferencingScreenConfig !== void 0 && (_conferencingScreenCo2 = conferencingScreenConfig.elements) !== null && _conferencingScreenCo2 !== void 0 && _conferencingScreenCo2.chat) && !isHLSViewer;
   });
   const canShowParticipants = useHMSConferencingScreenConfig(conferencingScreenConfig => {
     var _conferencingScreenCo3;
@@ -1757,13 +1759,14 @@ const useBackButtonPress = () => {
 };
 exports.useBackButtonPress = useBackButtonPress;
 const useLandscapeImmersiveMode = () => {
+  const isHLSViewer = useIsHLSViewer();
   const isLandscapeOrientation = (0, _dimension.useIsLandscapeOrientation)();
   (0, _react.useEffect)(() => {
-    if (isLandscapeOrientation) {
+    if (!isHLSViewer && isLandscapeOrientation) {
       _reactNativeHms.WindowController.hideSystemBars();
       return _reactNativeHms.WindowController.showSystemBars;
     }
-  }, [isLandscapeOrientation]);
+  }, [isHLSViewer, isLandscapeOrientation]);
 };
 exports.useLandscapeImmersiveMode = useLandscapeImmersiveMode;
 const useHLSCuedPolls = () => {
@@ -2151,4 +2154,152 @@ const useAllowBlockingPeerFromChat = () => {
   });
 };
 exports.useAllowBlockingPeerFromChat = useAllowBlockingPeerFromChat;
+const useCanShowRoomOptionsButton = () => {
+  const canPublishAudio = (0, _hooksSdk.useCanPublishAudio)();
+  const canPublishVideo = (0, _hooksSdk.useCanPublishVideo)();
+  const canPublishScreen = (0, _hooksSdk.useCanPublishScreen)();
+  const isViewer = !(canPublishAudio || canPublishVideo || canPublishScreen);
+  const editUsernameDisabled = (0, _reactRedux.useSelector)(state => state.app.editUsernameDisabled);
+  const [isNoiseCancellationAvailable, setIsNoiseCancellationAvailable] = (0, _react.useState)(false);
+  const noiseCancellationPlugin = (0, _reactRedux.useSelector)(state => state.hmsStates.noiseCancellationPlugin);
+  (0, _react.useEffect)(() => {
+    if (noiseCancellationPlugin) {
+      let mounted = true;
+      noiseCancellationPlugin.isNoiseCancellationAvailable().then(isAvailable => {
+        if (mounted) {
+          setIsNoiseCancellationAvailable(isAvailable);
+        }
+      });
+      return () => {
+        mounted = false;
+      };
+    }
+  }, [noiseCancellationPlugin]);
+  const canShowBRB = useHMSLayoutConfig(layoutConfig => {
+    var _layoutConfig$screens3;
+    return !!(layoutConfig !== null && layoutConfig !== void 0 && (_layoutConfig$screens3 = layoutConfig.screens) !== null && _layoutConfig$screens3 !== void 0 && (_layoutConfig$screens3 = _layoutConfig$screens3.conferencing) !== null && _layoutConfig$screens3 !== void 0 && (_layoutConfig$screens3 = _layoutConfig$screens3.default) !== null && _layoutConfig$screens3 !== void 0 && (_layoutConfig$screens3 = _layoutConfig$screens3.elements) !== null && _layoutConfig$screens3 !== void 0 && _layoutConfig$screens3.brb);
+  });
+  const canStartRecording = (0, _reactRedux.useSelector)(state => {
+    var _state$hmsStates$loca9;
+    return !!((_state$hmsStates$loca9 = state.hmsStates.localPeer) !== null && _state$hmsStates$loca9 !== void 0 && (_state$hmsStates$loca9 = _state$hmsStates$loca9.role) !== null && _state$hmsStates$loca9 !== void 0 && (_state$hmsStates$loca9 = _state$hmsStates$loca9.permissions) !== null && _state$hmsStates$loca9 !== void 0 && _state$hmsStates$loca9.browserRecording);
+  });
+  const canReadOrWritePoll = (0, _reactRedux.useSelector)(state => {
+    var _state$hmsStates$loca10;
+    const permissions = (_state$hmsStates$loca10 = state.hmsStates.localPeer) === null || _state$hmsStates$loca10 === void 0 || (_state$hmsStates$loca10 = _state$hmsStates$loca10.role) === null || _state$hmsStates$loca10 === void 0 ? void 0 : _state$hmsStates$loca10.permissions;
+    return (permissions === null || permissions === void 0 ? void 0 : permissions.pollRead) || (permissions === null || permissions === void 0 ? void 0 : permissions.pollWrite);
+  });
+  const {
+    canShowParticipants
+  } = useShowChatAndParticipants();
+  const canEditUsernameFromRoomModal = isViewer && !editUsernameDisabled;
+  const canShowOptions = canShowParticipants || canPublishScreen || canShowBRB || canStartRecording || canEditUsernameFromRoomModal || canReadOrWritePoll || isNoiseCancellationAvailable;
+  return canShowOptions;
+};
+exports.useCanShowRoomOptionsButton = useCanShowRoomOptionsButton;
+const useHLSViewsConstraints = () => {
+  const hlsFullScreen = (0, _reactRedux.useSelector)(state => state.app.hlsFullScreen);
+  const isLandscapeOrientation = (0, _dimension.useIsLandscapeOrientation)();
+  const {
+    width: safeAreaWidthFrame,
+    height: safeAreaHeightFrame
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaFrame)();
+  const {
+    top: topInset,
+    bottom: bottomInset,
+    left: leftInset,
+    right: rightInset
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  const playerWrapperConstraints = hlsFullScreen ? {
+    width: safeAreaWidthFrame - leftInset - rightInset,
+    height: isLandscapeOrientation ? safeAreaHeightFrame : safeAreaHeightFrame - topInset - bottomInset
+  } : {
+    width: isLandscapeOrientation ? (safeAreaWidthFrame - leftInset - rightInset) * 0.6 : safeAreaWidthFrame,
+    height: isLandscapeOrientation ? safeAreaHeightFrame : safeAreaWidthFrame * 9 / 16
+  };
+  const chatWrapperConstraints = {
+    width: isLandscapeOrientation ? safeAreaWidthFrame - playerWrapperConstraints.width - leftInset : playerWrapperConstraints.width,
+    height: isLandscapeOrientation ? playerWrapperConstraints.height : safeAreaHeightFrame - playerWrapperConstraints.height - topInset
+  };
+  const descriptionPaneConstraints = chatWrapperConstraints;
+  return {
+    playerWrapperConstraints,
+    chatWrapperConstraints,
+    descriptionPaneConstraints
+  };
+};
+exports.useHLSViewsConstraints = useHLSViewsConstraints;
+const useHLSPlayerConstraints = () => {
+  const hlsFullScreen = (0, _reactRedux.useSelector)(state => state.app.hlsFullScreen);
+  const isLandscapeOrientation = (0, _dimension.useIsLandscapeOrientation)();
+  const resolution = (0, _reactNativeHms.useHMSHLSPlayerResolution)();
+  const {
+    playerWrapperConstraints
+  } = useHLSViewsConstraints();
+  const wrapperWidth = playerWrapperConstraints.width;
+  const wrapperHeight = playerWrapperConstraints.height;
+  if (!resolution) {
+    return {
+      width: wrapperWidth,
+      height: wrapperHeight
+    };
+  }
+  const sr = resolution.width / resolution.height; // stream width/height ratio
+  const wr = wrapperWidth / wrapperHeight; // Wrapper width/height ratio
+
+  /**
+   * Handling Landscape Orientation for both Full and Normal screen
+   */
+  if (isLandscapeOrientation) {
+    return sr > wr ? {
+      width: wrapperWidth,
+      height: wrapperWidth / sr
+    } : {
+      width: sr * wrapperHeight,
+      height: wrapperHeight
+    };
+  }
+
+  /**
+   * Handling Portrait Orientation
+   */
+  if (hlsFullScreen) {
+    return {
+      width: sr > wr ? wrapperWidth : wrapperHeight * sr,
+      height: sr > wr ? wrapperWidth / sr : wrapperHeight
+    };
+  }
+  return {
+    width: wrapperHeight * sr,
+    height: wrapperHeight
+  };
+};
+exports.useHLSPlayerConstraints = useHLSPlayerConstraints;
+const useHLSStreamResumePause = playerRef => {
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const isPaused = _reactNative.Platform.select({
+    android: (0, _reactRedux.useSelector)(state => state.app.hlsStreamPaused_android),
+    ios: (0, _reactNativeHms.useHMSHLSPlayerPlaybackState)() === _reactNativeHms.HMSHLSPlayerPlaybackState.PAUSED,
+    default: false
+  });
+  const resumeStream = (0, _react.useCallback)(() => {
+    var _playerRef$current;
+    (_playerRef$current = playerRef.current) === null || _playerRef$current === void 0 || _playerRef$current.resume();
+    if (_reactNative.Platform.OS === 'android') {
+      dispatch((0, _actions.setAndroidHLSStreamPaused)(false));
+    }
+  }, []);
+  const pauseStream = (0, _react.useCallback)(() => {
+    var _playerRef$current2;
+    (_playerRef$current2 = playerRef.current) === null || _playerRef$current2 === void 0 || _playerRef$current2.pause();
+    if (_reactNative.Platform.OS === 'android') {
+      dispatch((0, _actions.setAndroidHLSStreamPaused)(true));
+    }
+  }, []);
+  return {
+    isPaused,
+    resumeStream,
+    pauseStream
+  };
+};
+exports.useHLSStreamResumePause = useHLSStreamResumePause;
 //# sourceMappingURL=hooks-util.js.map