ENCOA-224, ENCOA-256: Added the import templates, Speaking didn't have the navbar yet, added multiple choice to reading since they've placed that in the import

This commit is contained in:
Carlos-Mesquita
2024-12-04 04:15:31 +00:00
parent ec47d750bf
commit 3b6fd2bc6b
4 changed files with 292 additions and 26 deletions

View File

@@ -12,6 +12,7 @@ import useExamTimer from "@/hooks/useExamTimer";
import useExamNavigation from "./Navigation/useExamNavigation";
import ProgressButtons from "./components/ProgressButtons";
import { calculateExerciseIndexSpeaking } from "./utils/calculateExerciseIndex";
import SectionNavbar from "./Navigation/SectionNavbar";
const Speaking: React.FC<ExamProps<SpeakingExam>> = ({ exam, showSolutions = false, preview = false }) => {
@@ -36,7 +37,7 @@ const Speaking: React.FC<ExamProps<SpeakingExam>> = ({ exam, showSolutions = fal
const {
nextExercise, previousExercise,
showPartDivider, setShowPartDivider,
setSeenParts,
setSeenParts, seenParts, setIsBetweenParts
} = useExamNavigation({ exam, module: "speaking", showSolutions, preview, disableBetweenParts: true });
useEffect(() => {
@@ -90,7 +91,7 @@ const Speaking: React.FC<ExamProps<SpeakingExam>> = ({ exam, showSolutions = fal
setSeenParts((prev) => new Set(prev).add(exerciseIndex));
}
const memoizedExerciseIndex = useMemo(() =>
const memoizedExerciseIndex = useMemo(() =>
calculateExerciseIndexSpeaking(exam, exerciseIndex, questionIndex)
// eslint-disable-next-line react-hooks/exhaustive-deps
, [exerciseIndex, questionIndex]
@@ -108,19 +109,29 @@ const Speaking: React.FC<ExamProps<SpeakingExam>> = ({ exam, showSolutions = fal
sectionIndex={exerciseIndex}
onNext={handlePartDividerClick}
/> : (
<div className="flex flex-col h-full w-full gap-8 items-center">
<ModuleTitle
label={convertCamelCaseToReadable(exam.exercises[exerciseIndex].type)}
minTimer={timer.current}
exerciseIndex={memoizedExerciseIndex}
<>
{exam.exercises.length > 1 && <SectionNavbar
module="speaking"
totalExercises={countExercises(exam.exercises)}
disableTimer={showSolutions || preview}
sectionLabel="Part"
seenParts={seenParts}
setShowPartDivider={setShowPartDivider}
setSeenParts={setSeenParts}
preview={preview}
/>
{!showPartDivider && !showSolutions && renderExercise(currentExercise, exam.id, registerSolution, preview, progressButtons, progressButtons)}
{showSolutions && renderSolution(currentExercise, progressButtons, progressButtons)}
</div>
/>}
<div className="flex flex-col h-full w-full gap-8 items-center">
<ModuleTitle
label={convertCamelCaseToReadable(exam.exercises[exerciseIndex].type)}
minTimer={timer.current}
exerciseIndex={memoizedExerciseIndex}
module="speaking"
totalExercises={countExercises(exam.exercises)}
disableTimer={showSolutions || preview}
preview={preview}
/>
{!showPartDivider && !showSolutions && renderExercise(currentExercise, exam.id, registerSolution, preview, progressButtons, progressButtons)}
{showSolutions && renderSolution(currentExercise, progressButtons, progressButtons)}
</div>
</>
)}
</>
);