@newtonschool/react_proctoring_library 0.0.131 → 0.0.132

package/dist/components/secondaryDevice/index.js

@@ -9,6 +9,8 @@ var _react = require("react");
 var _proctoringStatusUtils = require("../../utils/proctoringStatusUtils");
 var _permission = require("../../utils/permission");
 var _breachUtils = require("../../utils/breachUtils");
+var _usePageActivity = _interopRequireDefault(require("../../hooks/usePageActivity"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const SecondaryDevice = _ref => {
   let {
     proctoredContext,
@@ -24,12 +26,16 @@ const SecondaryDevice = _ref => {
   const [primaryDeviceOnline, setPrimaryDeviceOnline] = (0, _react.useState)(true);
   const [secondaryDeviceOnline, setSecondaryDeviceOnline] = (0, _react.useState)(true);
   const [secondaryDeviceAllPermissionGranted, setSecondaryDeviceAllPermissionGranted] = (0, _react.useState)(true);
+  const {
+    isActive: isCurrentDeviceActive
+  } = (0, _usePageActivity.default)();
   const allPermissionGranted = (0, _permission.hasAllPermissions)((0, _breachUtils.getRequiredPermissionsFromProctorParams)(proctorParams), permissions);
+  const effectiveAllPermissionGranted = allPermissionGranted && isCurrentDeviceActive;
   (0, _react.useEffect)(() => {
     const cleanup = (0, _proctoringStatusUtils.setupDeviceStatusListeners)({
       firebaseClient,
       isSecondaryDevice,
-      allPermissionGranted,
+      isCurrentDeviceActive,
       onPrimaryDeviceStatusChange: connectionStatus => {
         setPrimaryDeviceOnline(connectionStatus);
       },
@@ -39,21 +45,21 @@ const SecondaryDevice = _ref => {
       }
     });
     return cleanup;
-  }, [firebaseClient, isSecondaryDevice, allPermissionGranted]);
+  }, [firebaseClient, isSecondaryDevice, isCurrentDeviceActive]);
   (0, _react.useEffect)(() => {
     (0, _proctoringStatusUtils.updateCurrentDeviceStatus)({
       firebaseClient,
       isSecondaryDevice,
-      allPermissionGranted
+      allPermissionGranted: effectiveAllPermissionGranted
     });
-  }, [firebaseClient, isSecondaryDevice, allPermissionGranted]);
+  }, [firebaseClient, isSecondaryDevice, effectiveAllPermissionGranted]);
   (0, _react.useEffect)(() => {
     if (isSecondaryDevice) {
-      setSecondaryDevicePermission(secondaryDeviceOnline);
+      setSecondaryDevicePermission(secondaryDeviceOnline && isCurrentDeviceActive);
     } else {
       setSecondaryDevicePermission(secondaryDeviceOnline && secondaryDeviceAllPermissionGranted);
     }
-  }, [isSecondaryDevice, primaryDeviceOnline, secondaryDeviceOnline, secondaryDeviceAllPermissionGranted, setSecondaryDevicePermission]);
+  }, [isSecondaryDevice, primaryDeviceOnline, secondaryDeviceOnline, secondaryDeviceAllPermissionGranted, isCurrentDeviceActive, setSecondaryDevicePermission]);
   return null;
 };
 exports.SecondaryDevice = SecondaryDevice;

package/dist/hooks/usePageActivity.js

