Updated the backend so the users list only returns the correct ones

src/dashboards/Teacher.tsx

@@ -51,6 +51,7 @@ import usePermissions from "@/hooks/usePermissions";
 import {futureAssignmentFilter, pastAssignmentFilter, archivedAssignmentFilter, activeAssignmentFilter} from "@/utils/assignments";
 import AssignmentsPage from "./views/AssignmentsPage";
 import {useRouter} from "next/router";
+import useFilterStore from "@/stores/listFilterStore";
 
 interface Props {
 	user: User;
@@ -67,6 +68,7 @@ export default function TeacherDashboard({user, linkedCorporate}: Props) {
 	const {permissions} = usePermissions(user.id);
 	const {assignments, isLoading: isAssignmentsLoading, reload: reloadAssignments} = useAssignments({assigner: user.id});
 
+	const appendUserFilters = useFilterStore((state) => state.appendUserFilter);
 	const router = useRouter();
 
 	const assignmentsGroups = useMemo(() => groups.filter((x) => x.admin === user.id || x.participants.includes(user.id)), [groups, user.id]);
@@ -90,7 +92,7 @@ export default function TeacherDashboard({user, linkedCorporate}: Props) {
 		setShowModal(!!selectedUser && router.asPath === "/#");
 	}, [selectedUser, router.asPath]);
 
-	const studentFilter = (user: User) => user.type === "student" && groups.flatMap((g) => g.participants).includes(user.id);
+	const studentFilter = (user: User) => user.type === "student";
 
 	const getStatsByStudent = (user: User) => stats.filter((s) => s.user === user.id);
 
@@ -106,35 +108,6 @@ export default function TeacherDashboard({user, linkedCorporate}: Props) {
 		</div>
 	);
 
-	const StudentsList = () => {
-		const filter = (x: User) =>
-			x.type === "student" &&
-			(!!selectedUser
-				? groups
-						.filter((g) => g.admin === selectedUser.id)
-						.flatMap((g) => g.participants)
-						.includes(x.id) || false
-				: groups.flatMap((g) => g.participants).includes(x.id));
-
-		return (
-			<UserList
-				user={user}
-				filters={[filter]}
-				renderHeader={(total) => (
-					<div className="flex flex-col gap-4">
-						<div
-							onClick={() => router.push("/")}
-							className="flex gap-2 items-center text-mti-purple-light cursor-pointer hover:text-mti-purple-dark transition ease-in-out duration-300">
-							<BsArrowLeft className="text-xl" />
-							<span>Back</span>
-						</div>
-						<h2 className="text-2xl font-semibold">Students ({total})</h2>
-					</div>
-				)}
-			/>
-		);
-	};
-
 	const GroupsList = () => {
 		const filter = (x: Group) => x.admin === user.id;
 
@@ -285,16 +258,68 @@ export default function TeacherDashboard({user, linkedCorporate}: Props) {
 									if (shouldReload) reload();
 								}}
 								onViewStudents={
-									selectedUser.type === "corporate" || selectedUser.type === "teacher" ? () => router.push("/#students") : undefined
+									selectedUser.type === "corporate" || selectedUser.type === "teacher"
+										? () => {
+												appendUserFilters({
+													id: "view-students",
+													filter: (x: User) => x.type === "student",
+												});
+												appendUserFilters({
+													id: "belongs-to-admin",
+													filter: (x: User) =>
+														groups
+															.filter((g) => g.admin === selectedUser.id || g.participants.includes(selectedUser.id))
+															.flatMap((g) => g.participants)
+															.includes(x.id),
+												});
+
+												router.push("/list/users");
+										  }
+										: undefined
+								}
+								onViewTeachers={
+									selectedUser.type === "corporate" || selectedUser.type === "student"
+										? () => {
+												appendUserFilters({
+													id: "view-teachers",
+													filter: (x: User) => x.type === "teacher",
+												});
+												appendUserFilters({
+													id: "belongs-to-admin",
+													filter: (x: User) =>
+														groups
+															.filter((g) => g.admin === selectedUser.id || g.participants.includes(selectedUser.id))
+															.flatMap((g) => g.participants)
+															.includes(x.id),
+												});
+
+												router.push("/list/users");
+										  }
+										: undefined
 								}
-								onViewTeachers={selectedUser.type === "corporate" ? () => router.push("/#teachers") : undefined}
 								user={selectedUser}
 							/>
 						</div>
 					)}
 				</>
 			</Modal>
-			{router.asPath === "/#students" && <StudentsList />}
+			{router.asPath === "/#students" && (
+				<UserList
+					user={user}
+					filters={[(x) => x.type === "student"]}
+					renderHeader={(total) => (
+						<div className="flex flex-col gap-4">
+							<div
+								onClick={() => router.push("/")}
+								className="flex gap-2 items-center text-mti-purple-light cursor-pointer hover:text-mti-purple-dark transition ease-in-out duration-300">
+								<BsArrowLeft className="text-xl" />
+								<span>Back</span>
+							</div>
+							<h2 className="text-2xl font-semibold">Students ({total})</h2>
+						</div>
+					)}
+				/>
+			)}
 			{router.asPath === "/#groups" && <GroupsList />}
 			{router.asPath === "/#assignments" && (
 				<AssignmentsPage