Finalized the Speaking module exercise

src/pages/api/evaluate/speaking.ts

@@ -1,6 +1,5 @@
 // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
 import type {NextApiRequest, NextApiResponse} from "next";
-import {getFirestore, doc, getDoc} from "firebase/firestore";
 import {withIronSessionApiRoute} from "iron-session/next";
 import {sessionOptions} from "@/lib/session";
 import axios from "axios";
@@ -8,6 +7,7 @@ import formidable from "formidable";
 import PersistentFile from "formidable/PersistentFile";
 import {getStorage, ref, uploadBytes} from "firebase/storage";
 import fs from "fs";
+import {app} from "@/firebase";
 
 export default withIronSessionApiRoute(handler, sessionOptions);
 
@@ -17,7 +17,7 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
 		return;
 	}
 
-	const storage = getStorage();
+	const storage = getStorage(app);
 
 	const form = formidable({keepExtensions: true, uploadDir: "./"});
 	form.parse(req, (err, fields, files) => {
@@ -26,17 +26,20 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
 
 		const binary = fs.readFileSync((audioFile as any).filepath).buffer;
 		uploadBytes(audioFileRef, binary).then(async (snapshot) => {
-			// const backendRequest = await axios.post(`${process.env.BACKEND_URL}/speaking_task`, req.body as Body, {
-			// 	headers: {
-			// 		Authorization: `Bearer ${process.env.BACKEND_JWT}`,
-			// 	},
-			// });
+			const backendRequest = await axios.post(
+				`${process.env.BACKEND_URL}/speaking_task_1`,
+				{question: (fields.question as string[]).join(""), answer: snapshot.metadata.fullPath},
+				{
+					headers: {
+						Authorization: `Bearer ${process.env.BACKEND_JWT}`,
+					},
+				},
+			);
 
 			fs.rmSync((audioFile as any).filepath);
+			res.status(200).json({...backendRequest.data, fullPath: snapshot.metadata.fullPath});
 		});
 	});
