Refactor most getServerProps to fetch independent request in parallel and projected the data only to return the necessary fields and changed some functions

src/pages/exercises.tsx

@@ -21,92 +21,100 @@ import { getSessionByAssignment } from "@/utils/sessions.be";
 import { Session } from "@/hooks/useSessions";
 import moment from "moment";
 
-export const getServerSideProps = withIronSessionSsr(async ({ req, res, query }) => {
-	const user = await requestUser(req, res)
-	const destination = Buffer.from(req.url || "/").toString("base64")
-	if (!user) return redirect(`/login?destination=${destination}`)
+export const getServerSideProps = withIronSessionSsr(
+  async ({ req, res, query }) => {
+    const user = await requestUser(req, res);
+    const destination = Buffer.from(req.url || "/").toString("base64");
+    if (!user) return redirect(`/login?destination=${destination}`);
 
-	if (shouldRedirectHome(user)) return redirect("/")
+    if (shouldRedirectHome(user)) return redirect("/");
 
-	const { assignment: assignmentID } = query as { assignment?: string }
+    const { assignment: assignmentID } = query as { assignment?: string };
 
-	if (assignmentID) {
-		const assignment = await getAssignment(assignmentID)
+    if (assignmentID) {
+      const assignment = await getAssignment(assignmentID);
 
-		if (!assignment) return redirect("/exam")
-		if (!["admin", "developer"].includes(user.type) && !assignment.assignees.includes(user.id)) return redirect("/exercises")
+      if (!assignment) return redirect("/exam");
+      if (
+        !["admin", "developer"].includes(user.type) &&
+        !assignment.assignees.includes(user.id)
+      )
+        return redirect("/exercises");
+      if (
+        filterBy(assignment.results, "user", user.id) ||
+        moment(assignment.startDate).isBefore(moment()) ||
+        moment(assignment.endDate).isAfter(moment())
+      )
+        return redirect("/exam");
+      const [exams, session] = await Promise.all([
+        getExamsByIds(uniqBy(assignment.exams, "id")),
+        getSessionByAssignment(assignmentID),
+      ]);
 
-		const exams = await getExamsByIds(uniqBy(assignment.exams, "id"))
-		const session = await getSessionByAssignment(assignmentID)
+      return {
+        props: serialize({ user, assignment, exams, session }),
+      };
+    }
 
-		if (
-			filterBy(assignment.results, 'user', user.id) ||
-			moment(assignment.startDate).isBefore(moment()) ||
-			moment(assignment.endDate).isAfter(moment())
-		)
-			return redirect("/exam")
-
-		return {
-			props: serialize({ user, assignment, exams, session })
-		}
-	}
-
-	return {
-		props: serialize({ user }),
-	};
-}, sessionOptions);
+    return {
+      props: serialize({ user }),
+    };
+  },
+  sessionOptions
+);
 
 interface Props {
-	user: User;
-	assignment?: Assignment
-	exams?: Exam[]
-	session?: Session
+  user: User;
+  assignment?: Assignment;
+  exams?: Exam[];
+  session?: Session;
 }
 
 export default function Page({ user, assignment, exams = [], session }: Props) {
-	const router = useRouter()
+  const router = useRouter();
 
-	const { assignment: storeAssignment, dispatch } = useExamStore()
+  const { assignment: storeAssignment, dispatch } = useExamStore();
 
-	useEffect(() => {
-		if (assignment && exams.length > 0 && !storeAssignment && !session) {
-			dispatch({
-				type: "INIT_EXAM", payload: {
-					exams: exams.sort(sortByModule),
-					modules: exams
-						.map((x) => x!)
-						.sort(sortByModule)
-						.map((x) => x!.module),
-					assignment
-				}
-			})
+  useEffect(() => {
+    if (assignment && exams.length > 0 && !storeAssignment && !session) {
+      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])
+      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 } });
+  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])
+      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" user={user} hideSidebar={!!assignment} />
-		</>
-	);
+  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" user={user} hideSidebar={!!assignment} />
+    </>
+  );
 }