Disable create course when under exam mode, hide exam mode toggle when not an official course, remove exam mode toggle when creating new course

Author: kah-seng

src/commons/application/types/SessionTypes.ts

@@ -44,6 +44,7 @@ export type SessionState = {
   readonly sourceVariant?: Variant;
   readonly moduleHelpText?: string;
   readonly assetsPrefix?: string;
+  readonly isOfficialCourse?: boolean;
 
   readonly assessmentConfigurations?: AssessmentConfiguration[];
   readonly userCourseRegistrations?: AdminPanelCourseRegistration[];
@@ -111,6 +112,7 @@ export type CourseConfiguration = {
   sourceVariant: Variant;
   moduleHelpText: string;
   assetsPrefix: string;
+  isOfficialCourse: boolean;
 };
 
 export type AdminPanelCourseRegistration = {

src/commons/dropdown/Dropdown.tsx

@@ -24,7 +24,7 @@ const Dropdown: React.FC = () => {
 
   const { t } = useTranslation('commons', { keyPrefix: 'dropdown' });
 
-  const { isLoggedIn, name, courses, courseId } = useSession();
+  const { isLoggedIn, name, courses, courseId, enableExamMode } = useSession();
   const dispatch = useDispatch();
   const handleLogOut = () => dispatch(logOut());
 
@@ -49,9 +49,10 @@ const Dropdown: React.FC = () => {
     <MenuItem icon={IconNames.PROPERTIES} onClick={toggleMyCoursesOpen} text={t('My Courses')} />
   ) : null;
 
-  const createCourse = isLoggedIn ? (
-    <MenuItem icon={IconNames.ADD} onClick={toggleCreateCourseOpen} text={t('Create Course')} />
-  ) : null;
+  const createCourse =
+    isLoggedIn && !enableExamMode ? (
+      <MenuItem icon={IconNames.ADD} onClick={toggleCreateCourseOpen} text={t('Create Course')} />
+    ) : null;
 
   const logout = isLoggedIn ? (
     <MenuItem icon={IconNames.LOG_OUT} text={t('Logout')} onClick={handleLogOut} />

src/commons/dropdown/DropdownCreateCourse.tsx

@@ -235,18 +235,6 @@ const DropdownCreateCourse: React.FC<Props> = props => {
                 })
               }
             />
-
-            <Switch
-              checked={courseConfig.enableExamMode}
-              inline
-              label="Enable Exam Mode"
-              onChange={e =>
-                setCourseConfig({
-                  ...courseConfig,
-                  enableExamMode: (e.target as HTMLInputElement).checked
-                })
-              }
-            />
           </div>
         </div>
         <div>

src/commons/mocks/UserMocks.ts

@@ -377,7 +377,8 @@ export const mockCourseConfigurations: CourseConfiguration[] = [
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: '',
-    assetsPrefix: ''
+    assetsPrefix: '',
+    isOfficialCourse: false
   },
   {
     courseName: `CS2040S Data Structures and Algorithms (AY20/21 Sem 2)`,
@@ -391,7 +392,8 @@ export const mockCourseConfigurations: CourseConfiguration[] = [
     sourceChapter: Chapter.SOURCE_2,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help Text!',
-    assetsPrefix: ''
+    assetsPrefix: '',
+    isOfficialCourse: false
   }
 ];
 

src/pages/academy/adminPanel/AdminPanel.tsx

@@ -64,7 +64,8 @@ const AdminPanel: React.FC = () => {
       enableSourcecast: session.enableSourcecast,
       enableStories: session.enableStories,
       enableExamMode: session.enableExamMode,
-      moduleHelpText: session.moduleHelpText
+      moduleHelpText: session.moduleHelpText,
+      isOfficialCourse: session.isOfficialCourse
     });
   }, [
     session.courseName,
@@ -75,6 +76,7 @@ const AdminPanel: React.FC = () => {
     session.enableStories,
     session.enableExamMode,
     session.moduleHelpText,
+    session.isOfficialCourse,
     session.viewable
   ]);
 

src/pages/academy/adminPanel/subcomponents/CourseConfigPanel.tsx

@@ -39,7 +39,8 @@ const CourseConfigPanel: React.FC<Props> = props => {
     enableSourcecast,
     enableStories,
     enableExamMode,
-    moduleHelpText
+    moduleHelpText,
+    isOfficialCourse
   } = props.courseConfiguration;
 
   const writePanel = (
@@ -187,16 +188,18 @@ const CourseConfigPanel: React.FC<Props> = props => {
               })
             }
           />
-          <Switch
-            checked={enableExamMode}
-            label="Enable Exam Mode"
-            onChange={e =>
-              props.setCourseConfiguration({
-                ...props.courseConfiguration,
-                enableExamMode: (e.target as HTMLInputElement).checked
-              })
-            }
-          />
+          {isOfficialCourse && (
+            <Switch
+              checked={enableExamMode}
+              label="Enable Exam Mode"
+              onChange={e =>
+                props.setCourseConfiguration({
+                  ...props.courseConfiguration,
+                  enableExamMode: (e.target as HTMLInputElement).checked
+                })
+              }
+            />
+          )}
         </div>
       </div>
     </div>