useMemo bad, reworked the student and admin fetchers

frontend/src/components/Courses/CourseDetailTeacher.tsx

@@ -17,7 +17,7 @@ import {
   Tooltip,
   Typography,
 } from "@mui/material";
-import { ChangeEvent, useCallback, useEffect, useMemo, useState } from "react";
+import { ChangeEvent, useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import {
   Course,
@@ -142,27 +142,37 @@ export function CourseDetailTeacher(): JSX.Element {
   const lang = i18n.language;
   const navigate = useNavigate();
 
-  useMemo(() => {
-    setAdminObjects([]);
-    const admins_and_teacher = admins.concat({uid: course.teacher});
-    admins_and_teacher.forEach((admin) => {
-      getUser(admin.uid).then((user: Me) => {
-        setAdminObjects((prev) => {
-          return [...prev, user];
-        });
-      });
-    });
+  useEffect(() => {
+    const fetchAdminData = async () => {
+      setAdminObjects([]);
+      const admins_and_teacher = admins.concat({ uid: course.teacher });
+      const adminObjects: Me[] = [];
+
+      for (const admin of admins_and_teacher) {
+        const user = await getUser(admin.uid);
+        adminObjects.push(user);
+      }
+
+      setAdminObjects(adminObjects);
+    };
+
+    fetchAdminData();
   }, [admins, course]);
 
-  useMemo(() => {
-    setStudentObjects([]);
-    students.forEach((student) => {
-      getUser(student.uid).then((user: Me) => {
-        setStudentObjects((prev) => {
-          return [...prev, user];
-        });
-      });
-    });
+  useEffect(() => {
+    const fetchStudentData = async () => {
+      setStudentObjects([]);
+      const studentObjects: Me[] = [];
+
+      for (const student of students) {
+        const user = await getUser(student.uid);
+        studentObjects.push(user);
+      }
+
+      setStudentObjects(studentObjects);
+    };
+
+    fetchStudentData();
   }, [students]);
 
   const handleCheckboxChange = (