-
-	res.status(200).json({ok: true});
 }
 
 export const config = {

src/pages/api/speaking.ts

@@ -0,0 +1,22 @@
+// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
+import type {NextApiRequest, NextApiResponse} from "next";
+import {withIronSessionApiRoute} from "iron-session/next";
+import {sessionOptions} from "@/lib/session";
+import {getDownloadURL, getStorage, ref} from "firebase/storage";
+import {app} from "@/firebase";
+
+// export default withIronSessionApiRoute(handler, sessionOptions);
+export default handler;
+
+async function handler(req: NextApiRequest, res: NextApiResponse) {
+	// if (!req.session.user) {
+	// 	res.status(401).json({ok: false});
+	// 	return;
+	// }
+
+	const storage = getStorage(app);
+	const {path} = req.body as {path: string};
+
+	const pathReference = ref(storage, path);
+	getDownloadURL(pathReference).then((url) => res.status(200).json({url}));
+}

src/pages/exam.tsx

@@ -5,7 +5,17 @@ import {Module} from "@/interfaces";
 
 import Selection from "@/exams/Selection";
 import Reading from "@/exams/Reading";
-import {Exam, ListeningExam, ReadingExam, SpeakingExam, UserSolution, WritingEvaluation, WritingExam, WritingExercise} from "@/interfaces/exam";
+import {
+	Exam,
+	ListeningExam,
+	ReadingExam,
+	SpeakingExam,
+	UserSolution,
+	Evaluation,
+	WritingExam,
+	WritingExercise,
+	SpeakingExercise,
+} from "@/interfaces/exam";
 import Listening from "@/exams/Listening";
 import Writing from "@/exams/Writing";
 import {ToastContainer, toast} from "react-toastify";
@@ -19,7 +29,7 @@ import {v4 as uuidv4} from "uuid";
 import useUser from "@/hooks/useUser";
 import useExamStore from "@/stores/examStore";
 import Layout from "@/components/High/Layout";
-import {writingReverseMarking} from "@/utils/score";
+import {speakingReverseMarking, writingReverseMarking} from "@/utils/score";
 
 export const getServerSideProps = withIronSessionSsr(({req, res}) => {
 	const user = req.session.user;
@@ -119,11 +129,47 @@ export default function Page() {
 		}
 	};
 
+	const evaluateSpeakingAnswer = async (examId: string, exerciseId: string, solution: UserSolution) => {
+		const speakingExam = exams.find((x) => x.id === examId)!;
+		const exercise = speakingExam.exercises.find((x) => x.id === exerciseId)! as SpeakingExercise;
+
+		const blobResponse = await axios.get(exercise.userSolutions[0].solution.trim());
+		const audioBlob = Buffer.from(blobResponse.data, "binary");
+		const audioFile = new File([audioBlob], "audio.wav", {type: "audio/wav"});
+
+		const formData = new FormData();
+		formData.append("audio", audioFile, "audio.wav");
+		formData.append("question", `${exercise.text.replaceAll("\n", "")} You should talk about: ${exercise.prompts.join(", ")}`);
+
+		const config = {
+			headers: {
+				"Content-Type": "audio/mp3",
+			},
+		};
+
+		const response = await axios.post("/api/evaluate/speaking", formData, config);
+
+		if (response.status === 200) {
+			setUserSolutions([
+				...userSolutions.filter((x) => x.exercise !== exerciseId),
+				{
+					...solution,
+					score: {
+						correct: speakingReverseMarking[response.data.overall],
+						missing: 0,
+						total: 100,
+					},
+					solutions: [{id: exerciseId, solution: response.data.fullPath, evaluation: response.data}],
+				},
+			]);
+		}
+	};
+
 	const evaluateWritingAnswer = async (examId: string, exerciseId: string, solution: UserSolution) => {
 		const writingExam = exams.find((x) => x.id === examId)!;
 		const exercise = writingExam.exercises.find((x) => x.id === exerciseId)! as WritingExercise;
 
-		const response = await axios.post<WritingEvaluation>("/api/evaluate/writing", {
+		const response = await axios.post<Evaluation>("/api/evaluate/writing", {
 			question: `${exercise.prompt} ${exercise.attachment ? exercise.attachment.description : ""}`.replaceAll("\n", ""),
 			answer: solution.solutions[0].solution.trim().replaceAll("\n", " "),
 		});
@@ -155,11 +201,17 @@ export default function Page() {
 	const onFinish = (solutions: UserSolution[]) => {
 		const solutionIds = solutions.map((x) => x.exercise);
 
-		if (exam && exam.module === "writing" && solutions.length > 0 && !showSolutions) {
+		if (exam && (exam.module === "writing" || exam.module === "speaking") && solutions.length > 0 && !showSolutions) {
 			setHasBeenUploaded(true);
 			setIsEvaluationLoading(true);
 			Promise.all(
-				exam.exercises.map((exercise) => evaluateWritingAnswer(exam.id, exercise.id, solutions.find((x) => x.exercise === exercise.id)!)),
+				exam.exercises.map((exercise) =>
+					(exam.module === "writing" ? evaluateWritingAnswer : evaluateSpeakingAnswer)(
+						exam.id,
+						exercise.id,
+						solutions.find((x) => x.exercise === exercise.id)!,
+					),
+				),
 			).finally(() => {
 				setIsEvaluationLoading(false);
 				setHasBeenUploaded(false);

src/pages/exercises.tsx

@@ -6,7 +6,7 @@ import {Module} from "@/interfaces";
 
 import Selection from "@/exams/Selection";
 import Reading from "@/exams/Reading";
-import {Exam, ListeningExam, ReadingExam, SpeakingExam, UserSolution, WritingEvaluation, WritingExam, WritingExercise} from "@/interfaces/exam";
+import {Exam, ListeningExam, ReadingExam, SpeakingExam, UserSolution, Evaluation, WritingExam, WritingExercise} from "@/interfaces/exam";
 import Listening from "@/exams/Listening";
 import Writing from "@/exams/Writing";
 import {ToastContainer, toast} from "react-toastify";
@@ -126,7 +126,7 @@ export default function Page() {
 		const writingExam = exams.find((x) => x.id === examId)!;
 		const exercise = writingExam.exercises.find((x) => x.id === exerciseId)! as WritingExercise;
 
-		const response = await axios.post<WritingEvaluation>("/api/evaluate/writing", {
+		const response = await axios.post<Evaluation>("/api/evaluate/writing", {
 			question: `${exercise.prompt} ${exercise.attachment ? exercise.attachment.description : ""}`.replaceAll("\n", ""),
 			answer: solution.solutions[0].solution.trim().replaceAll("\n", " "),
 		});