From 8fc2cf571e814003458f97557b59a87c5ad3c634 Mon Sep 17 00:00:00 2001 From: Tiago Ribeiro Date: Tue, 7 May 2024 08:37:09 +0100 Subject: [PATCH] Disabled the Play Again for admins --- src/exams/Finish.tsx | 546 +++++++++++++++++++------------------------ 1 file changed, 237 insertions(+), 309 deletions(-) diff --git a/src/exams/Finish.tsx b/src/exams/Finish.tsx index ea10457a..3cdf7a41 100644 --- a/src/exams/Finish.tsx +++ b/src/exams/Finish.tsx @@ -1,333 +1,261 @@ import Button from "@/components/Low/Button"; import ModuleTitle from "@/components/Medium/ModuleTitle"; -import { moduleResultText } from "@/constants/ielts"; -import { Module } from "@/interfaces"; -import { User } from "@/interfaces/user"; +import {moduleResultText} from "@/constants/ielts"; +import {Module} from "@/interfaces"; +import {User} from "@/interfaces/user"; import useExamStore from "@/stores/examStore"; -import { calculateBandScore } from "@/utils/score"; +import {calculateBandScore} from "@/utils/score"; import clsx from "clsx"; import Link from "next/link"; -import { useRouter } from "next/router"; -import { Fragment, useEffect, useState } from "react"; -import { - BsArrowCounterclockwise, - BsBook, - BsClipboard, - BsEyeFill, - BsHeadphones, - BsMegaphone, - BsPen, - BsShareFill, -} from "react-icons/bs"; -import { LevelScore } from "@/constants/ielts"; -import { getLevelScore } from "@/utils/score"; -import { capitalize } from "lodash"; +import {useRouter} from "next/router"; +import {Fragment, useEffect, useState} from "react"; +import {BsArrowCounterclockwise, BsBook, BsClipboard, BsEyeFill, BsHeadphones, BsMegaphone, BsPen, BsShareFill} from "react-icons/bs"; +import {LevelScore} from "@/constants/ielts"; +import {getLevelScore} from "@/utils/score"; +import {capitalize} from "lodash"; interface Score { - module: Module; - correct: number; - total: number; - missing: number; + module: Module; + correct: number; + total: number; + missing: number; } interface Props { - user: User; - modules: Module[]; - scores: Score[]; - isLoading: boolean; - onViewResults: (moduleIndex?: number) => void; + user: User; + modules: Module[]; + scores: Score[]; + isLoading: boolean; + onViewResults: (moduleIndex?: number) => void; } -export default function Finish({ - user, - scores, - modules, - isLoading, - onViewResults, -}: Props) { - const [selectedModule, setSelectedModule] = useState(modules[0]); - const [selectedScore, setSelectedScore] = useState( - scores.find((x) => x.module === modules[0])!, - ); +export default function Finish({user, scores, modules, isLoading, onViewResults}: Props) { + const [selectedModule, setSelectedModule] = useState(modules[0]); + const [selectedScore, setSelectedScore] = useState(scores.find((x) => x.module === modules[0])!); - const exams = useExamStore((state) => state.exams); + const exams = useExamStore((state) => state.exams); - useEffect( - () => setSelectedScore(scores.find((x) => x.module === selectedModule)!), - [scores, selectedModule], - ); + useEffect(() => setSelectedScore(scores.find((x) => x.module === selectedModule)!), [scores, selectedModule]); - const moduleColors: { [key in Module]: { progress: string; inner: string } } = - { - reading: { - progress: "text-ielts-reading", - inner: "bg-ielts-reading-light", - }, - listening: { - progress: "text-ielts-listening", - inner: "bg-ielts-listening-light", - }, - writing: { - progress: "text-ielts-writing", - inner: "bg-ielts-writing-light", - }, - speaking: { - progress: "text-ielts-speaking", - inner: "bg-ielts-speaking-light", - }, - level: { - progress: "text-ielts-level", - inner: "bg-ielts-level-light", - }, - }; + const moduleColors: {[key in Module]: {progress: string; inner: string}} = { + reading: { + progress: "text-ielts-reading", + inner: "bg-ielts-reading-light", + }, + listening: { + progress: "text-ielts-listening", + inner: "bg-ielts-listening-light", + }, + writing: { + progress: "text-ielts-writing", + inner: "bg-ielts-writing-light", + }, + speaking: { + progress: "text-ielts-speaking", + inner: "bg-ielts-speaking-light", + }, + level: { + progress: "text-ielts-level", + inner: "bg-ielts-level-light", + }, + }; - const getTotalExercises = () => { - const exam = exams.find((x) => x.module === selectedModule)!; - if (exam.module === "reading" || exam.module === "listening") { - return exam.parts.flatMap((x) => x.exercises).length; - } + const getTotalExercises = () => { + const exam = exams.find((x) => x.module === selectedModule)!; + if (exam.module === "reading" || exam.module === "listening") { + return exam.parts.flatMap((x) => x.exercises).length; + } - return exam.exercises.length; - }; + return exam.exercises.length; + }; - const bandScore: number = calculateBandScore( - selectedScore.correct, - selectedScore.total, - selectedModule, - user.focus, - ); + const bandScore: number = calculateBandScore(selectedScore.correct, selectedScore.total, selectedModule, user.focus); - const showLevel = (level: number) => { - if (selectedModule === "level") { - const [levelStr, grade] = getLevelScore(level); - return ( -
- {levelStr} -
- ); - } + const showLevel = (level: number) => { + if (selectedModule === "level") { + const [levelStr, grade] = getLevelScore(level); + return ( +
+ {levelStr} +
+ ); + } - return {level}; - }; + return {level}; + }; - return ( - <> -
- x.module === selectedModule)!.minTimer} - disableTimer - /> -
- {modules.includes("reading") && ( -
setSelectedModule("reading")} - className={clsx( - "hover:bg-ielts-reading flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", - selectedModule === "reading" - ? "bg-ielts-reading text-white" - : "bg-mti-gray-smoke text-ielts-reading", - )} - > - - Reading -
- )} - {modules.includes("listening") && ( -
setSelectedModule("listening")} - className={clsx( - "hover:bg-ielts-listening flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", - selectedModule === "listening" - ? "bg-ielts-listening text-white" - : "bg-mti-gray-smoke text-ielts-listening", - )} - > - - Listening -
- )} - {modules.includes("writing") && ( -
setSelectedModule("writing")} - className={clsx( - "hover:bg-ielts-writing flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", - selectedModule === "writing" - ? "bg-ielts-writing text-white" - : "bg-mti-gray-smoke text-ielts-writing", - )} - > - - Writing -
- )} - {modules.includes("speaking") && ( -
setSelectedModule("speaking")} - className={clsx( - "hover:bg-ielts-speaking flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", - selectedModule === "speaking" - ? "bg-ielts-speaking text-white" - : "bg-mti-gray-smoke text-ielts-speaking", - )} - > - - Speaking -
- )} - {modules.includes("level") && ( -
setSelectedModule("level")} - className={clsx( - "hover:bg-ielts-level flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", - selectedModule === "level" - ? "bg-ielts-level text-white" - : "bg-mti-gray-smoke text-ielts-level", - )} - > - - Level -
- )} -
- {isLoading && ( -
- - - Evaluating your answers, please be patient... -
- You can also check it later on your records page! - -
- )} - {!isLoading && ( -
- - {moduleResultText(selectedModule, bandScore)} - -
-
-
- Level - {showLevel(bandScore)} -
-
- {!["writing", "speaking"].includes(selectedModule) ? ( -
-
-
-
- - {( - ((selectedScore.total - selectedScore.missing) / - selectedScore.total) * - 100 - ).toFixed(0)} - % - - Completion -
-
-
-
-
- - {selectedScore.correct.toString().padStart(2, "0")} - - Correct -
-
-
-
-
- - {(selectedScore.total - selectedScore.correct) - .toString() - .padStart(2, "0")} - - Wrong -
-
-
- ) : ( -
- )} -
-
- )} -
+ return ( + <> +
+ x.module === selectedModule)!.minTimer} + disableTimer + /> +
+ {modules.includes("reading") && ( +
setSelectedModule("reading")} + className={clsx( + "hover:bg-ielts-reading flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", + selectedModule === "reading" ? "bg-ielts-reading text-white" : "bg-mti-gray-smoke text-ielts-reading", + )}> + + Reading +
+ )} + {modules.includes("listening") && ( +
setSelectedModule("listening")} + className={clsx( + "hover:bg-ielts-listening flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", + selectedModule === "listening" ? "bg-ielts-listening text-white" : "bg-mti-gray-smoke text-ielts-listening", + )}> + + Listening +
+ )} + {modules.includes("writing") && ( +
setSelectedModule("writing")} + className={clsx( + "hover:bg-ielts-writing flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", + selectedModule === "writing" ? "bg-ielts-writing text-white" : "bg-mti-gray-smoke text-ielts-writing", + )}> + + Writing +
+ )} + {modules.includes("speaking") && ( +
setSelectedModule("speaking")} + className={clsx( + "hover:bg-ielts-speaking flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", + selectedModule === "speaking" ? "bg-ielts-speaking text-white" : "bg-mti-gray-smoke text-ielts-speaking", + )}> + + Speaking +
+ )} + {modules.includes("level") && ( +
setSelectedModule("level")} + className={clsx( + "hover:bg-ielts-level flex cursor-pointer items-center gap-2 rounded-xl p-4 transition duration-300 ease-in-out hover:text-white hover:shadow-lg", + selectedModule === "level" ? "bg-ielts-level text-white" : "bg-mti-gray-smoke text-ielts-level", + )}> + + Level +
+ )} +
+ {isLoading && ( +
+ + + Evaluating your answers, please be patient... +
+ You can also check it later on your records page! + +
+ )} + {!isLoading && ( +
+ {moduleResultText(selectedModule, bandScore)} +
+
+
+ Level + {showLevel(bandScore)} +
+
+ {!["writing", "speaking"].includes(selectedModule) ? ( +
+
+
+
+ + {(((selectedScore.total - selectedScore.missing) / selectedScore.total) * 100).toFixed(0)}% + + Completion +
+
+
+
+
+ {selectedScore.correct.toString().padStart(2, "0")} + Correct +
+
+
+
+
+ + {(selectedScore.total - selectedScore.correct).toString().padStart(2, "0")} + + Wrong +
+
+
+ ) : ( +
+ )} +
+
+ )} +
- {!isLoading && ( -
-
-
- - Play Again -
-
- - Review All -
-
- - Review {capitalize(selectedModule)} -
-
+ {!isLoading && ( +
+
+
+ + Play Again +
+
+ + Review All +
+
+ + Review {capitalize(selectedModule)} +
+
- - - -
- )} - - ); + + + +
+ )} + + ); }