Add exam mode

src/commons/application/types/SessionTypes.ts

@@ -39,6 +39,7 @@ export type SessionState = {
   readonly enableAchievements?: boolean;
   readonly enableSourcecast?: boolean;
   readonly enableStories?: boolean;
+  readonly enableExamMode?: boolean;
   readonly sourceChapter?: Chapter;
   readonly sourceVariant?: Variant;
   readonly moduleHelpText?: string;
@@ -105,6 +106,7 @@ export type CourseConfiguration = {
   enableAchievements: boolean;
   enableSourcecast: boolean;
   enableStories: boolean;
+  enableExamMode: boolean;
   sourceChapter: Chapter;
   sourceVariant: Variant;
   moduleHelpText: string;

src/commons/dropdown/DropdownCourses.tsx

@@ -5,6 +5,7 @@ import { useNavigate } from 'react-router';
 
 import { Role } from '../application/ApplicationTypes';
 import { UserCourse } from '../application/types/SessionTypes';
+import { useTypedSelector } from '../utils/Hooks';
 
 type Props = {
   isOpen: boolean;
@@ -15,6 +16,7 @@ type Props = {
 
 const DropdownCourses: React.FC<Props> = ({ isOpen, onClose, courses, courseId }) => {
   const navigate = useNavigate();
+  const enableExamMode = useTypedSelector(state => state.session.enableExamMode);
 
   const options = courses.map(course => ({
     value: course.courseId,
@@ -42,7 +44,7 @@ const DropdownCourses: React.FC<Props> = ({ isOpen, onClose, courses, courseId }
           options={options}
           fill
           onChange={onChangeHandler}
-          disabled={courses.length <= 1}
+          disabled={courses.length <= 1 || enableExamMode}
         />
       </DialogBody>
     </Dialog>

src/commons/dropdown/DropdownCreateCourse.tsx

@@ -40,6 +40,7 @@ const DropdownCreateCourse: React.FC<Props> = props => {
     enableAchievements: true,
     enableSourcecast: true,
     enableStories: false,
+    enableExamMode: false,
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: ''
@@ -234,6 +235,18 @@ 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

@@ -373,6 +373,7 @@ export const mockCourseConfigurations: CourseConfiguration[] = [
     enableAchievements: true,
     enableSourcecast: true,
     enableStories: false,
+    enableExamMode: false,
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: '',
@@ -386,6 +387,7 @@ export const mockCourseConfigurations: CourseConfiguration[] = [
     enableAchievements: false,
     enableSourcecast: false,
     enableStories: false,
+    enableExamMode: false,
     sourceChapter: Chapter.SOURCE_2,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help Text!',

src/commons/sagas/BackendSaga.ts

@@ -822,6 +822,21 @@ const newBackendSagaTwo = combineSagaHandlers(sagaActions, {
       assessmentConfigurations: AssessmentConfiguration[] | null;
     } = yield call(getLatestCourseRegistrationAndConfiguration, tokens);
 
+    if (courseConfiguration?.enableExamMode) {
+      const {
+        user
+      }: {
+        user: User | null;
+        courseRegistration: CourseRegistration | null;
+        courseConfiguration: CourseConfiguration | null;
+        assessmentConfigurations: AssessmentConfiguration[] | null;
+      } = yield call(getUser, tokens);
+
+      if (user) {
+        yield put(actions.setUser(user));
+      }
+    }
+
     if (!courseRegistration || !courseConfiguration || !assessmentConfigurations) {
       yield call(showWarningMessage, `Failed to load course!`);
       return yield routerNavigate('/welcome');

src/commons/sagas/__tests__/BackendSaga.ts

@@ -133,6 +133,7 @@ const mockCourseConfiguration1: CourseConfiguration = {
   enableAchievements: true,
   enableSourcecast: true,
   enableStories: false,
+  enableExamMode: false,
   sourceChapter: Chapter.SOURCE_1,
   sourceVariant: Variant.DEFAULT,
   moduleHelpText: 'Help text',
@@ -164,6 +165,7 @@ const mockCourseConfiguration2: CourseConfiguration = {
   enableAchievements: true,
   enableSourcecast: true,
   enableStories: false,
+  enableExamMode: false,
   sourceChapter: Chapter.SOURCE_4,
   sourceVariant: Variant.DEFAULT,
   moduleHelpText: 'Help text',
@@ -930,6 +932,7 @@ describe('Test UPDATE_COURSE_CONFIG action', () => {
     enableAchievements: false,
     enableSourcecast: false,
     enableStories: false,
+    enableExamMode: false,
     sourceChapter: Chapter.SOURCE_4,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help',
@@ -1028,6 +1031,7 @@ describe('Test CREATE_COURSE action', () => {
     enableAchievements: true,
     enableSourcecast: true,
     enableStories: false,
+    enableExamMode: false,
     sourceChapter: Chapter.SOURCE_1,
     sourceVariant: Variant.DEFAULT,
     moduleHelpText: 'Help Text'

src/pages/academy/Academy.tsx

@@ -5,7 +5,7 @@ import { useDispatch } from 'react-redux';
 import { Navigate, Outlet, useNavigate, useParams } from 'react-router';
 import ResearchAgreementPrompt from 'src/commons/researchAgreementPrompt/ResearchAgreementPrompt';
 import Constants from 'src/commons/utils/Constants';
-import { useSession } from 'src/commons/utils/Hooks';
+import { useSession, useTypedSelector } from 'src/commons/utils/Hooks';
 import classes from 'src/styles/Academy.module.scss';
 
 import SessionActions from '../../commons/application/actions/SessionActions';
@@ -37,6 +37,7 @@ const CourseSelectingAcademy: React.FC = () => {
   const { courseId } = useSession();
   const { courseId: routeCourseIdStr } = useParams<{ courseId?: string }>();
   const routeCourseId = routeCourseIdStr != null ? parseInt(routeCourseIdStr, 10) : undefined;
+  const enableExamMode = useTypedSelector(state => state.session.enableExamMode);
 
   React.useEffect(() => {
     // Regex to handle case where routeCourseIdStr is not a number
@@ -47,7 +48,11 @@ const CourseSelectingAcademy: React.FC = () => {
     if (routeCourseId !== undefined && !Number.isNaN(routeCourseId) && courseId !== routeCourseId) {
       dispatch(SessionActions.updateLatestViewedCourse(routeCourseId));
     }
-  }, [courseId, dispatch, routeCourseId, navigate, routeCourseIdStr]);
+
+    if (enableExamMode) {
+      navigate(`/courses/${courseId}`);
+    }
+  }, [courseId, dispatch, routeCourseId, navigate, routeCourseIdStr, enableExamMode]);
 
   return Number.isNaN(routeCourseId) ? (
     <Navigate to="/" />

src/pages/academy/adminPanel/AdminPanel.tsx

@@ -29,6 +29,7 @@ const defaultCourseConfig: UpdateCourseConfiguration = {
   enableAchievements: true,
   enableSourcecast: true,
   enableStories: false,
+  enableExamMode: false,
   moduleHelpText: ''
 };
 
@@ -62,6 +63,7 @@ const AdminPanel: React.FC = () => {
       enableAchievements: session.enableAchievements,
       enableSourcecast: session.enableSourcecast,
       enableStories: session.enableStories,
+      enableExamMode: session.enableExamMode,
       moduleHelpText: session.moduleHelpText
     });
   }, [
@@ -71,6 +73,7 @@ const AdminPanel: React.FC = () => {
     session.enableGame,
     session.enableSourcecast,
     session.enableStories,
+    session.enableExamMode,
     session.moduleHelpText,
     session.viewable
   ]);

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

@@ -38,6 +38,7 @@ const CourseConfigPanel: React.FC<Props> = props => {
     enableAchievements,
     enableSourcecast,
     enableStories,
+    enableExamMode,
     moduleHelpText
   } = props.courseConfiguration;
 
@@ -186,6 +187,16 @@ 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
+              })
+            }
+          />
         </div>
       </div>
     </div>

src/pages/playground/Playground.tsx

@@ -233,7 +233,8 @@ const Playground: React.FC<PlaygroundProps> = props => {
     sourceChapter: courseSourceChapter,
     sourceVariant: courseSourceVariant,
     googleUser: persistenceUser,
-    githubOctokitObject
+    githubOctokitObject,
+    enableExamMode
   } = useTypedSelector(state => state.session);
 
   const dispatch = useDispatch();
@@ -749,7 +750,7 @@ const Playground: React.FC<PlaygroundProps> = props => {
       }
     }
 
-    if (!isSicpEditor && !Constants.playgroundOnly) {
+    if (!isSicpEditor && !Constants.playgroundOnly && !enableExamMode) {
       tabs.push(remoteExecutionTab);
     }
 
@@ -765,7 +766,8 @@ const Playground: React.FC<PlaygroundProps> = props => {
     shouldShowDataVisualizer,
     shouldShowCseMachine,
     shouldShowSubstVisualizer,
-    remoteExecutionTab
+    remoteExecutionTab,
+    enableExamMode
   ]);
 
   // Remove Intro and Remote Execution tabs for mobile
@@ -972,12 +974,12 @@ const Playground: React.FC<PlaygroundProps> = props => {
     controlBarProps: {
       editorButtons: [
         autorunButtons,
-        languageConfig.chapter === Chapter.FULL_JS ? null : shareButton,
+        languageConfig.chapter === Chapter.FULL_JS || enableExamMode ? null : shareButton,
         chapterSelectButton,
-        isSicpEditor ? null : sessionButtons,
+        isSicpEditor || enableExamMode ? null : sessionButtons,
         languageConfig.supports.multiFile ? toggleFolderModeButton : null,
-        persistenceButtons,
-        githubButtons,
+        enableExamMode ? null : persistenceButtons,
+        enableExamMode ? null : githubButtons,
         usingSubst || usingCse || isCseVariant(languageConfig.variant)
           ? stepperStepLimit
           : isSourceLanguage(languageConfig.chapter)