Updated the entities roles to disallow users from updating their own role

src/pages/entities/[id]/roles/[role].tsx

@@ -11,6 +11,7 @@ import { requestUser } from "@/utils/api";
 import { getEntityWithRoles } from "@/utils/entities.be";
 import { shouldRedirectHome } from "@/utils/navigation.disabled";
 import { doesEntityAllow } from "@/utils/permissions";
+import { isAdmin } from "@/utils/users";
 import { countEntityUsers } from "@/utils/users.be";
 import axios from "axios";
 import { withIronSessionSsr } from "iron-session/next";
@@ -111,6 +112,7 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res, params }
 	if (!entityRole) return redirect(`/entities/${id}/roles`)
 
 	if (!doesEntityAllow(user, entity, "view_entity_roles")) return redirect(`/entities/${id}`)
+	const disableEdit = !isAdmin(user) && findBy(user.entities, 'id', entity.id)?.role === entityRole.id
 
 	const userCount = await countEntityUsers(id, { "entities.role": role });
 
@@ -120,6 +122,7 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res, params }
 			entity,
 			role: entityRole,
 			userCount,
+			disableEdit
 		}),
 	};
 }, sessionOptions);
@@ -129,9 +132,10 @@ interface Props {
 	entity: EntityWithRoles;
 	role: Role;
 	userCount: number;
+	disableEdit?: boolean
 }
 
