@100mslive/react-native-room-kit 0.0.1

package/lib/commonjs/hooks-util.js

@@ -0,0 +1,792 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useShowLandscapeLayout = exports.useShowChat = exports.useSafeDimensions = exports.usePortraitChatViewVisible = exports.usePIPListener = exports.useModalType = exports.useLandscapeChatViewVisible = exports.useIsHLSViewer = exports.useHMSSessionStoreListeners = exports.useHMSSessionStore = exports.useHMSRoleChangeRequest = exports.useHMSRemovedFromRoomUpdate = exports.useHMSPIPRoomLeave = exports.useHMSMessages = exports.useHMSListeners = exports.useHMSInstance = exports.useHMSConfig = exports.useHMSChangeTrackStateRequest = exports.useFilteredParticipants = exports.useFetchHMSRoles = 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");
+var _types = require("./utils/types");
+var _functions = require("./utils/functions");
+var _reactRedux = require("react-redux");
+var _actions = require("./redux/actions");
+var _peerTrackNodeUtils = require("./peerTrackNodeUtils");
+var _types2 = require("./types");
+var _reactNative = require("react-native");
+var _native = require("@react-navigation/native");
+var _dimension = require("./utils/dimension");
+var _reactNativeSafeAreaContext = require("react-native-safe-area-context");
+var _hooksUtilSelectors = require("./hooks-util-selectors");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const useHMSListeners = (setPeerTrackNodes, setMeetingState) => {
+  const hmsInstance = useHMSInstance();
+  const updateLocalPeer = useUpdateHMSLocalPeer(hmsInstance);
+  useHMSRoomUpdate(hmsInstance, setMeetingState);
+
+  // useHMSPeersUpdate(hmsInstance, updateLocalPeer, setPeerTrackNodes);
+
+  useHMSTrackUpdate(hmsInstance, updateLocalPeer, setPeerTrackNodes);
+};
+exports.useHMSListeners = useHMSListeners;
+const useHMSRoomUpdate = (hmsInstance, setMeetingState) => {
+  const dispatch = (0, _reactRedux.useDispatch)();
+  (0, _react.useEffect)(() => {
+    const roomUpdateHandler = data => {
+      var _room$localPeer$role;
+      const {
+        room,
+        type
+      } = data;
+      dispatch((0, _actions.setHMSRoomState)(room));
+
+      /**
+       * Handle case when User is joining as HLSViewer,
+       * before ON_JOIN, if ON_ROOM comes then we can show Meeting screen to user, instead of Loader or Preview
+       */
+      if (((_room$localPeer$role = room.localPeer.role) === null || _room$localPeer$role === void 0 || (_room$localPeer$role = _room$localPeer$role.name) === null || _room$localPeer$role === void 0 ? void 0 : _room$localPeer$role.includes('hls-')) ?? false) {
+        dispatch((0, _actions.setHMSLocalPeerState)(room.localPeer));
+        setMeetingState(prevMeetingScreen => {
+          if (prevMeetingScreen !== _types2.MeetingState.IN_MEETING) {
+            return _types2.MeetingState.IN_MEETING;
+          }
+          return prevMeetingScreen;
+        });
+      }
+      if (type === _reactNativeHms.HMSRoomUpdate.BROWSER_RECORDING_STATE_UPDATED) {
+        var _room$browserRecordin, _room$browserRecordin2;
+        let streaming = room === null || room === void 0 || (_room$browserRecordin = room.browserRecordingState) === null || _room$browserRecordin === void 0 ? void 0 : _room$browserRecordin.running;
+        const startAtDate = room === null || room === void 0 || (_room$browserRecordin2 = room.browserRecordingState) === null || _room$browserRecordin2 === void 0 ? void 0 : _room$browserRecordin2.startedAt;
+        let startTime = null;
+        if (startAtDate) {
+          var _startAtDate$getMinut;
+          let hours = startAtDate.getHours().toString();
+          let minutes = (_startAtDate$getMinut = startAtDate.getMinutes()) === null || _startAtDate$getMinut === void 0 ? void 0 : _startAtDate$getMinut.toString();
+          startTime = hours + ':' + minutes;
+        }
+        _reactNativeSimpleToast.default.showWithGravity(`Browser Recording ${streaming ? `Started ${startTime ? 'At ' + startTime : ''}` : 'Stopped'}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+      } else if (type === _reactNativeHms.HMSRoomUpdate.HLS_STREAMING_STATE_UPDATED) {
+        var _room$hlsStreamingSta;
+        let streaming = room === null || room === void 0 || (_room$hlsStreamingSta = room.hlsStreamingState) === null || _room$hlsStreamingSta === void 0 ? void 0 : _room$hlsStreamingSta.running;
+        _reactNativeSimpleToast.default.showWithGravity(`HLS Streaming ${streaming ? 'Started' : 'Stopped'}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+      } else if (type === _reactNativeHms.HMSRoomUpdate.RTMP_STREAMING_STATE_UPDATED) {
+        var _room$rtmpHMSRtmpStre, _room$rtmpHMSRtmpStre2;
+        let streaming = room === null || room === void 0 || (_room$rtmpHMSRtmpStre = room.rtmpHMSRtmpStreamingState) === null || _room$rtmpHMSRtmpStre === void 0 ? void 0 : _room$rtmpHMSRtmpStre.running;
+        const startAtDate = room === null || room === void 0 || (_room$rtmpHMSRtmpStre2 = room.rtmpHMSRtmpStreamingState) === null || _room$rtmpHMSRtmpStre2 === void 0 ? void 0 : _room$rtmpHMSRtmpStre2.startedAt;
+        let startTime = null;
+        if (startAtDate) {
+          var _startAtDate$getMinut2;
+          let hours = startAtDate.getHours().toString();
+          let minutes = (_startAtDate$getMinut2 = startAtDate.getMinutes()) === null || _startAtDate$getMinut2 === void 0 ? void 0 : _startAtDate$getMinut2.toString();
+          startTime = hours + ':' + minutes;
+        }
+        _reactNativeSimpleToast.default.showWithGravity(`RTMP Streaming ${streaming ? `Started ${startTime ? 'At ' + startTime : ''}` : 'Stopped'}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+      } else if (type === _reactNativeHms.HMSRoomUpdate.SERVER_RECORDING_STATE_UPDATED) {
+        var _room$serverRecording, _room$serverRecording2;
+        let streaming = room === null || room === void 0 || (_room$serverRecording = room.serverRecordingState) === null || _room$serverRecording === void 0 ? void 0 : _room$serverRecording.running;
+        const startAtDate = room === null || room === void 0 || (_room$serverRecording2 = room.serverRecordingState) === null || _room$serverRecording2 === void 0 ? void 0 : _room$serverRecording2.startedAt;
+        let startTime = null;
+        if (startAtDate) {
+          var _startAtDate$getMinut3;
+          let hours = startAtDate.getHours().toString();
+          let minutes = (_startAtDate$getMinut3 = startAtDate.getMinutes()) === null || _startAtDate$getMinut3 === void 0 ? void 0 : _startAtDate$getMinut3.toString();
+          startTime = hours + ':' + minutes;
+        }
+        _reactNativeSimpleToast.default.showWithGravity(`Server Recording ${streaming ? `Started ${startTime ? 'At ' + startTime : ''}` : 'Stopped'}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+      }
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_ROOM_UPDATE, roomUpdateHandler);
+    return () => {
+      hmsInstance.removeEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_ROOM_UPDATE);
+    };
+  }, [hmsInstance]);
+};
+
+// type PeerUpdate = {
+//   peer: HMSPeer;
+//   type: HMSPeerUpdate;
+// };
+
+// const useHMSPeersUpdate = (
+//   hmsInstance: HMSSDK,
+//   updateLocalPeer: () => void,
+//   setPeerTrackNodes: React.Dispatch<React.SetStateAction<PeerTrackNode[]>>
+// ) => {
+//   useHMSPeerUpdates(
+//     ({ peer, type }: PeerUpdate) => {
+//       if (type === HMSPeerUpdate.PEER_JOINED) {
+//         return;
+//       }
+//       if (type === HMSPeerUpdate.PEER_LEFT) {
+//         setPeerTrackNodes((prevPeerTrackNodes) =>
+//           removePeerTrackNodes(prevPeerTrackNodes, peer)
+//         );
+//         return;
+//       }
+//       if (peer.isLocal) {
+//         setPeerTrackNodes((prevPeerTrackNodes) => {
+//           if (peerTrackNodeExistForPeer(prevPeerTrackNodes, peer)) {
+//             return replacePeerTrackNodes(prevPeerTrackNodes, peer);
+//           }
+//           return prevPeerTrackNodes;
+//         });
+
+//         // - TODO: update local localPeer state
+//         // - Pass this updated data to Meeting component -> DisplayView component
+//         updateLocalPeer();
+//         return;
+//       }
+//       if (type === HMSPeerUpdate.ROLE_CHANGED) {
+//         if (
+//           peer.role?.publishSettings?.allowed === undefined ||
+//           (peer.role?.publishSettings?.allowed &&
+//             peer.role?.publishSettings?.allowed.length < 1)
+//         ) {
+//           setPeerTrackNodes((prevPeerTrackNodes) => {
+//             if (peerTrackNodeExistForPeer(prevPeerTrackNodes, peer)) {
+//               return removePeerTrackNodes(prevPeerTrackNodes, peer);
+//             }
+//             return prevPeerTrackNodes;
+//           });
+//         }
+//         return;
+//       }
+//       if (
+//         type === HMSPeerUpdate.METADATA_CHANGED ||
+//         type === HMSPeerUpdate.NAME_CHANGED ||
+//         type === HMSPeerUpdate.NETWORK_QUALITY_UPDATED
+//       ) {
+//         setPeerTrackNodes((prevPeerTrackNodes) => {
+//           if (peerTrackNodeExistForPeer(prevPeerTrackNodes, peer)) {
+//             return replacePeerTrackNodes(prevPeerTrackNodes, peer);
+//           }
+//           return prevPeerTrackNodes;
+//         });
+//         return;
+//       }
+//     },
+//     [hmsInstance]
+//   );
+// };
+const useHMSTrackUpdate = (hmsInstance, updateLocalPeer, setPeerTrackNodes) => {
+  const dispatch = (0, _reactRedux.useDispatch)();
+  (0, _react.useEffect)(() => {
+    const trackUpdateHandler = _ref => {
+      let {
+        peer,
+        track,
+        type
+      } = _ref;
+      if (type === _reactNativeHms.HMSTrackUpdate.TRACK_ADDED) {
+        setPeerTrackNodes(prevPeerTrackNodes => {
+          if ((0, _peerTrackNodeUtils.peerTrackNodeExistForPeerAndTrack)(prevPeerTrackNodes, peer, track)) {
+            if (track.type === _reactNativeHms.HMSTrackType.VIDEO) {
+              return (0, _peerTrackNodeUtils.replacePeerTrackNodesWithTrack)(prevPeerTrackNodes, peer, track);
+            }
+            return (0, _peerTrackNodeUtils.replacePeerTrackNodes)(prevPeerTrackNodes, peer);
+          }
+          const newPeerTrackNode = (0, _functions.createPeerTrackNode)(peer, track);
+          return [...prevPeerTrackNodes, newPeerTrackNode];
+        });
+
+        // - TODO: update local localPeer state
+        // - Pass this updated data to Meeting component -> DisplayView component
+        if (peer.isLocal) {
+          updateLocalPeer();
+        }
+        return;
+      }
+      if (type === _reactNativeHms.HMSTrackUpdate.TRACK_REMOVED) {
+        var _peer$audioTrack, _peer$videoTrack;
+        if (track.source !== _reactNativeHms.HMSTrackSource.REGULAR || ((_peer$audioTrack = peer.audioTrack) === null || _peer$audioTrack === void 0 ? void 0 : _peer$audioTrack.trackId) === undefined && ((_peer$videoTrack = peer.videoTrack) === null || _peer$videoTrack === void 0 ? void 0 : _peer$videoTrack.trackId) === undefined) {
+          setPeerTrackNodes(prevPeerTrackNodes => (0, _peerTrackNodeUtils.removePeerTrackNodesWithTrack)(prevPeerTrackNodes, peer, track));
+        }
+
+        // - TODO: update local localPeer state
+        // - Pass this updated data to Meeting component -> DisplayView component
+        if (peer.isLocal) {
+          updateLocalPeer();
+        }
+        return;
+      }
+      if (type === _reactNativeHms.HMSTrackUpdate.TRACK_MUTED || type === _reactNativeHms.HMSTrackUpdate.TRACK_UNMUTED) {
+        // - TODO: update local mute states
+        // - Pass this updated data to Meeting component -> DisplayView component
+        if (peer.isLocal) {
+          if (track.type === _reactNativeHms.HMSTrackType.AUDIO) {
+            dispatch((0, _actions.setIsLocalAudioMutedState)(track.isMute()));
+          } else if (track.type === _reactNativeHms.HMSTrackType.VIDEO) {
+            dispatch((0, _actions.setIsLocalVideoMutedState)(track.isMute()));
+          }
+        }
+        setPeerTrackNodes(prevPeerTrackNodes => {
+          if ((0, _peerTrackNodeUtils.peerTrackNodeExistForPeerAndTrack)(prevPeerTrackNodes, peer, track)) {
+            if (track.type === _reactNativeHms.HMSTrackType.VIDEO) {
+              return (0, _peerTrackNodeUtils.replacePeerTrackNodesWithTrack)(prevPeerTrackNodes, peer, track);
+            }
+            return (0, _peerTrackNodeUtils.replacePeerTrackNodes)(prevPeerTrackNodes, peer);
+          }
+          return prevPeerTrackNodes;
+        });
+
+        // - TODO: update local localPeer state
+        // - Pass this updated data to Meeting component -> DisplayView component
+        if (peer.isLocal) {
+          updateLocalPeer();
+        }
+        return;
+      }
+      if (type === _reactNativeHms.HMSTrackUpdate.TRACK_RESTORED || type === _reactNativeHms.HMSTrackUpdate.TRACK_DEGRADED) {
+        setPeerTrackNodes(prevPeerTrackNodes => {
+          if ((0, _peerTrackNodeUtils.peerTrackNodeExistForPeerAndTrack)(prevPeerTrackNodes, peer, track)) {
+            return (0, _peerTrackNodeUtils.degradeOrRestorePeerTrackNodes)(prevPeerTrackNodes, peer, track, type === _reactNativeHms.HMSTrackUpdate.TRACK_DEGRADED);
+          }
+          return prevPeerTrackNodes;
+        });
+        return;
+      }
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_TRACK_UPDATE, trackUpdateHandler);
+    return () => {
+      hmsInstance.removeEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_TRACK_UPDATE);
+    };
+  }, [hmsInstance]);
+};
+const useUpdateHMSLocalPeer = hmsInstance => {
+  const mountRef = (0, _react.useRef)(false);
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const updateLocalPeer = (0, _react.useCallback)(() => {
+    hmsInstance.getLocalPeer().then(latestLocalPeer => {
+      if (mountRef.current) {
+        dispatch((0, _actions.setHMSLocalPeerState)(latestLocalPeer));
+      }
+    });
+  }, [hmsInstance]);
+  (0, _react.useEffect)(() => {
+    mountRef.current = true;
+    updateLocalPeer();
+    return () => {
+      mountRef.current = false;
+    };
+  }, [updateLocalPeer]);
+  return updateLocalPeer;
+};
+const useHMSInstance = () => {
+  const hmsInstance = (0, _reactRedux.useSelector)(state => state.user.hmsInstance);
+  if (!hmsInstance) {
+    throw new Error('HMS Instance not available');
+  }
+  return hmsInstance;
+};
+exports.useHMSInstance = useHMSInstance;
+const useIsHLSViewer = () => {
+  return (0, _reactRedux.useSelector)(state => (0, _hooksUtilSelectors.selectIsHLSViewer)(state.hmsStates.localPeer));
+};
+exports.useIsHLSViewer = useIsHLSViewer;
+const useHMSChangeTrackStateRequest = (callback, deps) => {
+  const hmsInstance = useHMSInstance();
+  const [trackStateChangeRequest, setTrackStateChangeRequest] = (0, _react.useState)(null);
+  (0, _react.useEffect)(() => {
+    const changeTrackStateRequestHandler = request => {
+      if (!(request !== null && request !== void 0 && request.mute)) {
+        var _request$requestedBy;
+        setTrackStateChangeRequest({
+          requestedBy: request === null || request === void 0 || (_request$requestedBy = request.requestedBy) === null || _request$requestedBy === void 0 ? void 0 : _request$requestedBy.name,
+          suggestedRole: request === null || request === void 0 ? void 0 : request.trackType
+        });
+        callback === null || callback === void 0 ? void 0 : callback(request);
+      } else {
+        var _request$requestedBy2;
+        _reactNativeSimpleToast.default.showWithGravity(`Track Muted: ${request === null || request === void 0 || (_request$requestedBy2 = request.requestedBy) === null || _request$requestedBy2 === void 0 ? void 0 : _request$requestedBy2.name} Muted Your ${request === null || request === void 0 ? void 0 : request.trackType}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+      }
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_CHANGE_TRACK_STATE_REQUEST, changeTrackStateRequestHandler);
+    return () => {
+      hmsInstance.removeEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_CHANGE_TRACK_STATE_REQUEST);
+    };
+  }, [...(deps || []), hmsInstance]);
+  return trackStateChangeRequest;
+};
+exports.useHMSChangeTrackStateRequest = useHMSChangeTrackStateRequest;
+const useHMSRoleChangeRequest = (callback, deps) => {
+  const hmsInstance = useHMSInstance();
+  const [roleChangeRequest, setRoleChangeRequest] = (0, _react.useState)(null);
+  (0, _react.useEffect)(() => {
+    const changeRoleRequestHandler = request => {
+      var _request$requestedBy3, _request$suggestedRol;
+      setRoleChangeRequest({
+        requestedBy: request === null || request === void 0 || (_request$requestedBy3 = request.requestedBy) === null || _request$requestedBy3 === void 0 ? void 0 : _request$requestedBy3.name,
+        suggestedRole: request === null || request === void 0 || (_request$suggestedRol = request.suggestedRole) === null || _request$suggestedRol === void 0 ? void 0 : _request$suggestedRol.name
+      });
+      callback === null || callback === void 0 ? void 0 : callback(request);
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_ROLE_CHANGE_REQUEST, changeRoleRequestHandler);
+    return () => {
+      hmsInstance.removeEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_ROLE_CHANGE_REQUEST);
+    };
+  }, [...(deps || []), hmsInstance]);
+  return roleChangeRequest;
+};
+exports.useHMSRoleChangeRequest = useHMSRoleChangeRequest;
+const useHMSSessionStoreListeners = () => {
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const hmsSessionStore = (0, _reactRedux.useSelector)(state => state.user.hmsSessionStore);
+  const sessionStoreListenersRef = (0, _react.useRef)([]);
+  (0, _react.useEffect)(() => {
+    // Check if instance of HMSSessionStore is available
+    if (hmsSessionStore) {
+      let toastTimeoutId = null;
+      const addSessionStoreListeners = () => {
+        // Handle 'spotlight' key values
+        const handleSpotlightIdChange = id => {
+          // set value to the state to rerender the component to reflect changes
+          dispatch((0, _actions.saveUserData)({
+            spotlightTrackId: id
+          }));
+        };
+
+        // Handle 'pinnedMessage' key values
+        const handlePinnedMessageChange = data => {
+          dispatch((0, _actions.addPinnedMessage)(data));
+        };
+
+        // Getting value for 'spotlight' key by using `get` method on HMSSessionStore instance
+        hmsSessionStore.get('spotlight').then(data => {
+          console.log('Session Store get `spotlight` key value success: ', data);
+          handleSpotlightIdChange(data);
+        }).catch(error => console.log('Session Store get `spotlight` key value error: ', error));
+
+        // Getting value for 'pinnedMessage' key by using `get` method on HMSSessionStore instance
+        hmsSessionStore.get('pinnedMessage').then(data => {
+          console.log('Session Store get `pinnedMessage` key value success: ', data);
+          handlePinnedMessageChange(data);
+        }).catch(error => console.log('Session Store get `pinnedMessage` key value error: ', error));
+        let lastSpotlightValue = null;
+        let lastPinnedMessageValue = null;
+
+        // Add subscription for `spotlight` & `pinnedMessage` keys updates on Session Store
+        const subscription = hmsSessionStore.addKeyChangeListener(['spotlight', 'pinnedMessage'], (error, data) => {
+          // If error occurs, handle error and return early
+          if (error !== null) {
+            console.log('`spotlight` & `pinnedMessage` key listener Error -> ', error);
+            return;
+          }
+
+          // If no error, handle data
+          if (data !== null) {
+            switch (data.key) {
+              case 'spotlight':
+                {
+                  handleSpotlightIdChange(data.value);
+
+                  // Showing Toast message if value has actually changed
+                  if (data.value !== lastSpotlightValue && (data.value || lastSpotlightValue)) {
+                    _reactNativeSimpleToast.default.showWithGravity(`SessionStore: \`spotlight\` key's value changed to ${data.value}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+                  }
+                  lastSpotlightValue = data.value;
+                  break;
+                }
+              case 'pinnedMessage':
+                {
+                  handlePinnedMessageChange(data.value);
+
+                  // Showing Toast message if value has actually changed
+                  if (data.value !== lastPinnedMessageValue && (data.value || lastPinnedMessageValue)) {
+                    if (toastTimeoutId !== null) {
+                      clearTimeout(toastTimeoutId);
+                    }
+                    toastTimeoutId = setTimeout(() => {
+                      _reactNativeSimpleToast.default.showWithGravity(`SessionStore: \`pinnedMessage\` key's value changed to ${data.value}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+                    }, 1500);
+                  }
+                  lastPinnedMessageValue = data.value;
+                  break;
+                }
+            }
+          }
+        });
+
+        // Save reference of `subscription` in a ref
+        sessionStoreListenersRef.current.push(subscription);
+      };
+      addSessionStoreListeners();
+      return () => {
+        // remove Session Store key update listener on cleanup
+        sessionStoreListenersRef.current.forEach(listener => listener.remove());
+        if (toastTimeoutId !== null) clearTimeout(toastTimeoutId);
+      };
+    }
+  }, [hmsSessionStore]);
+};
+exports.useHMSSessionStoreListeners = useHMSSessionStoreListeners;
+const useHMSSessionStore = () => {
+  const hmsInstance = useHMSInstance();
+  const dispatch = (0, _reactRedux.useDispatch)();
+  (0, _react.useEffect)(() => {
+    const onSessionStoreAvailableListener = _ref2 => {
+      let {
+        sessionStore
+      } = _ref2;
+      // Saving `sessionStore` reference in `redux`
+      dispatch((0, _actions.saveUserData)({
+        hmsSessionStore: sessionStore
+      }));
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_SESSION_STORE_AVAILABLE, onSessionStoreAvailableListener);
+    return () => {
+      hmsInstance.removeEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_SESSION_STORE_AVAILABLE);
+    };
+  }, [hmsInstance]);
+};
+exports.useHMSSessionStore = useHMSSessionStore;
+const useHMSMessages = () => {
+  const hmsInstance = useHMSInstance();
+  const dispatch = (0, _reactRedux.useDispatch)();
+  (0, _react.useEffect)(() => {
+    const onMessageListener = message => {
+      dispatch((0, _actions.addMessage)(message));
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_MESSAGE, onMessageListener);
+    return () => {
+      // TODO: Remove this listener when user leaves, removed or room is ended
+      hmsInstance.removeEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_MESSAGE);
+    };
+  }, [hmsInstance]);
+};
+exports.useHMSMessages = useHMSMessages;
+const useHMSPIPRoomLeave = () => {
+  const hmsInstance = useHMSInstance();
+  const dispatch = (0, _reactRedux.useDispatch)();
+  // TODO: What if this is undefined?
+  const navigation = (0, _native.useNavigation)();
+  (0, _react.useEffect)(() => {
+    const pipRoomLeaveHandler = () => {
+      hmsInstance.destroy().then(s => {
+        console.log('Destroy Success: ', s);
+        // TODOS:
+        // - If show `Meeting_Ended` is true, show Meeting screen by setting state to MEETING_ENDED
+        //    - Reset Redux States
+        //    - HMSInstance will not be available now
+        //    - When your presses "Re Join" Action button, restart process from root component
+        //    - When your presses "Done" Action button
+        //        - If we have callback fn, call it
+        //        - Otherwise try our best to navigate away from current screen
+        //
+        // - No screen to show
+        //    - No need to reset redux state?
+        //    - HMSInstance will be available till this point
+        //    - If we have callback fn, call it
+        //    - Otherwise try our best to navigate away from current screen
+        //    - When we are navigated away from screen, HMSInstance will be not available
+
+        // dispatch(clearMessageData());
+        // dispatch(clearPeerData());
+        // dispatch(clearHmsReference());
+
+        // if (navigation.canGoBack()) {
+        //   navigation.goBack();
+        // } else {
+        // TODO: remove this later
+        navigation.navigate('QRCodeScreen');
+        dispatch((0, _actions.clearStore)());
+        // }
+      }).catch(e => {
+        console.log(`Destroy HMS instance Error: ${e}`);
+        _reactNativeSimpleToast.default.showWithGravity(`Destroy HMS instance Error: ${e}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+      });
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSPIPListenerActions.ON_PIP_ROOM_LEAVE, pipRoomLeaveHandler);
+    return () => {
+      hmsInstance.removeEventListener(_reactNativeHms.HMSPIPListenerActions.ON_PIP_ROOM_LEAVE);
+    };
+  }, [hmsInstance]);
+};
+exports.useHMSPIPRoomLeave = useHMSPIPRoomLeave;
+const useHMSRemovedFromRoomUpdate = () => {
+  const hmsInstance = useHMSInstance();
+  const dispatch = (0, _reactRedux.useDispatch)();
+  // TODO: What if this is undefined?
+  const navigation = (0, _native.useNavigation)();
+  (0, _react.useEffect)(() => {
+    const removedFromRoomHandler = () => {
+      hmsInstance.destroy().then(s => {
+        console.log('Destroy Success: ', s);
+        // TODOS:
+        // - If show `Meeting_Ended` is true, show Meeting screen by setting state to MEETING_ENDED
+        //    - Reset Redux States
+        //    - HMSInstance will not be available now
+        //    - When your presses "Re Join" Action button, restart process from root component
+        //    - When your presses "Done" Action button
+        //        - If we have callback fn, call it
+        //        - Otherwise try our best to navigate away from current screen
+        //
+        // - No screen to show
+        //    - No need to reset redux state?
+        //    - HMSInstance will be available till this point
+        //    - If we have callback fn, call it
+        //    - Otherwise try our best to navigate away from current screen
+        //    - When we are navigated away from screen, HMSInstance will be not available
+
+        // dispatch(clearMessageData());
+        // dispatch(clearPeerData());
+        // dispatch(clearHmsReference());
+
+        // if (navigation.canGoBack()) {
+        //   navigation.goBack();
+        // } else {
+        // TODO: remove this later
+        navigation.navigate('QRCodeScreen');
+        dispatch((0, _actions.clearStore)());
+        // }
+      }).catch(e => {
+        console.log(`Destroy HMS instance Error: ${e}`);
+        _reactNativeSimpleToast.default.showWithGravity(`Destroy HMS instance Error: ${e}`, _reactNativeSimpleToast.default.LONG, _reactNativeSimpleToast.default.TOP);
+      });
+    };
+    hmsInstance.addEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_REMOVED_FROM_ROOM, removedFromRoomHandler);
+    return () => {
+      hmsInstance.removeEventListener(_reactNativeHms.HMSUpdateListenerActions.ON_REMOVED_FROM_ROOM);
+    };
+  }, [hmsInstance]);
+};
+exports.useHMSRemovedFromRoomUpdate = useHMSRemovedFromRoomUpdate;
+const usePIPListener = () => {
+  const hmsInstance = useHMSInstance();
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const isPipModeActive = (0, _reactRedux.useSelector)(state => state.app.pipModeStatus === _types.PipModes.ACTIVE);
+  (0, _react.useEffect)(() => {
+    if (isPipModeActive) {
+      const appStateListener = () => {
+        _reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut);
+        dispatch((0, _actions.changePipModeStatus)(_types.PipModes.INACTIVE));
+      };
+      _reactNative.AppState.addEventListener('focus', appStateListener);
+      return () => {
+        _reactNative.AppState.removeEventListener('focus', appStateListener);
+        dispatch((0, _actions.changePipModeStatus)(_types.PipModes.INACTIVE));
+      };
+    }
+  }, [isPipModeActive]);
+
+  // Check if PIP is supported or not
+  (0, _react.useEffect)(() => {
+    // Only check for PIP support if PIP is not active
+    if (hmsInstance && !isPipModeActive) {
+      const check = async () => {
+        try {
+          const isSupported = await hmsInstance.isPipModeSupported();
+          if (!isSupported) {
+            dispatch((0, _actions.changePipModeStatus)(_types.PipModes.NOT_AVAILABLE));
+          }
+        } catch (error) {
+          dispatch((0, _actions.changePipModeStatus)(_types.PipModes.NOT_AVAILABLE));
+        }
+      };
+      check();
+    }
+  }, [isPipModeActive, hmsInstance]);
+};
+exports.usePIPListener = usePIPListener;
+let modalTaskRef = {
+  current: null
+};
+const clearPendingModalTasks = () => {
+  if (_reactNative.Platform.OS === 'android') {
+    var _modalTaskRef$current;
+    (_modalTaskRef$current = modalTaskRef.current) === null || _modalTaskRef$current === void 0 ? void 0 : _modalTaskRef$current.cancel();
+  } else {
+    clearTimeout(modalTaskRef.current);
+  }
+};
+exports.clearPendingModalTasks = clearPendingModalTasks;
+const addModalTask = task => {
+  clearPendingModalTasks();
+  if (_reactNative.Platform.OS === 'android') {
+    modalTaskRef.current = _reactNative.InteractionManager.runAfterInteractions(task);
+  } else {
+    modalTaskRef.current = setTimeout(task, 500);
+  }
+};
+const useModalType = () => {
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const modalType = (0, _reactRedux.useSelector)(state => state.app.modalType);
+  const setModalVisible = modalType => {
+    dispatch((0, _actions.setModalType)(modalType));
+  };
+  const handleModalVisible = (0, _react.useCallback)(function (modalType) {
+    let delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    if (delay) {
+      setModalVisible(_types.ModalTypes.DEFAULT);
+      const task = () => {
+        setModalVisible(modalType);
+      };
+      addModalTask(task);
+    } else {
+      setModalVisible(modalType);
+    }
+  }, []);
+  return {
+    modalVisibleType: modalType,
+    handleModalVisibleType: handleModalVisible
+  };
+};
+exports.useModalType = useModalType;
+const useFetchHMSRoles = () => {
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const hmsInstance = useHMSInstance();
+  (0, _react.useEffect)(() => {
+    let ignore = false;
+    hmsInstance.getRoles().then(roles => {
+      if (!ignore) {
+        dispatch((0, _actions.setHMSRoleState)(roles));
+      }
+    });
+    return () => {
+      ignore = true;
+    };
+  }, [hmsInstance]);
+};
+exports.useFetchHMSRoles = useFetchHMSRoles;
+const useShowLandscapeLayout = () => {
+  const isLandscapeOrientation = (0, _dimension.useIsLandscapeOrientation)();
+  const localPeerRoleName = (0, _reactRedux.useSelector)(state => {
+    var _state$hmsStates$loca;
+    return (_state$hmsStates$loca = state.hmsStates.localPeer) === null || _state$hmsStates$loca === void 0 || (_state$hmsStates$loca = _state$hmsStates$loca.role) === null || _state$hmsStates$loca === void 0 ? void 0 : _state$hmsStates$loca.name;
+  });
+  return isLandscapeOrientation && !!localPeerRoleName && localPeerRoleName.includes('hls-');
+};
+exports.useShowLandscapeLayout = useShowLandscapeLayout;
+let hmsConfig = null;
+const clearConfig = () => {
+  hmsConfig = null;
+};
+exports.clearConfig = clearConfig;
+const useHMSConfig = () => {
+  const hmsInstance = useHMSInstance();
+  const store = (0, _reactRedux.useStore)();
+  const getConfig = (0, _react.useCallback)(async () => {
+    var _storeState$user$endP, _storeState$user$endP2;
+    if (hmsConfig) return hmsConfig;
+    const storeState = store.getState();
+    const token = await hmsInstance.getAuthTokenByRoomCode(storeState.user.roomCode, storeState.user.userId, (_storeState$user$endP = storeState.user.endPoints) === null || _storeState$user$endP === void 0 ? void 0 : _storeState$user$endP.token);
+    hmsConfig = new _reactNativeHms.HMSConfig({
+      authToken: token,
+      username: storeState.user.userName,
+      captureNetworkQualityInPreview: true,
+      endpoint: (_storeState$user$endP2 = storeState.user.endPoints) === null || _storeState$user$endP2 === void 0 ? void 0 : _storeState$user$endP2.init
+      // metadata: JSON.stringify({isHandRaised: true}), // To join with hand raised
+    });
+
+    return hmsConfig;
+  }, [hmsInstance]);
+  return {
+    clearConfig,
+    getConfig
+  };
+};
+exports.useHMSConfig = useHMSConfig;
+const useSafeDimensions = () => {
+  const {
+    height,
+    width
+  } = (0, _reactNativeSafeAreaContext.useSafeAreaFrame)();
+  const safeAreaInsets = (0, _reactNativeSafeAreaContext.useSafeAreaInsets)();
+  return {
+    safeWidth: width - safeAreaInsets.left - safeAreaInsets.right,
+    safeHeight: height - safeAreaInsets.top - safeAreaInsets.bottom
+  };
+};
+exports.useSafeDimensions = useSafeDimensions;
+const useShowChat = () => {
+  const dispatch = (0, _reactRedux.useDispatch)();
+  const isHLSViewer = useIsHLSViewer();
+  const showChatView = (0, _reactRedux.useSelector)(state => state.chatWindow.showChatView);
+  const hlsAspectRatio = (0, _reactRedux.useSelector)(state => state.app.hlsAspectRatio);
+  const chatVisible = (0, _react.useMemo)(() => {
+    if (!showChatView) return 'none';
+    if (isHLSViewer && ['16:9', '4:3'].includes(hlsAspectRatio.id)) return 'inset';
+
+    // TODO: handle case when type modal is selected, but chat modal is not shown because aspect ration modal was just closed
+    return 'modal';
+  }, [showChatView, hlsAspectRatio.id, isHLSViewer]);
+  const isChatVisibleInsetType = chatVisible === 'inset';
+  const showChat = (0, _react.useCallback)(show => {
+    if (isChatVisibleInsetType) {
+      _reactNative.LayoutAnimation.configureNext(_reactNative.LayoutAnimation.Presets.easeInEaseOut);
+    }
+    dispatch({
+      type: 'SET_SHOW_CHAT_VIEW',
+      showChatView: show
+    });
+  }, [isChatVisibleInsetType]);
+  return [chatVisible, showChat];
+};
+exports.useShowChat = useShowChat;
+const usePortraitChatViewVisible = () => {
+  const [chatVisible] = useShowChat();
+  const pipModeNotActive = (0, _reactRedux.useSelector)(state => state.app.pipModeStatus !== _types.PipModes.ACTIVE);
+  const isPortraitOrientation = (0, _dimension.useIsPortraitOrientation)();
+  return pipModeNotActive && isPortraitOrientation && chatVisible === 'inset';
+};
+exports.usePortraitChatViewVisible = usePortraitChatViewVisible;
+const useLandscapeChatViewVisible = () => {
+  const [chatVisible] = useShowChat();
+  const pipModeNotActive = (0, _reactRedux.useSelector)(state => state.app.pipModeStatus !== _types.PipModes.ACTIVE);
+  const isLandscapeOrientation = (0, _dimension.useIsLandscapeOrientation)();
+  return pipModeNotActive && isLandscapeOrientation && chatVisible === 'inset';
+};
+exports.useLandscapeChatViewVisible = useLandscapeChatViewVisible;
+const useFilteredParticipants = () => {
+  const hmsInstance = useHMSInstance();
+  const localPeer = (0, _reactRedux.useSelector)(state => state.hmsStates.localPeer);
+  const [filter, setFilter] = (0, _react.useState)('everyone');
+  const [participantsSearchInput, setParticipantsSearchInput] = (0, _react.useState)('');
+  const [hmsPeers, setHmsPeers] = (0, _react.useState)(localPeer ? [localPeer] : []);
+  const filteredPeerTrackNodes = (0, _react.useMemo)(() => {
+    const newFilteredPeerTrackNodes = hmsPeers === null || hmsPeers === void 0 ? void 0 : hmsPeers.filter(peer => {
+      var _peer$role;
+      if (participantsSearchInput.length < 1 || peer.name.includes(participantsSearchInput) || (_peer$role = peer.role) !== null && _peer$role !== void 0 && (_peer$role = _peer$role.name) !== null && _peer$role !== void 0 && _peer$role.includes(participantsSearchInput)) {
+        return true;
+      }
+      return false;
+    });
+    if (filter === 'everyone') {
+      return newFilteredPeerTrackNodes;
+    }
+    if (filter === 'raised hand') {
+      return newFilteredPeerTrackNodes.filter(peer => {
+        const parsedMetaData = (0, _functions.parseMetadata)(peer.metadata);
+        return parsedMetaData.isHandRaised === true;
+      });
+    }
+    return newFilteredPeerTrackNodes.filter(peer => {
+      var _peer$role2;
+      return ((_peer$role2 = peer.role) === null || _peer$role2 === void 0 ? void 0 : _peer$role2.name) === filter;
+    });
+  }, [participantsSearchInput, filter, hmsPeers]);
+  (0, _react.useEffect)(() => {
+    let ignore = false;
+    hmsInstance.getRemotePeers().then(peers => {
+      if (localPeer) {
+        _reactNative.InteractionManager.runAfterInteractions(() => {
+          if (!ignore) {
+            setHmsPeers([localPeer, ...peers]);
+          }
+        });
+      }
+    });
+    return () => {
+      ignore = true;
+    };
+  }, [localPeer, hmsInstance]);
+  return {
+    allParticipants: hmsPeers,
+    filteredParticipants: filteredPeerTrackNodes,
+    selectedFilter: filter,
+    changeFilter: setFilter,
+    searchText: participantsSearchInput,
+    setSearchText: setParticipantsSearchInput
+  };
+};
+exports.useFilteredParticipants = useFilteredParticipants;
+//# sourceMappingURL=hooks-util.js.map