Finallyyyyyy finished the whole Speaking flow along with the solution page

src/components/Exercises/Speaking.tsx

@@ -4,7 +4,6 @@ import {Fragment, useEffect, useState} from "react";
 import {BsCheckCircleFill, BsMicFill, BsPauseCircle, BsPlayCircle, BsTrashFill} from "react-icons/bs";
 import dynamic from "next/dynamic";
 import Button from "../Low/Button";
-import axios from "axios";
 
 const Waveform = dynamic(() => import("../Waveform"), {ssr: false});
 const ReactMediaRecorder = dynamic(() => import("react-media-recorder").then((mod) => mod.ReactMediaRecorder), {
@@ -29,31 +28,6 @@ export default function Speaking({id, title, text, type, prompts, onNext, onBack
 		};
 	}, [isRecording]);
 
-	useEffect(() => {
-		const uploadFile = () => {
-			if (mediaBlob) {
-				axios.get(mediaBlob, {responseType: "arraybuffer"}).then((response) => {
-					const audioBlob = Buffer.from(response.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", `${text.replaceAll("\n", "")} You should talk about: ${prompts.join(", ")}`);
-
-					const config = {
-						headers: {
-							"Content-Type": "audio/mp3",
-						},
-					};
-
-					axios.post("/api/evaluate/speaking", formData, config);
-				});
-			}
-		};
-
-		if (mediaBlob) uploadFile();
-	}, [mediaBlob, text, prompts]);
-
 	return (
 		<div className="flex flex-col h-full w-full gap-9">
 			<div className="flex flex-col w-full gap-14 bg-mti-gray-smoke rounded-xl py-8 pb-12 px-16">