/* eslint-disable @next/next/no-img-element */

import { withIronSessionSsr } from "iron-session/next";
import { sessionOptions } from "@/lib/session";
import { shouldRedirectHome } from "@/utils/navigation.disabled";
import ExamPage from "./(exam)/ExamPage";
import Head from "next/head";
import { User } from "@/interfaces/user";
import { filterBy, redirect, serialize } from "@/utils";
import { requestUser } from "@/utils/api";
import { getAssignment } from "@/utils/assignments.be";
import { Assignment } from "@/interfaces/results";
import useExamStore from "@/stores/exam";
import { useEffect } from "react";
import { Exam } from "@/interfaces/exam";
import { getExamsByIds } from "@/utils/exams.be";
import { sortByModule } from "@/utils/moduleUtils";
import { uniqBy } from "lodash";
import { useRouter } from "next/router";
import { getSessionByAssignment } from "@/utils/sessions.be";
import { Session } from "@/hooks/useSessions";
import { activeAssignmentFilter } from "@/utils/assignments";
import { checkAccess } from "@/utils/permissions";

export const getServerSideProps = withIronSessionSsr(async ({ req, res, query }) => {
	const user = await requestUser(req, res)
	const loginDestination = Buffer.from(req.url || "/").toString("base64")
	if (!user) return redirect(`/login?destination=${loginDestination}`)

	if (shouldRedirectHome(user)) return redirect("/")

	const { assignment: assignmentID, destination } = query as { assignment?: string, destination?: string }
	const destinationURL = !!destination ? Buffer.from(destination, 'base64').toString() : undefined

	if (assignmentID) {
		const assignment = await getAssignment(assignmentID)

		if (!assignment) return redirect(destinationURL || "/exam")
		if (!assignment.assignees.includes(user.id) && !["admin", "developer"].includes(user.type))
			return redirect(destinationURL || "/exam")

		if (filterBy(assignment.results, 'user', user.id).length > 0)
			return redirect(destinationURL || "/exam")

		const exams = await getExamsByIds(uniqBy(assignment.exams, "id"))
		const session = await getSessionByAssignment(assignmentID)

		return {
			props: serialize({ user, assignment, exams, destinationURL, session: session ?? undefined })
		}
	}

	return {
		props: serialize({ user, destinationURL }),
	};
}, sessionOptions);

interface Props {
	user: User;
	assignment?: Assignment
	exams?: Exam[]
	session?: Session
	destinationURL?: string
}

const Page: React.FC<Props> = ({ user, assignment, exams = [], destinationURL = "/exam", session }) => {
	const router = useRouter()
	const { assignment: storeAssignment, dispatch } = useExamStore();

	useEffect(() => {
		if (assignment && exams.length > 0 && !storeAssignment && !session) {
			if (!activeAssignmentFilter(assignment)) return
			dispatch({
				type: "INIT_EXAM", payload: {
					exams: exams.sort(sortByModule),
					modules: exams
						.map((x) => x!)
						.sort(sortByModule)
						.map((x) => x!.module),
					assignment
				}
			});

			router.replace(router.asPath)
		}
		// eslint-disable-next-line react-hooks/exhaustive-deps
	}, [assignment, exams, session])

	useEffect(() => {
		if (assignment && exams.length > 0 && !storeAssignment && !!session) {
			dispatch({ type: "SET_SESSION", payload: { session } })
			router.replace(router.asPath)
		}
		// eslint-disable-next-line react-hooks/exhaustive-deps
	}, [assignment, exams, session])

	return (
		<>
			<Head>
				<title>Exams | EnCoach</title>
				<meta
					name="description"
					content="A training platform for the IELTS exam provided by the Muscat Training Institute and developed by eCrop."
				/>
				<meta name="viewport" content="width=device-width, initial-scale=1" />
				<link rel="icon" href="/favicon.ico" />
			</Head>
			<ExamPage page="exams" destination={destinationURL} user={user} hideSidebar={!!assignment || !!storeAssignment} />
		</>
	);
}

//Page.whyDidYouRender = true;
export default Page;
