Refactor use of frontend-lib-special-exams public API to use hooks. (#…

…1284) * feat: refactor use of frontend-lib-special-exams public API to hooks This commit refactors the use of the frontend-lib-special-exams public API to use hooks. This commit also imports the root reducer from the frontend-lib-special-exams library. This root reducer is used for the specialExams slice when configuring the store for this application. * feat: update special exams version * feat: update snapshots --------- Co-authored-by: Alie Langston <[email protected]>
openedx · Feb 8, 2024 · 170cbe1 · 170cbe1
1 parent 174de4b
commit 170cbe1
Show file tree

Hide file tree

Showing 8 changed files with 306 additions and 111 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -32,7 +32,7 @@
     "@edx/brand": "npm:@openedx/brand-openedx@^1.2.2",
     "@edx/frontend-component-footer": "12.2.1",
     "@edx/frontend-component-header": "4.6.0",
-    "@edx/frontend-lib-special-exams": "2.27.0",
+    "@edx/frontend-lib-special-exams": "2.28.0",
     "@edx/frontend-lib-learning-assistant": "^1.21.0",
     "@edx/frontend-platform": "5.5.2",
     "@edx/openedx-atlas": "^0.6.0",

diff --git a/src/course-home/data/__snapshots__/redux.test.js.snap b/src/course-home/data/__snapshots__/redux.test.js.snap
@@ -312,6 +312,70 @@ Object {
   "recommendations": Object {
     "recommendationsStatus": "loading",
   },
+  "specialExams": Object {
+    "activeAttempt": null,
+    "allowProctoringOptOut": false,
+    "apiErrorMsg": "",
+    "exam": Object {
+      "attempt": Object {
+        "attempt_code": "",
+        "attempt_id": null,
+        "attempt_status": "",
+        "course_id": "",
+        "desktop_application_js_url": "",
+        "exam_display_name": "",
+        "exam_started_poll_url": "",
+        "exam_type": "",
+        "exam_url_path": "",
+        "external_id": "",
+        "in_timed_exam": true,
+        "ping_interval": null,
+        "taking_as_proctored": true,
+        "time_remaining_seconds": null,
+        "use_legacy_attempt_api": true,
+      },
+      "backend": "",
+      "content_id": "",
+      "course_id": "",
+      "due_date": null,
+      "exam_name": "",
+      "external_id": "",
+      "hide_after_due": false,
+      "id": null,
+      "is_active": true,
+      "is_practice_exam": false,
+      "is_proctored": false,
+      "prerequisite_status": Object {
+        "are_prerequisites_satisifed": true,
+        "declined_prerequisites": Array [],
+        "failed_prerequisites": Array [],
+        "pending_prerequisites": Array [],
+        "satisfied_prerequisites": Array [],
+      },
+      "time_limit_mins": null,
+      "type": "",
+    },
+    "examAccessToken": Object {
+      "exam_access_token": "",
+      "exam_access_token_expiration": "",
+    },
+    "isLoading": true,
+    "proctoringSettings": Object {
+      "exam_proctoring_backend": Object {
+        "download_url": "",
+        "instructions": Array [],
+        "name": "",
+        "rules": Object {},
+      },
+      "integration_specific_email": "",
+      "learner_notification_from_email": "",
+      "provider_name": "",
+      "provider_tech_support_email": "",
+      "provider_tech_support_phone": "",
+      "provider_tech_support_url": "",
+    },
+    "timeIsOver": false,
+  },
   "tours": Object {
     "showCoursewareTour": false,
     "showExistingUserCourseHomeTour": false,
@@ -512,6 +576,70 @@ Object {
   "recommendations": Object {
     "recommendationsStatus": "loading",
   },
+  "specialExams": Object {
+    "activeAttempt": null,
+    "allowProctoringOptOut": false,
+    "apiErrorMsg": "",
+    "exam": Object {
+      "attempt": Object {
+        "attempt_code": "",
+        "attempt_id": null,
+        "attempt_status": "",
+        "course_id": "",
+        "desktop_application_js_url": "",
+        "exam_display_name": "",
+        "exam_started_poll_url": "",
+        "exam_type": "",
+        "exam_url_path": "",
+        "external_id": "",
+        "in_timed_exam": true,
+        "ping_interval": null,
+        "taking_as_proctored": true,
+        "time_remaining_seconds": null,
+        "use_legacy_attempt_api": true,
+      },
+      "backend": "",
+      "content_id": "",
+      "course_id": "",
+      "due_date": null,
+      "exam_name": "",
+      "external_id": "",
+      "hide_after_due": false,
+      "id": null,
+      "is_active": true,
+      "is_practice_exam": false,
+      "is_proctored": false,
+      "prerequisite_status": Object {
+        "are_prerequisites_satisifed": true,
+        "declined_prerequisites": Array [],
+        "failed_prerequisites": Array [],
+        "pending_prerequisites": Array [],
+        "satisfied_prerequisites": Array [],
+      },
+      "time_limit_mins": null,
+      "type": "",
+    },
+    "examAccessToken": Object {
+      "exam_access_token": "",
+      "exam_access_token_expiration": "",
+    },
+    "isLoading": true,
+    "proctoringSettings": Object {
+      "exam_proctoring_backend": Object {
+        "download_url": "",
+        "instructions": Array [],
+        "name": "",
+        "rules": Object {},
+      },
+      "integration_specific_email": "",
+      "learner_notification_from_email": "",
+      "provider_name": "",
+      "provider_tech_support_email": "",
+      "provider_tech_support_phone": "",
+      "provider_tech_support_url": "",
+    },
+    "timeIsOver": false,
+  },
   "tours": Object {
     "showCoursewareTour": false,
     "showExistingUserCourseHomeTour": false,
@@ -718,6 +846,70 @@ Object {
   "recommendations": Object {
     "recommendationsStatus": "loading",
   },
+  "specialExams": Object {
+    "activeAttempt": null,
+    "allowProctoringOptOut": false,
+    "apiErrorMsg": "",
+    "exam": Object {
+      "attempt": Object {
+        "attempt_code": "",
+        "attempt_id": null,
+        "attempt_status": "",
+        "course_id": "",
+        "desktop_application_js_url": "",
+        "exam_display_name": "",
+        "exam_started_poll_url": "",
+        "exam_type": "",
+        "exam_url_path": "",
+        "external_id": "",
+        "in_timed_exam": true,
+        "ping_interval": null,
+        "taking_as_proctored": true,
+        "time_remaining_seconds": null,
+        "use_legacy_attempt_api": true,
+      },
+      "backend": "",
+      "content_id": "",
+      "course_id": "",
+      "due_date": null,
+      "exam_name": "",
+      "external_id": "",
+      "hide_after_due": false,
+      "id": null,
+      "is_active": true,
+      "is_practice_exam": false,
+      "is_proctored": false,
+      "prerequisite_status": Object {
+        "are_prerequisites_satisifed": true,
+        "declined_prerequisites": Array [],
+        "failed_prerequisites": Array [],
+        "pending_prerequisites": Array [],
+        "satisfied_prerequisites": Array [],
+      },
+      "time_limit_mins": null,
+      "type": "",
+    },
+    "examAccessToken": Object {
+      "exam_access_token": "",
+      "exam_access_token_expiration": "",
+    },
+    "isLoading": true,
+    "proctoringSettings": Object {
+      "exam_proctoring_backend": Object {
+        "download_url": "",
+        "instructions": Array [],
+        "name": "",
+        "rules": Object {},
+      },
+      "integration_specific_email": "",
+      "learner_notification_from_email": "",
+      "provider_name": "",
+      "provider_tech_support_email": "",
+      "provider_tech_support_phone": "",
+      "provider_tech_support_url": "",
+    },
+    "timeIsOver": false,
+  },
   "tours": Object {
     "showCoursewareTour": false,
     "showExistingUserCourseHomeTour": false,

diff --git a/src/courseware/course/sequence/Unit/hooks/useExamAccess.js b/src/courseware/course/sequence/Unit/hooks/useExamAccess.js
@@ -2,7 +2,7 @@ import React from 'react';
 
 import { logError } from '@edx/frontend-platform/logging';
 import { StrictDict, useKeyedState } from '@edx/react-unit-test-utils';
-import { getExamAccess, fetchExamAccess, isExam } from '@edx/frontend-lib-special-exams';
+import { useExamAccessToken, useFetchExamAccessToken, useIsExam } from '@edx/frontend-lib-special-exams';
 
 export const stateKeys = StrictDict({
   accessToken: 'accessToken',
@@ -12,14 +12,23 @@ export const stateKeys = StrictDict({
 const useExamAccess = ({
   id,
 }) => {
-  const [accessToken, setAccessToken] = useKeyedState(stateKeys.accessToken, '');
-  const [blockAccess, setBlockAccess] = useKeyedState(stateKeys.blockAccess, isExam());
+  const isExam = useIsExam();
+  const [blockAccess, setBlockAccess] = useKeyedState(stateKeys.blockAccess, isExam);
+
+  const fetchExamAccessToken = useFetchExamAccessToken();
+
+  // NOTE: We cannot use this hook in the useEffect hook below to grab the updated exam access token in the finally
+  //       block, due to the rules of hooks. Instead, we get the value of the exam access token from a call to the hook.
+  //       When the fetchExamAccessToken call completes, the useExamAccess hook will re-run
+  //       (due to a change to the Redux store, and, thus, a change to the the context), at which point the updated
+  //       exam access token will be fetched via the useExamAccessToken hook call below.
+  //       The important detail is that there should never be a return value (false, '').
+  const examAccessToken = useExamAccessToken();
+
   React.useEffect(() => {
-    if (isExam()) {
-      fetchExamAccess()
+    if (isExam) {
+      fetchExamAccessToken()
         .finally(() => {
-          const examAccess = getExamAccess();
-          setAccessToken(examAccess);
           setBlockAccess(false);
         })
         .catch((error) => {
@@ -30,7 +39,7 @@ const useExamAccess = ({
 
   return {
     blockAccess,
-    accessToken,
+    accessToken: examAccessToken,
   };
 };
 

diff --git a/src/courseware/course/sequence/Unit/hooks/useExamAccess.test.js b/src/courseware/course/sequence/Unit/hooks/useExamAccess.test.js