diff --git a/src/exams/Selection.tsx b/src/exams/Selection.tsx index 5dd47e40..a97e0dca 100644 --- a/src/exams/Selection.tsx +++ b/src/exams/Selection.tsx @@ -10,7 +10,7 @@ import ProfileLevel from "@/components/ProfileLevel"; import {User} from "@/interfaces/user"; import useExamStore from "@/stores/examStore"; import ProgressBar from "@/components/Low/ProgressBar"; -import {BsBook, BsFileEarmarkText, BsHeadphones, BsMegaphone, BsPen, BsPencil, BsStar} from "react-icons/bs"; +import {BsBook, BsCheckCircle, BsFileEarmarkText, BsHeadphones, BsMegaphone, BsPen, BsPencil, BsStar} from "react-icons/bs"; import {averageScore, formatModuleTotalStats, totalExams, totalExamsByModule} from "@/utils/stats"; import useStats from "@/hooks/useStats"; import Button from "@/components/Low/Button"; @@ -28,8 +28,6 @@ export default function Selection({user, onStart}: Props) { return Object.keys(user!.levels).reduce((accumulator, current) => user!.levels[current as Module] + accumulator, 0) / 4; }; - const router = useRouter(); - const toggleModule = (module: Module) => { const modules = selectedModules.filter((x) => x !== module); setSelectedModules((prev) => (prev.includes(module) ? modules : [...modules, module])); @@ -105,8 +103,9 @@ export default function Selection({user, onStart}: Props) {
toggleModule("reading")} className={clsx( - "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12", + "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12 cursor-pointer", selectedModules.includes("reading") ? "border-mti-green-light" : "border-mti-gray-platinum", )}>
@@ -116,17 +115,13 @@ export default function Selection({user, onStart}: Props) {

Expand your vocabulary, improve your reading comprehension and improve your ability to interpret texts in English.

- + {!selectedModules.includes("reading") &&
} + {selectedModules.includes("reading") && }
toggleModule("listening")} className={clsx( - "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12", + "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12 cursor-pointer", selectedModules.includes("listening") ? "border-mti-green-light" : "border-mti-gray-platinum", )}>
@@ -136,17 +131,13 @@ export default function Selection({user, onStart}: Props) {

Improve your ability to follow conversations in English and your ability to understand different accents and intonations.

- + {!selectedModules.includes("listening") &&
} + {selectedModules.includes("listening") && }
toggleModule("writing")} className={clsx( - "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12", + "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12 cursor-pointer", selectedModules.includes("writing") ? "border-mti-green-light" : "border-mti-gray-platinum", )}>
@@ -156,17 +147,13 @@ export default function Selection({user, onStart}: Props) {

Allow you to practice writing in a variety of formats, from simple paragraphs to complex essays.

- + {!selectedModules.includes("writing") &&
} + {selectedModules.includes("writing") && }
toggleModule("speaking")} className={clsx( - "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12", + "relative w-fit max-w-xs flex flex-col items-center bg-mti-white-alt transition duration-300 ease-in-out border p-5 rounded-xl gap-2 pt-12 cursor-pointer", selectedModules.includes("speaking") ? "border-mti-green-light" : "border-mti-gray-platinum", )}>
@@ -176,15 +163,17 @@ export default function Selection({user, onStart}: Props) {

You'll have access to interactive dialogs, pronunciation exercises and speech recordings.

- + {!selectedModules.includes("speaking") &&
} + {selectedModules.includes("speaking") && }
+ ); diff --git a/src/pages/test.tsx b/src/pages/test.tsx index 7d3881dc..cda40997 100644 --- a/src/pages/test.tsx +++ b/src/pages/test.tsx @@ -39,6 +39,7 @@ export default function Page() { const {user} = useUser({redirectTo: "/login"}); const [recordingDuration, setRecordingDuration] = useState(0); const [isRecording, setIsRecording] = useState(false); + const [mediaBlob, setMediaBlob] = useState(); useEffect(() => { let recordingInterval: NodeJS.Timer | undefined = undefined; @@ -73,6 +74,7 @@ export default function Page() {
setMediaBlob(blob)} render={({status, startRecording, stopRecording, pauseRecording, resumeRecording, clearBlobUrl, mediaBlobUrl}) => (

Record your answer: