import {Module} from "@/interfaces";
import {moduleLabels} from "@/utils/moduleUtils";
import {ReactNode, useEffect, useState} from "react";
import {BsBook, BsHeadphones, BsMegaphone, BsPen, BsStopwatch} from "react-icons/bs";
import ProgressBar from "../Low/ProgressBar";
interface Props {
minTimer: number;
module: Module;
exerciseIndex: number;
totalExercises: number;
}
export default function ModuleTitle({minTimer, module, exerciseIndex, totalExercises}: Props) {
const [timer, setTimer] = useState(minTimer * 60);
useEffect(() => {
const timerInterval = setInterval(() => setTimer((prev) => prev - 1), 1000);
return () => {
clearInterval(timerInterval);
};
}, [minTimer]);
const moduleIcon: {[key in Module]: ReactNode} = {
reading: ,
listening: ,
writing: ,
speaking: ,
};
return (
<>
{timer > 0 && (
<>
{Math.floor(timer / 60)
.toString(10)
.padStart(2, "0")}
:
{Math.floor(timer % 60)
.toString(10)
.padStart(2, "0")}
)}
{timer <= 0 && <>00:00}
{moduleIcon[module]}
{moduleLabels[module]} exam
Question {exerciseIndex}/{totalExercises}
);
}