-export default function Role({ user, entity, role, userCount }: Props) {
+export default function Role({ user, entity, role, userCount, disableEdit }: Props) {
 	const [permissions, setPermissions] = useState(role.permissions)
 	const [isLoading, setIsLoading] = useState(false);
 
@@ -141,8 +145,9 @@ export default function Role({ user, entity, role, userCount }: Props) {
 	const canRenameRole = useEntityPermission(user, entity, "rename_entity_role")
 	const canDeleteRole = useEntityPermission(user, entity, "delete_entity_role")
 
+
 	const renameRole = () => {
-		if (!canRenameRole) return;
+		if (!canRenameRole || disableEdit) return;
 
 		const label = prompt("Rename this role:", role.label);
 		if (!label) return;
@@ -162,7 +167,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 	};
 
 	const deleteRole = () => {
-		if (!canDeleteRole || role.isDefault) return;
+		if (!canDeleteRole || role.isDefault || disableEdit) return;
 		if (!confirm("Are you sure you want to delete this role?")) return;
 
 		setIsLoading(true);
@@ -181,7 +186,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 	};
 
 	const editPermissions = () => {
-		if (!canEditPermissions) return
+		if (!canEditPermissions || disableEdit) return
 
 		setIsLoading(true);
 
@@ -198,6 +203,13 @@ export default function Role({ user, entity, role, userCount }: Props) {
 			.finally(() => setIsLoading(false));
 	}
 
+	const disableCheckbox = (permission: RolePermission) => {
+		if (!canEditPermissions) return false
+		if (disableEdit) return false
+
+		return doesEntityAllow(user, entity, permission)
+	}
+
 	const togglePermissions = (p: RolePermission) => setPermissions(prev => prev.includes(p) ? prev.filter(x => x !== p) : [...prev, p])
 
 	return (
@@ -257,6 +269,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<div className="w-full flex items-center justify-between">
 								<b>User Management</b>
 								<Checkbox
+									disabled={!canEditPermissions || disableEdit}
 									isChecked={mapBy(USER_MANAGEMENT, 'key').every(k => permissions.includes(k))}
 									onChange={() => mapBy(USER_MANAGEMENT, 'key').forEach(togglePermissions)}
 								>
@@ -266,7 +279,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<Separator />
 							<div className="grid grid-cols-2 gap-4">
 								{USER_MANAGEMENT.map(({ label, key }) => (
-									<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
+									<Checkbox disabled={disableCheckbox(key)} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
 										{label}
 									</Checkbox>
 								))}
@@ -277,8 +290,9 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<div className="w-full flex items-center justify-between">
 								<b>Exam Management</b>
 								<Checkbox
+									disabled={!canEditPermissions || disableEdit}
 									isChecked={mapBy(EXAM_MANAGEMENT, 'key').every(k => permissions.includes(k))}
-									onChange={() => mapBy(EXAM_MANAGEMENT, 'key').forEach(togglePermissions)}
+									onChange={() => mapBy(EXAM_MANAGEMENT, 'key').filter(disableCheckbox).forEach(togglePermissions)}
 								>
 									Select all
 								</Checkbox>
@@ -286,7 +300,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<Separator />
 							<div className="grid grid-cols-3 gap-4">
 								{EXAM_MANAGEMENT.map(({ label, key }) => (
-									<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
+									<Checkbox disabled={disableCheckbox(key)} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
 										{label}
 									</Checkbox>
 								))}
@@ -297,8 +311,9 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<div className="w-full flex items-center justify-between">
 								<b>Clasroom Management</b>
 								<Checkbox
+									disabled={!canEditPermissions || disableEdit}
 									isChecked={mapBy(CLASSROOM_MANAGEMENT, 'key').every(k => permissions.includes(k))}
-									onChange={() => mapBy(CLASSROOM_MANAGEMENT, 'key').forEach(togglePermissions)}
+									onChange={() => mapBy(CLASSROOM_MANAGEMENT, 'key').filter(disableCheckbox).forEach(togglePermissions)}
 								>
 									Select all
 								</Checkbox>
@@ -306,7 +321,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<Separator />
 							<div className="grid grid-cols-2 gap-4">
 								{CLASSROOM_MANAGEMENT.map(({ label, key }) => (
-									<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
+									<Checkbox disabled={disableCheckbox(key)} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
 										{label}
 									</Checkbox>
 								))}
@@ -317,8 +332,9 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<div className="w-full flex items-center justify-between">
 								<b>Entity Management</b>
 								<Checkbox
+									disabled={!canEditPermissions || disableEdit}
 									isChecked={mapBy(ENTITY_MANAGEMENT, 'key').every(k => permissions.includes(k))}
-									onChange={() => mapBy(ENTITY_MANAGEMENT, 'key').forEach(togglePermissions)}
+									onChange={() => mapBy(ENTITY_MANAGEMENT, 'key').filter(disableCheckbox).forEach(togglePermissions)}
 								>
 									Select all
 								</Checkbox>
@@ -326,7 +342,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<Separator />
 							<div className="grid grid-cols-2 gap-4">
 								{ENTITY_MANAGEMENT.map(({ label, key }) => (
-									<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
+									<Checkbox disabled={disableCheckbox(key)} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
 										{label}
 									</Checkbox>
 								))}
@@ -337,8 +353,9 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<div className="w-full flex items-center justify-between">
 								<b>Assignment Management</b>
 								<Checkbox
+									disabled={!canEditPermissions || disableEdit}
 									isChecked={mapBy(ASSIGNMENT_MANAGEMENT, 'key').every(k => permissions.includes(k))}
-									onChange={() => mapBy(ASSIGNMENT_MANAGEMENT, 'key').forEach(togglePermissions)}
+									onChange={() => mapBy(ASSIGNMENT_MANAGEMENT, 'key').filter(disableCheckbox).forEach(togglePermissions)}
 								>
 									Select all
 								</Checkbox>
@@ -346,7 +363,7 @@ export default function Role({ user, entity, role, userCount }: Props) {
 							<Separator />
 							<div className="grid grid-cols-2 gap-4">
 								{ASSIGNMENT_MANAGEMENT.map(({ label, key }) => (
-									<Checkbox disabled={!canEditPermissions} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
+									<Checkbox disabled={disableCheckbox(key)} key={key} isChecked={permissions.includes(key)} onChange={() => togglePermissions(key)}>
 										{label}
 									</Checkbox>
 								))}