devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated the grading system to work based on entities

Browse Source
This commit is contained in:
Tiago Ribeiro
2024-11-22 15:36:21 +00:00
parent f301001ebe
commit 50bbb0dacf
14 changed files with 236 additions and 484 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/pages/(admin)/CorporateGradingSystem.tsx
View File

@@ -1,12 +1,16 @@
import Button from "@/components/Low/Button";
import Input from "@/components/Low/Input";
import {Grading, Step} from "@/interfaces";
import {User} from "@/interfaces/user";
import {CEFR_STEPS, GENERAL_STEPS, IELTS_STEPS, TOFEL_STEPS} from "@/resources/grading";
import Select from "@/components/Low/Select";
import { Grading, Step } from "@/interfaces";
import { Entity } from "@/interfaces/entity";
import { User } from "@/interfaces/user";
import { CEFR_STEPS, GENERAL_STEPS, IELTS_STEPS, TOFEL_STEPS } from "@/resources/grading";
import { checkAccess } from "@/utils/permissions";
import axios from "axios";
import {useEffect, useState} from "react";
import {BsPlusCircle, BsTrash} from "react-icons/bs";
import {toast} from "react-toastify";
import clsx from "clsx";
import { useEffect, useState } from "react";
import { BsPlusCircle, BsTrash } from "react-icons/bs";
import { toast } from "react-toastify";
const areStepsOverlapped = (steps: Step[]) => {
for (let i = 0; i < steps.length; i++) {
@@ -21,9 +25,24 @@ const areStepsOverlapped = (steps: Step[]) => {
return false;
};
export default function CorporateGradingSystem({user, defaultSteps, mutate}: {user: User; defaultSteps: Step[]; mutate: (steps: Step[]) => void}) {
interface Props {
user: User;
entitiesGrading: Grading[];
entities: Entity[]
mutate: () => void
}
export default function CorporateGradingSystem({ user, entitiesGrading = [], entities = [], mutate }: Props) {
const [entity, setEntity] = useState(entitiesGrading[0]?.entity || undefined)
const [isLoading, setIsLoading] = useState(false);
const [steps, setSteps] = useState<Step[]>(defaultSteps || []);
const [steps, setSteps] = useState<Step[]>([]);
useEffect(() => {
if (entity) {
const entitySteps = entitiesGrading.find(e => e.entity === entity)!.steps
setSteps(entitySteps || [])
}
}, [entitiesGrading, entity])
const saveGradingSystem = () => {
if (!steps.every((x) => x.min < x.max)) return toast.error("One of your steps has a minimum threshold inferior to its superior threshold.");
@@ -37,9 +56,9 @@ export default function CorporateGradingSystem({user, defaultSteps, mutate}: {us
setIsLoading(true);
axios
.post("/api/grading", {user: user.id, steps})
.post("/api/grading", { user: user.id, entity, steps })
.then(() => toast.success("Your grading system has been saved!"))
.then(() => mutate(steps))
.then(mutate)
.catch(() => toast.error("Something went wrong, please try again later"))
.finally(() => setIsLoading(false));
};
@@ -47,6 +66,15 @@ export default function CorporateGradingSystem({user, defaultSteps, mutate}: {us
return (
<div className="flex flex-col gap-4 border p-4 border-mti-gray-platinum rounded-xl">
<label className="font-normal text-base text-mti-gray-dim">Grading System</label>
<div className={clsx("flex flex-col gap-4")}>
<label className="font-normal text-base text-mti-gray-dim">Entity</label>
<Select
defaultValue={{ value: (entities || [])[0]?.id, label: (entities || [])[0]?.label }}
options={entities.map((e) => ({ value: e.id, label: e.label }))}
onChange={(e) => setEntity(e?.value || undefined)}
isClearable={checkAccess(user, ["admin", "developer"])}
/>
</div>
<label className="font-normal text-base text-mti-gray-dim">Preset Systems</label>
<div className="grid grid-cols-4 gap-4">
@@ -73,7 +101,7 @@ export default function CorporateGradingSystem({user, defaultSteps, mutate}: {us
value={step.min}
type="number"
disabled={index === 0 || isLoading}
onChange={(e) => setSteps((prev) => prev.map((x, i) => (i === index ? {...x, min: parseInt(e)} : x)))}
onChange={(e) => setSteps((prev) => prev.map((x, i) => (i === index ? { ...x, min: parseInt(e) } : x)))}
name="min"
/>
<Input
@@ -81,7 +109,7 @@ export default function CorporateGradingSystem({user, defaultSteps, mutate}: {us
value={step.label}
type="text"
disabled={isLoading}
onChange={(e) => setSteps((prev) => prev.map((x, i) => (i === index ? {...x, label: e} : x)))}
onChange={(e) => setSteps((prev) => prev.map((x, i) => (i === index ? { ...x, label: e } : x)))}
name="min"
/>
<Input
@@ -89,7 +117,7 @@ export default function CorporateGradingSystem({user, defaultSteps, mutate}: {us
value={step.max}
type="number"
disabled={index === steps.length - 1 || isLoading}
onChange={(e) => setSteps((prev) => prev.map((x, i) => (i === index ? {...x, max: parseInt(e)} : x)))}
onChange={(e) => setSteps((prev) => prev.map((x, i) => (i === index ? { ...x, max: parseInt(e) } : x)))}
name="max"
/>
</div>
@@ -110,7 +138,7 @@ export default function CorporateGradingSystem({user, defaultSteps, mutate}: {us
className="w-full flex items-center justify-center"
disabled={isLoading}
onClick={() => {
const item = {min: steps[index === 0 ? 0 : index - 1].max + 1, max: steps[index + 1].min - 1, label: ""};
const item = { min: steps[index === 0 ? 0 : index - 1].max + 1, max: steps[index + 1].min - 1, label: "" };
setSteps((prev) => [...prev.slice(0, index + 1), item, ...prev.slice(index + 1, steps.length)]);
}}>
<BsPlusCircle />