@@ -0,0 +1,91 @@
+"use strict";
+
+require("core-js/modules/es.symbol.description.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = usePageActivity;
+require("core-js/modules/web.dom-collections.iterator.js");
+var _react = require("react");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const getInitialPageActivityState = () => ({
+  isVisible: typeof document === 'undefined' ? true : !document.hidden,
+  isFocused: typeof document === 'undefined' || typeof document.hasFocus !== 'function' ? true : document.hasFocus(),
+  isLifecycleActive: true
+});
+function usePageActivity() {
+  const [pageActivityState, setPageActivityState] = (0, _react.useState)(getInitialPageActivityState);
+  (0, _react.useEffect)(() => {
+    if (typeof window === 'undefined') {
+      return () => {};
+    }
+    const syncPageActivity = () => {
+      setPageActivityState(previousState => _objectSpread(_objectSpread({}, previousState), {}, {
+        isVisible: !document.hidden,
+        isFocused: typeof document.hasFocus === 'function' ? document.hasFocus() : true
+      }));
+    };
+    const handleFocus = () => {
+      setPageActivityState(previousState => _objectSpread(_objectSpread({}, previousState), {}, {
+        isFocused: true,
+        isLifecycleActive: true
+      }));
+      syncPageActivity();
+    };
+    const handleBlur = () => {
+      setPageActivityState(previousState => _objectSpread(_objectSpread({}, previousState), {}, {
+        isFocused: false
+      }));
+    };
+    const handleVisibilityChange = () => {
+      setPageActivityState(previousState => _objectSpread(_objectSpread({}, previousState), {}, {
+        isVisible: !document.hidden,
+        isFocused: typeof document.hasFocus === 'function' ? document.hasFocus() : true,
+        isLifecycleActive: document.hidden ? previousState.isLifecycleActive : true
+      }));
+    };
+    const handlePageHide = () => {
+      setPageActivityState(previousState => _objectSpread(_objectSpread({}, previousState), {}, {
+        isLifecycleActive: false,
+        isFocused: false
+      }));
+    };
+    const handlePageShow = () => {
+      setPageActivityState(previousState => _objectSpread(_objectSpread({}, previousState), {}, {
+        isLifecycleActive: true
+      }));
+      syncPageActivity();
+    };
+    syncPageActivity();
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+    window.addEventListener('focus', handleFocus);
+    window.addEventListener('blur', handleBlur);
+    window.addEventListener('pagehide', handlePageHide);
+    window.addEventListener('pageshow', handlePageShow);
+    if ('onfreeze' in document) {
+      document.addEventListener('freeze', handlePageHide);
+      document.addEventListener('resume', handlePageShow);
+    }
+    return () => {
+      document.removeEventListener('visibilitychange', handleVisibilityChange);
+      window.removeEventListener('focus', handleFocus);
+      window.removeEventListener('blur', handleBlur);
+      window.removeEventListener('pagehide', handlePageHide);
+      window.removeEventListener('pageshow', handlePageShow);
+      if ('onfreeze' in document) {
+        document.removeEventListener('freeze', handlePageHide);
+        document.removeEventListener('resume', handlePageShow);
+      }
+    };
+  }, []);
+  return (0, _react.useMemo)(() => _objectSpread(_objectSpread({}, pageActivityState), {}, {
+    isActive: pageActivityState.isVisible && pageActivityState.isFocused && pageActivityState.isLifecycleActive
+  }), [pageActivityState]);
+}

package/dist/utils/proctoringStatusUtils.js

@@ -110,7 +110,8 @@ const setupDeviceStatusListeners = _ref2 => {
     firebaseClient,
     isSecondaryDevice,
     onPrimaryDeviceStatusChange,
-    onSecondaryDeviceStatusChange
+    onSecondaryDeviceStatusChange,
+    isCurrentDeviceActive = true
   } = _ref2;
   const {
     userUuid,
@@ -129,6 +130,8 @@ const setupDeviceStatusListeners = _ref2 => {
   const secondaryDeviceStatusRef = ref(myFirebaseDB, "".concat(_defaults.PROCTORING_STATUS_PATH, "/").concat(userUuid, "/secondaryDevice"));
   const currentDeviceStatusRef = isSecondaryDevice ? secondaryDeviceStatusRef : primaryDeviceStatusRef;
   const otherDeviceStatusRef = isSecondaryDevice ? primaryDeviceStatusRef : secondaryDeviceStatusRef;
+  let latestPrimaryDeviceStatus = null;
+  let latestSecondaryDeviceStatus = null;
 
   // When this client disconnects (tab close, network loss)
   onDisconnect(currentDeviceStatusRef).update({
@@ -141,11 +144,13 @@ const setupDeviceStatusListeners = _ref2 => {
   const applyPrimarySnapshot = snapshot => {
     var _snapshot$val, _snapshot$val2;
     const val = (_snapshot$val = snapshot === null || snapshot === void 0 ? void 0 : (_snapshot$val2 = snapshot.val) === null || _snapshot$val2 === void 0 ? void 0 : _snapshot$val2.call(snapshot)) !== null && _snapshot$val !== void 0 ? _snapshot$val : snapshot;
+    latestPrimaryDeviceStatus = val;
     onPrimaryDeviceStatusChange(Boolean(val === null || val === void 0 ? void 0 : val.connected));
   };
   const applySecondarySnapshot = snapshot => {
     var _snapshot$val3, _snapshot$val4;
     const val = (_snapshot$val3 = snapshot === null || snapshot === void 0 ? void 0 : (_snapshot$val4 = snapshot.val) === null || _snapshot$val4 === void 0 ? void 0 : _snapshot$val4.call(snapshot)) !== null && _snapshot$val3 !== void 0 ? _snapshot$val3 : snapshot;
+    latestSecondaryDeviceStatus = val;
     onSecondaryDeviceStatusChange(Boolean(val === null || val === void 0 ? void 0 : val.connected), val === null || val === void 0 ? void 0 : val.allPermissionGranted);
   };
   if (typeof (primaryDeviceStatusRef === null || primaryDeviceStatusRef === void 0 ? void 0 : primaryDeviceStatusRef.get) === 'function') {
@@ -168,9 +173,7 @@ const setupDeviceStatusListeners = _ref2 => {
   if (typeof window !== 'undefined' && typeof setInterval === 'function') {
     heartbeatIntervalId = setInterval(() => {
       const now = Date.now();
-
-      // Send heartbeat for current device if document is not hidden
-      if (!document.hidden) {
+      if (isCurrentDeviceActive) {
         update(currentDeviceStatusRef, {
           connected: true,
           lastHeartbeatAt: now
@@ -178,20 +181,25 @@ const setupDeviceStatusListeners = _ref2 => {
           console.error('::[proctoringStatusUtils] Failed to send heartbeat for current device:', error);
         });
       }
+      if (!isCurrentDeviceActive) {
+        update(currentDeviceStatusRef, {
+          connected: false
+        }).catch(error => {
+          console.error('::[proctoringStatusUtils] Failed to mark current device inactive:', error);
+        });
+      }
 
       // Check other device's last heartbeat; if > OTHER_DEVICE_HEARTBEAT_TIMEOUT_MS then mark as disconnected.
-      onValue(otherDeviceStatusRef, snapshot => {
-        const val = snapshot.val();
-        const lastBeat = val === null || val === void 0 ? void 0 : val.lastHeartbeatAt;
-        const isConnected = Boolean(val === null || val === void 0 ? void 0 : val.connected);
-        if (isConnected && typeof lastBeat === 'number' && now - lastBeat > OTHER_DEVICE_HEARTBEAT_TIMEOUT_MS) {
-          update(otherDeviceStatusRef, {
-            connected: false
-          }).catch(otherErr => {
-            console.error('::[proctoringStatusUtils] Failed to mark other device disconnected due to stale heartbeat:', otherErr);
-          });
-        }
-      });
+      const otherDeviceStatus = isSecondaryDevice ? latestPrimaryDeviceStatus : latestSecondaryDeviceStatus;
+      const lastBeat = otherDeviceStatus === null || otherDeviceStatus === void 0 ? void 0 : otherDeviceStatus.lastHeartbeatAt;
+      const isConnected = Boolean(otherDeviceStatus === null || otherDeviceStatus === void 0 ? void 0 : otherDeviceStatus.connected);
+      if (isConnected && typeof lastBeat === 'number' && now - lastBeat > OTHER_DEVICE_HEARTBEAT_TIMEOUT_MS) {
+        update(otherDeviceStatusRef, {
+          connected: false
+        }).catch(otherErr => {
+          console.error('::[proctoringStatusUtils] Failed to mark other device disconnected due to stale heartbeat:', otherErr);
+        });
+      }
     }, HEARTBEAT_INTERVAL_MS);
   }
   return () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newtonschool/react_proctoring_library",
-  "version": "0.0.131",
+  "version": "0.0.132",
   "description": "Used to proctor online tests",
   "author": "ayushkagrawal,shreyachandra,weastel",
   "main": "dist/index.js",