Merge branch 'main' into migration-mongodb

src/dashboards/Corporate/MasterStatisticalPage.tsx

@@ -0,0 +1,45 @@
+import useUsers, {userHashStudent, userHashTeacher} from "@/hooks/useUsers";
+import {CorporateUser, User} from "@/interfaces/user";
+import {useRouter} from "next/router";
+import {useMemo} from "react";
+import {BsArrowLeft} from "react-icons/bs";
+import MasterStatistical from "../MasterCorporate/MasterStatistical";
+
+interface Props {
+	user: CorporateUser;
+}
+
+const MasterStatisticalPage = ({user}: Props) => {
+	const {users: students} = useUsers(userHashStudent);
+	const {users: teachers} = useUsers(userHashTeacher);
+
+	// this workaround will allow us toreuse the master statistical due to master corporate restraints
+	// while still being able to use the corporate user
+	const groupedByNameCorporateIds = useMemo(
+		() => ({
+			[user.corporateInformation?.companyInformation?.name || user.name]: [user.id],
+		}),
+		[user],
+	);
+
+	const teachersAndStudents = useMemo(() => [...students, ...teachers], [students, teachers]);
+
+	const router = useRouter();
+
+	return (
+		<>
+			<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">Master Statistical</h2>
+			</div>
+			<MasterStatistical users={teachersAndStudents} corporateUsers={groupedByNameCorporateIds} displaySelection={false} />
+		</>
+	);
+};
+
+export default MasterStatisticalPage;

src/dashboards/Corporate/index.tsx

@@ -53,6 +53,7 @@ import {futureAssignmentFilter, pastAssignmentFilter, archivedAssignmentFilter,
 import useUserBalance from "@/hooks/useUserBalance";
 import AssignmentsPage from "../views/AssignmentsPage";
 import StudentPerformancePage from "./StudentPerformancePage";
+import MasterStatistical from "../MasterCorporate/MasterStatistical";
 
 interface Props {
 	user: CorporateUser;

src/dashboards/MasterCorporate/MasterStatistical.tsx

@@ -23,6 +23,7 @@ interface GroupedCorporateUsers {
 interface Props {
 	corporateUsers: GroupedCorporateUsers;
 	users: User[];
+	displaySelection?: boolean;
 }
 
 interface TableData {
@@ -44,7 +45,7 @@ interface UserCount {
 const searchFilters = [["email"], ["user"], ["userId"]];
 
 const MasterStatistical = (props: Props) => {
-	const {users, corporateUsers} = props;
+	const {users, corporateUsers, displaySelection = true} = props;
 
 	// const corporateRelevantUsers = React.useMemo(
 	//   () => corporateUsers.filter((x) => x.type !== "student") as CorporateUser[],
@@ -154,6 +155,17 @@ const MasterStatistical = (props: Props) => {
 				return <span>{info.getValue()}</span>;
 			},
 		}),
+		...(displaySelection
+			? [
+					columnHelper.accessor("corporate", {
+						header: "Corporate",
+						id: "corporate",
+						cell: (info) => {
+							return <span>{info.getValue()}</span>;
+						},
+					}),
+			  ]
+			: []),
 		columnHelper.accessor("corporate", {
 			header: "Corporate",
 			id: "corporate",
@@ -259,46 +271,48 @@ const MasterStatistical = (props: Props) => {
 	const consolidateResults = getStudentsConsolidateScore();
 	return (
 		<>
-			<div className="flex flex-wrap gap-2 items-center text-center">
-				<IconCard
-					Icon={BsBank}
-					label="Consolidate"
-					value={getConsolidateScoreStr(consolidateScore)}
-					color="purple"
-					onClick={() => {
-						if (areAllSelected) {
-							setSelectedCorporates([]);
-							return;
-						}
-						setSelectedCorporates(corporates);
-					}}
-					isSelected={areAllSelected}
-				/>
-				{Object.keys(corporateUsers).map((corporateName) => {
-					const group = corporateUsers[corporateName];
-					const isSelected = group.every((id) => selectedCorporates.includes(id));
+			{displaySelection && (
+				<div className="flex flex-wrap gap-2 items-center text-center">
+					<IconCard
+						Icon={BsBank}
+						label="Consolidate"
+						value={getConsolidateScoreStr(consolidateScore)}
+						color="purple"
+						onClick={() => {
+							if (areAllSelected) {
+								setSelectedCorporates([]);
+								return;
+							}
+							setSelectedCorporates(corporates);
+						}}
+						isSelected={areAllSelected}
+					/>
+					{Object.keys(corporateUsers).map((corporateName) => {
+						const group = corporateUsers[corporateName];
+						const isSelected = group.every((id) => selectedCorporates.includes(id));
 
-					const valueHash = getCorporatesScoresHash(group);
-					const value = getConsolidateScoreStr(getConsolidateScore(valueHash));
-					return (
-						<IconCard
-							key={corporateName}
-							Icon={BsBank}
-							label={corporateName}
-							value={value}
-							color="purple"
-							onClick={() => {
-								if (isSelected) {
-									setSelectedCorporates((prev) => prev.filter((x) => !group.includes(x)));
-									return;
-								}
-								setSelectedCorporates((prev) => [...new Set([...prev, ...group])]);
-							}}
-							isSelected={isSelected}
-						/>
-					);
-				})}
-			</div>
+						const valueHash = getCorporatesScoresHash(group);
+						const value = getConsolidateScoreStr(getConsolidateScore(valueHash));
+						return (
+							<IconCard
+								key={corporateName}
+								Icon={BsBank}
+								label={corporateName}
+								value={value}
+								color="purple"
+								onClick={() => {
+									if (isSelected) {
+										setSelectedCorporates((prev) => prev.filter((x) => !group.includes(x)));
+										return;
+									}
+									setSelectedCorporates((prev) => [...new Set([...prev, ...group])]);
+								}}
+								isSelected={isSelected}
+							/>
+						);
+					})}
+				</div>
+			)}
 			<div className="flex gap-3 w-full">
 				<div className="flex flex-col gap-3">
 					<label className="font-normal text-base text-mti-gray-dim">Date</label>