fix: Refactored Chat to be easier to read

openedx · Jan 30, 2025 · 5fb6bca · 5fb6bca
1 parent 8823cfa
commit 5fb6bca
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 56 deletions.
diff --git a/src/constants.ts b/src/constants.ts
@@ -18,7 +18,7 @@ export const DECODE_ROUTES = {
   ],
   REDIRECT_HOME: 'home/:courseId',
   REDIRECT_SURVEY: 'survey/:courseId',
-} as const satisfies Readonly<{ [k: string]: string | readonly string[] }>;
+} as const satisfies Readonly<{ [k: string]: string | readonly string[]; }>;
 
 export const ROUTES = {
   UNSUBSCRIBE: '/goal-unsubscribe/:token',
@@ -27,15 +27,15 @@ export const ROUTES = {
   DASHBOARD: 'dashboard',
   ENTERPRISE_LEARNER_DASHBOARD: 'enterprise-learner-dashboard',
   CONSENT: 'consent',
-} as const satisfies Readonly<{ [k: string]: string }>;
+} as const satisfies Readonly<{ [k: string]: string; }>;
 
 export const REDIRECT_MODES = {
   DASHBOARD_REDIRECT: 'dashboard-redirect',
   ENTERPRISE_LEARNER_DASHBOARD_REDIRECT: 'enterprise-learner-dashboard-redirect',
   CONSENT_REDIRECT: 'consent-redirect',
   HOME_REDIRECT: 'home-redirect',
   SURVEY_REDIRECT: 'survey-redirect',
-} as const satisfies Readonly<{ [k: string]: string }>;
+} as const satisfies Readonly<{ [k: string]: string; }>;
 
 export const VERIFIED_MODES = [
   'professional',
@@ -55,10 +55,17 @@ export const AUDIT_MODES = [
   'unpaid-bootcamp',
 ] as const satisfies readonly string[];
 
+// In sync with CourseMode.UPSELL_TO_VERIFIED_MODES
+// https://github.com/openedx/edx-platform/blob/master/common/djangoapps/course_modes/models.py#L231
+export const ALLOW_UPSELL_MODES = [
+  'audit',
+  'honor',
+] as const satisfies readonly string[];
+
 export const WIDGETS = {
   DISCUSSIONS: 'DISCUSSIONS',
   NOTIFICATIONS: 'NOTIFICATIONS',
-} as const satisfies Readonly<{ [k: string]: string }>;
+} as const satisfies Readonly<{ [k: string]: string; }>;
 
 export const LOADING = 'loading';
 export const LOADED = 'loaded';

diff --git a/src/courseware/course/chat/Chat.jsx b/src/courseware/course/chat/Chat.jsx
@@ -6,7 +6,7 @@ import { Xpert } from '@edx/frontend-lib-learning-assistant';
 import { getConfig } from '@edx/frontend-platform';
 import { injectIntl } from '@edx/frontend-platform/i18n';
 
-import { AUDIT_MODES, VERIFIED_MODES } from '@src/constants';
+import { ALLOW_UPSELL_MODES, VERIFIED_MODES } from '@src/constants';
 import { useModel } from '../../../generic/model-store';
 
 const Chat = ({
@@ -22,67 +22,54 @@ const Chat = ({
   } = useSelector(state => state.specialExams);
   const course = useModel('coursewareMeta', courseId);
 
+  // If is disabled or taking an exam, we don't show the chat.
+  if (!enabled || activeAttempt?.attempt_id || exam?.id) { return null; }
+
+  // If is not staff and doesn't have an entollment, we don't show the chat.
+  if (!isStaff && !enrollmentMode) { return null; }
+
+  const verifiedMode = VERIFIED_MODES.includes(enrollmentMode); // Enrollment verified
+  const auditMode = (
+    !isStaff
+    && !verifiedMode
+    && ALLOW_UPSELL_MODES.includes(enrollmentMode) // Can upgrade course
+    && getConfig().ENABLE_XPERT_AUDIT
+  );
+
+  // If user has no access, we don't show the chat.
+  if (!isStaff && !(verifiedMode || auditMode)) { return null; }
+
+  // Date validation
   const {
     accessExpiration,
     start,
     end,
   } = course;
 
-  const hasVerifiedEnrollment = (
-    enrollmentMode !== null
-    && enrollmentMode !== undefined
-    && VERIFIED_MODES.includes(enrollmentMode)
-  );
+  const utcDate = (new Date()).toISOString();
 
-  // audit learners should only have access if the ENABLE_XPERT_AUDIT setting is true
-  const hasAuditEnrollmentAndAccess = (
-    enrollmentMode !== null
-    && enrollmentMode !== undefined
-    && AUDIT_MODES.includes(enrollmentMode)
-    && getConfig().ENABLE_XPERT_AUDIT
-  );
+  const startDate = start || utcDate;
+  const endDate = end || utcDate;
+  const expiration = accessExpiration?.expirationDate || utcDate;
 
-  const validDates = () => {
-    const date = new Date();
-    const utcDate = date.toISOString();
-
-    const startDate = start || utcDate;
-    const endDate = end || utcDate;
-    const accessExpirationDate = accessExpiration && accessExpiration.expirationDate
-      ? accessExpiration.expirationDate : utcDate;
-
-    return (
-      startDate <= utcDate
-      && utcDate <= endDate
-      && (hasAuditEnrollmentAndAccess ? utcDate <= accessExpirationDate : true)
-    );
-  };
-
-  const shouldDisplayChat = (
-    enabled
-    && (hasVerifiedEnrollment || isStaff || hasAuditEnrollmentAndAccess)
-    && validDates()
-    // it is necessary to check both whether the user is in an exam, and whether or not they are viewing an exam
-    // this will prevent the learner from interacting with the tool at any point of the exam flow, even at the
-    // entrance interstitial.
-    && !(activeAttempt?.attempt_id || exam?.id)
+  const validDate = (
+    startDate <= utcDate
+    && endDate >= utcDate
+    && (auditMode ? expiration >= utcDate : true)
   );
 
-  const isUpgradeEligible = !hasVerifiedEnrollment && !isStaff;
-
-  return (
-    <>
-      {/* Use a portal to ensure that component overlay does not compete with learning MFE styles. */}
-      {shouldDisplayChat && (createPortal(
-        <Xpert
-          courseId={courseId}
-          contentToolsEnabled={contentToolsEnabled}
-          unitId={unitId}
-          isUpgradeEligible={isUpgradeEligible}
-        />,
-        document.body,
-      ))}
-    </>
+  // If date is invalid, we don't show the chat.
+  if (!validDate) { return null; }
+
+  // Use a portal to ensure that component overlay does not compete with learning MFE styles.
+  return createPortal(
+    <Xpert
+      courseId={courseId}
+      contentToolsEnabled={contentToolsEnabled}
+      unitId={unitId}
+      isUpgradeEligible={auditMode}
+    />,
+    document.body,
   );
 };