/* eslint-disable @next/next/no-img-element */ import Head from "next/head"; import { withIronSessionSsr } from "iron-session/next"; import { sessionOptions } from "@/lib/session"; import { toast, ToastContainer } from "react-toastify"; import Layout from "@/components/High/Layout"; import { shouldRedirectHome } from "@/utils/navigation.disabled"; import { Radio, RadioGroup } from "@headlessui/react"; import clsx from "clsx"; import { MODULE_ARRAY } from "@/utils/moduleUtils"; import { capitalize } from "lodash"; import Input from "@/components/Low/Input"; import { checkAccess } from "@/utils/permissions"; import { User } from "@/interfaces/user"; import useExamEditorStore from "@/stores/examEditor"; import ExamEditorStore from "@/stores/examEditor/types"; import ExamEditor from "@/components/ExamEditor"; import MultipleAudioUploader from "@/components/ExamEditor/Shared/AudioEdit"; import { redirect, serialize } from "@/utils"; import { requestUser } from "@/utils/api"; import { useEffect } from "react"; import { Exercise, InteractiveSpeakingExercise, ListeningPart, SpeakingExercise } from "@/interfaces/exam"; import axios from "axios"; export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => { const user = await requestUser(req, res) if (!user) return redirect("/login") if (shouldRedirectHome(user) || !checkAccess(user, ["admin", "mastercorporate", "developer", "corporate"])) return redirect("/") return { props: serialize({ user }), }; }, sessionOptions); export default function Generation({ user }: { user: User; }) { const { title, currentModule, modules, dispatch } = useExamEditorStore(); const updateRoot = (updates: Partial) => { dispatch({ type: 'UPDATE_ROOT', payload: { updates } }); }; useEffect(() => { const fetchAvatars = async () => { const response = await axios.get("/api/exam/avatars"); console.log(response.data); updateRoot({ speakingAvatars: response.data }); }; fetchAvatars(); // eslint-disable-next-line react-hooks/exhaustive-deps }, []); // media cleanup on unmount useEffect(() => { return () => { const state = modules; state.listening.sections.forEach(section => { const listeningPart = section.state as ListeningPart; if (listeningPart.audio?.source) { URL.revokeObjectURL(listeningPart.audio.source); dispatch({ type: "UPDATE_SECTION_SINGLE_FIELD", payload: { sectionId: section.sectionId, module: "listening", field: "state", value: { ...listeningPart, audio: undefined } } }) } }); state.speaking.sections.forEach(section => { const sectionState = section.state as Exercise; if (sectionState.type === 'speaking') { const speakingExercise = sectionState as SpeakingExercise; URL.revokeObjectURL(speakingExercise.video_url); dispatch({ type: "UPDATE_SECTION_SINGLE_FIELD", payload: { sectionId: section.sectionId, module: "listening", field: "state", value: { ...speakingExercise, video_url: undefined } } }) } if (sectionState.type === 'interactiveSpeaking') { const interactiveSpeaking = sectionState as InteractiveSpeakingExercise; interactiveSpeaking.prompts.forEach(prompt => { URL.revokeObjectURL(prompt.video_url); }); dispatch({ type: "UPDATE_SECTION_SINGLE_FIELD", payload: { sectionId: section.sectionId, module: "listening", field: "state", value: { ...interactiveSpeaking, prompts: interactiveSpeaking.prompts.map((p) => ({ ...p, video_url: undefined })) } } }) } }); }; // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( <> Exam Generation | EnCoach {user && (

Exam Generation

updateRoot({ title })} roundness="xl" defaultValue={title} required /> {/**/} Module updateRoot({ currentModule })} className="flex flex-row -2xl:flex-wrap w-full gap-4 -md:justify-center justify-between"> {[...MODULE_ARRAY].map((x) => ( {({ checked }) => ( {capitalize(x)} )} ))}

)} ); }