Added the statistical page as a permission based page

This commit is contained in:
Tiago Ribeiro
2024-11-22 17:20:09 +00:00
parent 50bbb0dacf
commit f6fc701fb7
4 changed files with 114 additions and 126 deletions

View File

@@ -2,6 +2,7 @@
import Layout from "@/components/High/Layout"; import Layout from "@/components/High/Layout";
import UserDisplayList from "@/components/UserDisplayList"; import UserDisplayList from "@/components/UserDisplayList";
import IconCard from "@/dashboards/IconCard"; import IconCard from "@/dashboards/IconCard";
import { useAllowedEntities } from "@/hooks/useEntityPermissions";
import { Module } from "@/interfaces"; import { Module } from "@/interfaces";
import { EntityWithRoles } from "@/interfaces/entity"; import { EntityWithRoles } from "@/interfaces/entity";
import { Assignment } from "@/interfaces/results"; import { Assignment } from "@/interfaces/results";
@@ -18,6 +19,7 @@ import { groupByExam } from "@/utils/stats";
import { getStatsByUsers } from "@/utils/stats.be"; import { getStatsByUsers } from "@/utils/stats.be";
import { filterAllowedUsers } from "@/utils/users.be"; import { filterAllowedUsers } from "@/utils/users.be";
import { getEntitiesUsers } from "@/utils/users.be"; import { getEntitiesUsers } from "@/utils/users.be";
import { clsx } from "clsx";
import { withIronSessionSsr } from "iron-session/next"; import { withIronSessionSsr } from "iron-session/next";
import { uniqBy } from "lodash"; import { uniqBy } from "lodash";
import moment from "moment"; import moment from "moment";
@@ -73,30 +75,7 @@ export default function Dashboard({ user, users, entities, assignments, stats, g
const router = useRouter(); const router = useRouter();
const averageLevelCalculator = (studentStats: Stat[]) => { const allowedEntityStatistics = useAllowedEntities(user, entities, 'view_entity_statistics')
const formattedStats = studentStats
.map((s) => ({
focus: students.find((u) => u.id === s.user)?.focus,
score: s.score,
module: s.module,
}))
.filter((f) => !!f.focus);
const bandScores = formattedStats.map((s) => ({
module: s.module,
level: calculateBandScore(s.score.correct, s.score.total, s.module, s.focus!),
}));
const levels: { [key in Module]: number } = {
reading: 0,
listening: 0,
writing: 0,
speaking: 0,
level: 0,
};
bandScores.forEach((b) => (levels[b.module] += b.level));
return calculateAverageLevel(levels);
};
const UserDisplay = (displayUser: User) => ( const UserDisplay = (displayUser: User) => (
<div className="flex w-full p-4 gap-4 items-center hover:bg-mti-purple-ultralight cursor-pointer transition ease-in-out duration-300"> <div className="flex w-full p-4 gap-4 items-center hover:bg-mti-purple-ultralight cursor-pointer transition ease-in-out duration-300">
@@ -158,17 +137,20 @@ export default function Dashboard({ user, users, entities, assignments, stats, g
value={students.length} value={students.length}
color="purple" color="purple"
/> />
{allowedEntityStatistics.length > 0 && (
<IconCard Icon={BsPersonFillGear} <IconCard Icon={BsPersonFillGear}
onClick={() => router.push("/statistical")} onClick={() => router.push("/statistical")}
label="Entity Statistics" label="Entity Statistics"
value={entities.length} value={allowedEntityStatistics.length}
color="purple" color="purple"
/> />
)}
<IconCard <IconCard
Icon={BsEnvelopePaper} Icon={BsEnvelopePaper}
onClick={() => router.push("/assignments")} onClick={() => router.push("/assignments")}
label="Assignments" label="Assignments"
value={assignments.filter((a) => !a.archived).length} value={assignments.filter((a) => !a.archived).length}
className={clsx(allowedEntityStatistics.length === 0 && "col-span-2")}
color="purple" color="purple"
/> />
<IconCard <IconCard

View File

@@ -2,104 +2,105 @@ import Layout from "@/components/High/Layout";
import Checkbox from "@/components/Low/Checkbox"; import Checkbox from "@/components/Low/Checkbox";
import Separator from "@/components/Low/Separator"; import Separator from "@/components/Low/Separator";
import { useEntityPermission } from "@/hooks/useEntityPermissions"; import { useEntityPermission } from "@/hooks/useEntityPermissions";
import {EntityWithRoles, Role} from "@/interfaces/entity"; import { EntityWithRoles, Role } from "@/interfaces/entity";
import {User} from "@/interfaces/user"; import { User } from "@/interfaces/user";
import {sessionOptions} from "@/lib/session"; import { sessionOptions } from "@/lib/session";
import { RolePermission } from "@/resources/entityPermissions"; import { RolePermission } from "@/resources/entityPermissions";
import { findBy, mapBy, redirect, serialize } from "@/utils"; import { findBy, mapBy, redirect, serialize } from "@/utils";
import { requestUser } from "@/utils/api"; import { requestUser } from "@/utils/api";
import {getEntityWithRoles} from "@/utils/entities.be"; import { getEntityWithRoles } from "@/utils/entities.be";
import {shouldRedirectHome} from "@/utils/navigation.disabled"; import { shouldRedirectHome } from "@/utils/navigation.disabled";
import {doesEntityAllow} from "@/utils/permissions"; import { doesEntityAllow } from "@/utils/permissions";
import {countEntityUsers} from "@/utils/users.be"; import { countEntityUsers } from "@/utils/users.be";
import axios from "axios"; import axios from "axios";
import {withIronSessionSsr} from "iron-session/next"; import { withIronSessionSsr } from "iron-session/next";
import Head from "next/head"; import Head from "next/head";
import Link from "next/link"; import Link from "next/link";
import {useRouter} from "next/router"; import { useRouter } from "next/router";
import {Divider} from "primereact/divider"; import { Divider } from "primereact/divider";
import {useState} from "react"; import { useState } from "react";
import { import {
BsCheck, BsCheck,
BsChevronLeft, BsChevronLeft,
BsTag, BsTag,
BsTrash, BsTrash,
} from "react-icons/bs"; } from "react-icons/bs";
import {toast} from "react-toastify"; import { toast } from "react-toastify";
type PermissionLayout = {label: string, key: RolePermission} type PermissionLayout = { label: string, key: RolePermission }
const USER_MANAGEMENT: PermissionLayout[] = [ const USER_MANAGEMENT: PermissionLayout[] = [
{label: "View Students", key: "view_students"}, { label: "View Students", key: "view_students" },
{label: "View Teachers", key: "view_teachers"}, { label: "View Teachers", key: "view_teachers" },
{label: "View Corporate Accounts", key: "view_corporates"}, { label: "View Corporate Accounts", key: "view_corporates" },
{label: "View Master Corporate Accounts", key: "view_mastercorporates"}, { label: "View Master Corporate Accounts", key: "view_mastercorporates" },
{label: "Edit Students", key: "edit_students"}, { label: "Edit Students", key: "edit_students" },
{label: "Edit Teachers", key: "edit_teachers"}, { label: "Edit Teachers", key: "edit_teachers" },
{label: "Edit Corporate Accounts", key: "edit_corporates"}, { label: "Edit Corporate Accounts", key: "edit_corporates" },
{label: "Edit Master Corporate Accounts", key: "edit_mastercorporates"}, { label: "Edit Master Corporate Accounts", key: "edit_mastercorporates" },
{label: "Delete Students", key: "delete_students"}, { label: "Delete Students", key: "delete_students" },
{label: "Delete Teachers", key: "delete_teachers"}, { label: "Delete Teachers", key: "delete_teachers" },
{label: "Delete Corporate Accounts", key: "delete_corporates"}, { label: "Delete Corporate Accounts", key: "delete_corporates" },
{label: "Delete Master Corporate Accounts", key: "delete_mastercorporates"}, { label: "Delete Master Corporate Accounts", key: "delete_mastercorporates" },
] ]
const EXAM_MANAGEMENT: PermissionLayout[] = [ const EXAM_MANAGEMENT: PermissionLayout[] = [
{label: "View Reading", key: "view_reading"}, { label: "View Reading", key: "view_reading" },
{label: "Generate Reading", key: "generate_reading"}, { label: "Generate Reading", key: "generate_reading" },
{label: "Delete Reading", key: "delete_reading"}, { label: "Delete Reading", key: "delete_reading" },
{label: "View Listening", key: "view_listening"}, { label: "View Listening", key: "view_listening" },
{label: "Generate Listening", key: "generate_listening"}, { label: "Generate Listening", key: "generate_listening" },
{label: "Delete Listening", key: "delete_listening"}, { label: "Delete Listening", key: "delete_listening" },
{label: "View Writing", key: "view_writing"}, { label: "View Writing", key: "view_writing" },
{label: "Generate Writing", key: "generate_writing"}, { label: "Generate Writing", key: "generate_writing" },
{label: "Delete Writing", key: "delete_writing"}, { label: "Delete Writing", key: "delete_writing" },
{label: "View Speaking", key: "view_speaking"}, { label: "View Speaking", key: "view_speaking" },
{label: "Generate Speaking", key: "generate_speaking"}, { label: "Generate Speaking", key: "generate_speaking" },
{label: "Delete Speaking", key: "delete_speaking"}, { label: "Delete Speaking", key: "delete_speaking" },
{label: "View Level", key: "view_level"}, { label: "View Level", key: "view_level" },
{label: "Generate Level", key: "generate_level"}, { label: "Generate Level", key: "generate_level" },
{label: "Delete Level", key: "delete_level"}, { label: "Delete Level", key: "delete_level" },
] ]
const CLASSROOM_MANAGEMENT: PermissionLayout[] = [ const CLASSROOM_MANAGEMENT: PermissionLayout[] = [
{label: "View Classrooms", key: "view_classrooms"}, { label: "View Classrooms", key: "view_classrooms" },
{label: "Create Classrooms", key: "create_classroom"}, { label: "Create Classrooms", key: "create_classroom" },
{label: "Rename Classrooms", key: "rename_classrooms"}, { label: "Rename Classrooms", key: "rename_classrooms" },
{label: "Add to Classroom", key: "add_to_classroom"}, { label: "Add to Classroom", key: "add_to_classroom" },
{label: "Remove from Classroom", key: "remove_from_classroom"}, { label: "Remove from Classroom", key: "remove_from_classroom" },
{label: "Delete Classroom", key: "delete_classroom"}, { label: "Delete Classroom", key: "delete_classroom" },
] ]
const ENTITY_MANAGEMENT: PermissionLayout[] = [ const ENTITY_MANAGEMENT: PermissionLayout[] = [
{label: "View Entities", key: "view_entities"}, { label: "View Entities", key: "view_entities" },
{label: "Rename Entity", key: "rename_entity"}, { label: "View Entity Statistics", key: "view_entity_statistics" },
{label: "Add to Entity", key: "add_to_entity"}, { label: "Rename Entity", key: "rename_entity" },
{label: "Remove from Entity", key: "remove_from_entity"}, { label: "Add to Entity", key: "add_to_entity" },
{label: "Delete Entity", key: "delete_entity"}, { label: "Remove from Entity", key: "remove_from_entity" },
{label: "View Entity Roles", key: "view_entity_roles"}, { label: "Delete Entity", key: "delete_entity" },
{label: "Create Entity Role", key: "create_entity_role"}, { label: "View Entity Roles", key: "view_entity_roles" },
{label: "Rename Entity Role", key: "rename_entity_role"}, { label: "Create Entity Role", key: "create_entity_role" },
{label: "Edit Role Permissions", key: "edit_role_permissions"}, { label: "Rename Entity Role", key: "rename_entity_role" },
{label: "Assign Role to User", key: "assign_to_role"}, { label: "Edit Role Permissions", key: "edit_role_permissions" },
{label: "Delete Entity Role", key: "delete_entity_role"}, { label: "Assign Role to User", key: "assign_to_role" },
{ label: "Delete Entity Role", key: "delete_entity_role" },
] ]
const ASSIGNMENT_MANAGEMENT: PermissionLayout[] = [ const ASSIGNMENT_MANAGEMENT: PermissionLayout[] = [
{label: "View Assignments", key: "view_assignments"}, { label: "View Assignments", key: "view_assignments" },
{label: "Create Assignments", key: "create_assignment"}, { label: "Create Assignments", key: "create_assignment" },
{label: "Start Assignments", key: "start_assignment"}, { label: "Start Assignments", key: "start_assignment" },
{label: "Delete Assignments", key: "delete_assignment"}, { label: "Delete Assignments", key: "delete_assignment" },
{label: "Archive Assignments", key: "archive_assignment"}, { label: "Archive Assignments", key: "archive_assignment" },
] ]
export const getServerSideProps = withIronSessionSsr(async ({req, res, params}) => { export const getServerSideProps = withIronSessionSsr(async ({ req, res, params }) => {
const user = await requestUser(req, res) const user = await requestUser(req, res)
if (!user) return redirect("/login") if (!user) return redirect("/login")
if (shouldRedirectHome(user)) return redirect("/") if (shouldRedirectHome(user)) return redirect("/")
const {id, role} = params as {id: string, role: string}; const { id, role } = params as { id: string, role: string };
if (!mapBy(user.entities, 'id').includes(id) && !["admin", "developer"].includes(user.type)) return redirect("/entities") if (!mapBy(user.entities, 'id').includes(id) && !["admin", "developer"].includes(user.type)) return redirect("/entities")
@@ -130,7 +131,7 @@ interface Props {
userCount: number; userCount: number;
} }
export default function Role({user, entity, role, userCount}: Props) { export default function Role({ user, entity, role, userCount }: Props) {
const [permissions, setPermissions] = useState(role.permissions) const [permissions, setPermissions] = useState(role.permissions)
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
@@ -148,7 +149,7 @@ export default function Role({user, entity, role, userCount}: Props) {
setIsLoading(true); setIsLoading(true);
axios axios
.patch(`/api/roles/${role.id}`, {label}) .patch(`/api/roles/${role.id}`, { label })
.then(() => { .then(() => {
toast.success("The role has been updated successfully!"); toast.success("The role has been updated successfully!");
router.replace(router.asPath); router.replace(router.asPath);
@@ -185,7 +186,7 @@ export default function Role({user, entity, role, userCount}: Props) {
setIsLoading(true); setIsLoading(true);
axios axios
.patch(`/api/roles/${role.id}`, {permissions}) .patch(`/api/roles/${role.id}`, { permissions })
.then(() => { .then(() => {
toast.success("This role has been successfully updated!"); toast.success("This role has been successfully updated!");
router.replace(router.asPath); router.replace(router.asPath);
@@ -202,7 +203,7 @@ export default function Role({user, entity, role, userCount}: Props) {
return ( return (
<> <>
<Head> <Head>
<title>{ role.label } | {entity.label} | EnCoach</title> <title>{role.label} | {entity.label} | EnCoach</title>
<meta <meta
name="description" name="description"
content="A training platform for the IELTS exam provided by the Muscat Training Institute and developed by eCrop." content="A training platform for the IELTS exam provided by the Muscat Training Institute and developed by eCrop."
@@ -220,7 +221,7 @@ export default function Role({user, entity, role, userCount}: Props) {
className="text-mti-purple hover:text-mti-purple-dark transition ease-in-out duration-300 text-xl"> className="text-mti-purple hover:text-mti-purple-dark transition ease-in-out duration-300 text-xl">
<BsChevronLeft /> <BsChevronLeft />
</Link> </Link>
<h2 className="font-bold text-2xl">{role.label} Role ({ userCount } users)</h2> <h2 className="font-bold text-2xl">{role.label} Role ({userCount} users)</h2>
</div> </div>
</div> </div>
<div className="flex items-center justify-between w-full"> <div className="flex items-center justify-between w-full">
@@ -264,11 +265,11 @@ export default function Role({user, entity, role, userCount}: Props) {
</div> </div>
<Separator /> <Separator />
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
{USER_MANAGEMENT.map(({label, key}) => ( {USER_MANAGEMENT.map(({ label, key }) => (
<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}> <Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
{ label } {label}
</Checkbox> </Checkbox>
)) } ))}
</div> </div>
</div> </div>
@@ -284,11 +285,11 @@ export default function Role({user, entity, role, userCount}: Props) {
</div> </div>
<Separator /> <Separator />
<div className="grid grid-cols-3 gap-4"> <div className="grid grid-cols-3 gap-4">
{EXAM_MANAGEMENT.map(({label, key}) => ( {EXAM_MANAGEMENT.map(({ label, key }) => (
<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}> <Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
{ label } {label}
</Checkbox> </Checkbox>
)) } ))}
</div> </div>
</div> </div>
@@ -304,11 +305,11 @@ export default function Role({user, entity, role, userCount}: Props) {
</div> </div>
<Separator /> <Separator />
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
{CLASSROOM_MANAGEMENT.map(({label, key}) => ( {CLASSROOM_MANAGEMENT.map(({ label, key }) => (
<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}> <Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
{ label } {label}
</Checkbox> </Checkbox>
)) } ))}
</div> </div>
</div> </div>
@@ -324,11 +325,11 @@ export default function Role({user, entity, role, userCount}: Props) {
</div> </div>
<Separator /> <Separator />
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
{ENTITY_MANAGEMENT.map(({label, key}) => ( {ENTITY_MANAGEMENT.map(({ label, key }) => (
<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}> <Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
{ label } {label}
</Checkbox> </Checkbox>
)) } ))}
</div> </div>
</div> </div>
@@ -344,11 +345,11 @@ export default function Role({user, entity, role, userCount}: Props) {
</div> </div>
<Separator /> <Separator />
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
{ASSIGNMENT_MANAGEMENT.map(({label, key}) => ( {ASSIGNMENT_MANAGEMENT.map(({ label, key }) => (
<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}> <Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
{ label } {label}
</Checkbox> </Checkbox>
)) } ))}
</div> </div>
</div> </div>
</section> </section>

View File

@@ -53,6 +53,9 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => {
const entityIDS = mapBy(user.entities, "id") || []; const entityIDS = mapBy(user.entities, "id") || [];
const entities = await getEntitiesWithRoles(isAdmin(user) ? undefined : entityIDS); const entities = await getEntitiesWithRoles(isAdmin(user) ? undefined : entityIDS);
const allowedEntities = findAllowedEntities(user, entities, 'view_entity_statistics')
if (allowedEntities.length === 0) return redirect("/")
const studentsAllowedEntities = findAllowedEntities(user, entities, 'view_students') const studentsAllowedEntities = findAllowedEntities(user, entities, 'view_students')
const students = await getEntitiesUsers(mapBy(studentsAllowedEntities, 'id'), { type: "student" }) const students = await getEntitiesUsers(mapBy(studentsAllowedEntities, 'id'), { type: "student" })
@@ -61,7 +64,7 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => {
const sessions = await getSessionsByAssignments(mapBy(assignments, 'id')) const sessions = await getSessionsByAssignments(mapBy(assignments, 'id'))
const exams = await getExamsByIds(assignments.flatMap(a => a.exams)) const exams = await getExamsByIds(assignments.flatMap(a => a.exams))
return { props: serialize({ user, students, entities, assignments, sessions, exams }) }; return { props: serialize({ user, students, entities: allowedEntities, assignments, sessions, exams }) };
}, sessionOptions); }, sessionOptions);
interface Item { interface Item {

View File

@@ -48,7 +48,8 @@ export type RolePermission =
"edit_assignment" | "edit_assignment" |
"delete_assignment" | "delete_assignment" |
"start_assignment" | "start_assignment" |
"archive_assignment" "archive_assignment" |
"view_entity_statistics"
export const DEFAULT_PERMISSIONS: RolePermission[] = [ export const DEFAULT_PERMISSIONS: RolePermission[] = [
"view_students", "view_students",
@@ -109,4 +110,5 @@ export const ADMIN_PERMISSIONS: RolePermission[] = [
"delete_assignment", "delete_assignment",
"start_assignment", "start_assignment",
"archive_assignment", "archive_assignment",
"view_entity_statistics"
] ]