From 729204a095abac32e2abfcb99b952d5dd4de3728 Mon Sep 17 00:00:00 2001
From: Tiago Ribeiro <tiago.ribeiro@ecrop.dev>
Date: Tue, 24 Oct 2023 14:47:01 +0100
Subject: [PATCH] May have solved a bug made in the writing and speaking
 evaluation

---
 src/components/Solutions/Speaking.tsx | 53 +++++++++++++++++----------
 src/pages/(exam)/ExamPage.tsx         | 33 +++++++++--------
 2 files changed, 51 insertions(+), 35 deletions(-)

diff --git a/src/components/Solutions/Speaking.tsx b/src/components/Solutions/Speaking.tsx
index 08c0c590..e0d0e955 100644
--- a/src/components/Solutions/Speaking.tsx
+++ b/src/components/Solutions/Speaking.tsx
@@ -9,10 +9,12 @@ import {speakingReverseMarking} from "@/utils/score";
 
 const Waveform = dynamic(() => import("../Waveform"), {ssr: false});
 
-export default function Speaking({id, type, title, text, prompts, userSolutions, onNext, onBack}: SpeakingExercise & CommonProps) {
+export default function Speaking({id, type, title, video_url, text, prompts, userSolutions, onNext, onBack}: SpeakingExercise & CommonProps) {
 	const [solutionURL, setSolutionURL] = useState<string>();
 
 	useEffect(() => {
+		console.log(userSolutions);
+
 		if (userSolutions && userSolutions.length > 0) {
 			axios.post(`/api/speaking`, {path: userSolutions[0].solution}, {responseType: "arraybuffer"}).then(({data}) => {
 				const blob = new Blob([data], {type: "audio/wav"});
@@ -26,27 +28,40 @@ export default function Speaking({id, type, title, text, prompts, userSolutions,
 	return (
 		<>
 			<div className="flex flex-col h-full w-full gap-8 mb-20">
-				<div className="flex flex-col w-full gap-14 bg-mti-gray-smoke rounded-xl py-8 pb-12 px-16">
+				<div className="flex flex-col w-full gap-2 bg-mti-gray-smoke rounded-xl py-8 px-16">
 					<div className="flex flex-col gap-3">
 						<span className="font-semibold">{title}</span>
-						<span className="font-regular">
-							{text.split("\\n").map((line, index) => (
-								<Fragment key={index}>
-									<span>{line}</span>
-									<br />
-								</Fragment>
-							))}
-						</span>
+						{!video_url && (
+							<span className="font-regular">
+								{text.split("\\n").map((line, index) => (
+									<Fragment key={index}>
+										<span>{line}</span>
+										<br />
+									</Fragment>
+								))}
+							</span>
+						)}
 					</div>
-					<div className="flex flex-col gap-4">
-						<span className="font-bold">You should talk about the following things:</span>
-						<div className="flex flex-col gap-1 ml-4">
-							{prompts.map((x, index) => (
-								<li className="italic" key={index}>
-									{x}
-								</li>
-							))}
-						</div>
+					<div className="flex gap-6">
+						{video_url && (
+							<div className="flex flex-col gap-4 w-full items-center">
+								<video key={id} autoPlay controls className="max-w-3xl rounded-xl">
+									<source src={video_url} />
+								</video>
+							</div>
+						)}
+						{prompts && prompts.length > 0 && (
+							<div className="flex flex-col gap-4">
+								<span className="font-bold">You should talk about the following things:</span>
+								<div className="flex flex-col gap-1 ml-4">
+									{prompts.map((x, index) => (
+										<li className="italic" key={index}>
+											{x}
+										</li>
+									))}
+								</div>
+							</div>
+						)}
 					</div>
 				</div>
 
diff --git a/src/pages/(exam)/ExamPage.tsx b/src/pages/(exam)/ExamPage.tsx
index 83607752..e138667b 100644
--- a/src/pages/(exam)/ExamPage.tsx
+++ b/src/pages/(exam)/ExamPage.tsx
@@ -46,6 +46,9 @@ export default function ExamPage({page}: Props) {
 	const router = useRouter();
 
 	useEffect(() => setSessionId(uuidv4()), []);
+	useEffect(() => {
+		console.log({userSolutions});
+	}, [userSolutions]);
 
 	useEffect(() => {
 		selectedModules.length > 0 && timeSpent === 0 && !showSolutions;
@@ -134,24 +137,22 @@ export default function ExamPage({page}: Props) {
 
 			Promise.all(
 				exam.exercises.map(async (exercise) => {
-					if (exercise.type === "writing")
-						return evaluateWritingAnswer(exercise, solutions.find((x) => x.exercise === exercise.id)!).then((response) => {
-							if (response) {
-								setUserSolutions([...userSolutions.filter((x) => x.exercise !== exercise.id), response]);
-							}
-						});
+					if (exercise.type === "writing") {
+						return await evaluateWritingAnswer(exercise, solutions.find((x) => x.exercise === exercise.id)!);
+					}
 
-					if (exercise.type === "interactiveSpeaking" || exercise.type === "speaking")
-						return evaluateSpeakingAnswer(exercise, solutions.find((x) => x.exercise === exercise.id)!).then((response) => {
-							if (response) {
-								setUserSolutions([...userSolutions.filter((x) => x.exercise !== exercise.id), response]);
-							}
-						});
+					if (exercise.type === "interactiveSpeaking" || exercise.type === "speaking") {
+						return await evaluateSpeakingAnswer(exercise, solutions.find((x) => x.exercise === exercise.id)!);
+					}
 				}),
-			).finally(() => {
-				setIsEvaluationLoading(false);
-				setHasBeenUploaded(false);
-			});
+			)
+				.then((responses) => {
+					setUserSolutions([...userSolutions, ...responses.filter((x) => !!x)] as any);
+				})
+				.finally(() => {
+					setIsEvaluationLoading(false);
+					setHasBeenUploaded(false);
+				});
 		}
 
 		axios.get("/api/stats/update");