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

Merge branch 'develop' into master-corporate

Browse Source
This commit is contained in:
Joao Ramos
2024-07-24 09:50:53 +01:00
parent 916fa66446 10a3243756
commit daa27e41b3
10 changed files with 729 additions and 912 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/Exercises/InteractiveSpeaking.tsx
View File

@@ -60,7 +60,6 @@ export default function InteractiveSpeaking({
setIsLoading(true);
const answer = await saveAnswer(questionIndex);
console.log(questionIndex + 1 < prompts.length, questionIndex, prompts.length);
if (questionIndex + 1 < prompts.length) {
setQuestionIndex(questionIndex + 1);
setIsLoading(false);

4
src/components/Exercises/MatchSentences.tsx
View File

@@ -87,10 +87,6 @@ export default function MatchSentences({id, options, type, prompt, sentences, us
return {total, correct, missing};
};
useEffect(() => {
console.log(answers);
}, [answers]);
useEffect(() => {
if (hasExamEnded) onNext({exercise: id, solutions: answers, score: calculateScore(), type});
// eslint-disable-next-line react-hooks/exhaustive-deps

1
src/components/PaymobPayment.tsx
View File

@@ -20,7 +20,6 @@ interface Props {
export default function PaymobPayment({user, price, setIsPaymentLoading, currency, duration, duration_unit, onSuccess}: Props) {
const [isLoading, setIsLoading] = useState(false);
console.log(user.id);
const router = useRouter();

2
src/components/Solutions/Writing.tsx
View File

@@ -124,7 +124,7 @@ export default function Writing({id, type, prompt, attachment, userSolutions, on
return (
<div
className={clsx(
"bg-ielts-speaking text-ielts-speaking-light rounded-xl px-4 py-2",
"bg-ielts-writing text-ielts-writing-light rounded-xl px-4 py-2",
typeof taskResponse !== "number" && "tooltip",
)}
data-tip={typeof taskResponse !== "number" ? taskResponse.comment : ""}

2
src/pages/(admin)/BatchCodeGenerator.tsx
View File

@@ -47,8 +47,6 @@ export default function BatchCodeGenerator({user}: {user: User}) {
readAs: "ArrayBuffer",
});
useEffect(() => console.log(expiryDate), [expiryDate]);
useEffect(() => {
if (!isExpiryDateEnabled) setExpiryDate(null);
}, [isExpiryDateEnabled]);

21
src/pages/(admin)/Lists/UserList.tsx
View File

@@ -131,7 +131,6 @@ export default function UserList({
filteredUsers,
sortFunction
);
console.log(sortedUsers);
setDisplayUsers([...sortedUsers]);
}
@@ -234,7 +233,7 @@ export default function UserList({
const actionColumn = ({ row }: { row: { original: User } }) => {
return (
<div className="flex gap-4">
{PERMISSIONS.updateUser[row.original.type].includes(user.type) && (
{PERMISSIONS.updateUser[row.original.type]?.includes(user.type) && (
<Popover className="relative">
<Popover.Button>
<div data-tip="Change Type" className="cursor-pointer tooltip">
@@ -298,7 +297,7 @@ export default function UserList({
</Popover>
)}
{!row.original.isVerified &&
PERMISSIONS.updateUser[row.original.type].includes(user.type) && (
PERMISSIONS.updateUser[row.original.type]?.includes(user.type) && (
<div
data-tip="Verify User"
className="cursor-pointer tooltip"
@@ -307,7 +306,7 @@ export default function UserList({
<BsCheck className="hover:text-mti-purple-light transition ease-in-out duration-300" />
</div>
)}
{PERMISSIONS.updateUser[row.original.type].includes(user.type) && (
{PERMISSIONS.updateUser[row.original.type]?.includes(user.type) && (
<div
data-tip={
row.original.status === "disabled"
@@ -324,7 +323,7 @@ export default function UserList({
)}
</div>
)}
{PERMISSIONS.deleteUser[row.original.type].includes(user.type) && (
{PERMISSIONS.deleteUser[row.original.type]?.includes(user.type) && (
<div
data-tip="Delete"
className="cursor-pointer tooltip"
@@ -351,13 +350,13 @@ export default function UserList({
cell: ({ row, getValue }) => (
<div
className={clsx(
PERMISSIONS.updateExpiryDate[row.original.type].includes(
PERMISSIONS.updateExpiryDate[row.original.type]?.includes(
user.type
) &&
"underline text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300 cursor-pointer"
)}
onClick={() =>
PERMISSIONS.updateExpiryDate[row.original.type].includes(user.type)
PERMISSIONS.updateExpiryDate[row.original.type]?.includes(user.type)
? setSelectedUser(row.original)
: null
}
@@ -467,13 +466,13 @@ export default function UserList({
cell: ({ row, getValue }) => (
<div
className={clsx(
PERMISSIONS.updateExpiryDate[row.original.type].includes(
PERMISSIONS.updateExpiryDate[row.original.type]?.includes(
user.type
) &&
"underline text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300 cursor-pointer"
)}
onClick={() =>
PERMISSIONS.updateExpiryDate[row.original.type].includes(user.type)
PERMISSIONS.updateExpiryDate[row.original.type]?.includes(user.type)
? setSelectedUser(row.original)
: null
}
@@ -498,13 +497,13 @@ export default function UserList({
cell: ({ row, getValue }) => (
<div
className={clsx(
PERMISSIONS.updateExpiryDate[row.original.type].includes(
PERMISSIONS.updateExpiryDate[row.original.type]?.includes(
user.type
) &&
"underline text-mti-purple-light hover:text-mti-purple-dark transition ease-in-out duration-300 cursor-pointer"
)}
onClick={() =>
PERMISSIONS.updateExpiryDate[row.original.type].includes(user.type)
PERMISSIONS.updateExpiryDate[row.original.type]?.includes(user.type)
? setSelectedUser(row.original)
: null
}

2
src/pages/(exam)/ExamPage.tsx
View File

@@ -357,7 +357,7 @@ export default function ExamPage({page}: Props) {
exercise,
solutions.find((x) => x.exercise === exercise.id)!,
evaluationID,
index === 0 ? 1 : 2,
index + 1,
);
}),
)

143
src/pages/(generation)/LevelGeneration.tsx
View File

@@ -1,11 +1,5 @@
import Select from "@/components/Low/Select";
import {
Difficulty,
LevelExam,
MultipleChoiceExercise,
MultipleChoiceQuestion,
LevelPart,
} from "@/interfaces/exam";
import {Difficulty, LevelExam, MultipleChoiceExercise, MultipleChoiceQuestion, LevelPart} from "@/interfaces/exam";
import useExamStore from "@/stores/examStore";
import {getExamById} from "@/utils/exams";
import {playSound} from "@/utils/sound";
@@ -21,13 +15,7 @@ import { v4 } from "uuid";
const DIFFICULTIES: Difficulty[] = ["easy", "medium", "hard"];
const QuestionDisplay = ({
question,
onUpdate,
}: {
question: MultipleChoiceQuestion;
onUpdate: (question: MultipleChoiceQuestion) => void;
}) => {
const QuestionDisplay = ({question, onUpdate}: {question: MultipleChoiceQuestion; onUpdate: (question: MultipleChoiceQuestion) => void}) => {
const [isEditing, setIsEditing] = useState(false);
const [options, setOptions] = useState(question.options);
const [answer, setAnswer] = useState(question.solution);
@@ -39,32 +27,17 @@ const QuestionDisplay = ({
</span>
<div className="flex flex-col gap-1">
{question.options.map((option, index) => (
<span key={option.id} className={clsx(answer === option.id && "font-bold")}>
<span
key={option.id}
className={clsx(answer === option.id && "font-bold")}
>
<span
className={clsx(
"font-semibold",
answer === option.id
? "text-mti-green-light"
: "text-ielts-level"
)}
onClick={() => setAnswer(option.id)}
>
className={clsx("font-semibold", answer === option.id ? "text-mti-green-light" : "text-ielts-level")}
onClick={() => setAnswer(option.id)}>
({option.id})
</span>{" "}
{isEditing ? (
<input
defaultValue={option.text}
className="w-60"
onChange={(e) =>
setOptions((prev) =>
prev.map((x, idx) =>
idx === index ? { ...x, text: e.target.value } : x
)
)
}
onChange={(e) => setOptions((prev) => prev.map((x, idx) => (idx === index ? {...x, text: e.target.value} : x)))}
/>
) : (
<span>{option.text}</span>
@@ -76,8 +49,7 @@ const QuestionDisplay = ({
{!isEditing && (
<button
onClick={() => setIsEditing(true)}
className="p-2 border border-neutral-300 bg-white rounded-xl hover:drop-shadow transition ease-in-out duration-300"
>
className="p-2 border border-neutral-300 bg-white rounded-xl hover:drop-shadow transition ease-in-out duration-300">
<BsPencilSquare />
</button>
)}
@@ -88,14 +60,12 @@ const QuestionDisplay = ({
onUpdate({...question, options, solution: answer});
setIsEditing(false);
}}
className="p-2 border border-neutral-300 bg-white rounded-xl hover:drop-shadow transition ease-in-out duration-300"
>
className="p-2 border border-neutral-300 bg-white rounded-xl hover:drop-shadow transition ease-in-out duration-300">
<BsCheck />
</button>
<button
onClick={() => setIsEditing(false)}
className="p-2 border border-neutral-300 bg-white rounded-xl hover:drop-shadow transition ease-in-out duration-300"
>
className="p-2 border border-neutral-300 bg-white rounded-xl hover:drop-shadow transition ease-in-out duration-300">
<BsX />
</button>
</>
@@ -105,15 +75,7 @@ const QuestionDisplay = ({
);
};
const TaskTab = ({
exam,
difficulty,
setExam,
}: {
exam?: LevelPart;
difficulty: Difficulty;
setExam: (exam: LevelPart) => void;
}) => {
const TaskTab = ({exam, difficulty, setExam}: {exam?: LevelPart; difficulty: Difficulty; setExam: (exam: LevelPart) => void}) => {
const [isLoading, setIsLoading] = useState(false);
const generate = () => {
@@ -125,10 +87,7 @@ const TaskTab = ({
.get(`/api/exam/level/generate/level?${url.toString()}`)
.then((result) => {
playSound(typeof result.data === "string" ? "error" : "check");
if (typeof result.data === "string")
return toast.error(
"Something went wrong, please try to generate again."
);
if (typeof result.data === "string") return toast.error("Something went wrong, please try to generate again.");
setExam(result.data);
})
.catch((error) => {
@@ -145,11 +104,8 @@ const TaskTab = ({
...exam,
exercises: exam.exercises.map((x) => ({
...x,
questions: (x as MultipleChoiceExercise).questions.map((q) =>
q.id === question.id ? question : q
),
}),
),
questions: (x as MultipleChoiceExercise).questions.map((q) => (q.id === question.id ? question : q)),
})),
};
console.log(updatedExam);
setExam(updatedExam as any);
@@ -164,9 +120,8 @@ const TaskTab = ({
className={clsx(
"bg-ielts-level/70 border border-ielts-level text-white w-full px-6 py-6 rounded-xl h-[70px]",
"hover:bg-ielts-level disabled:bg-ielts-level/40 disabled:cursor-not-allowed",
"transition ease-in-out duration-300"
)}
>
"transition ease-in-out duration-300",
)}>
{isLoading ? (
<div className="flex items-center justify-center">
<BsArrowRepeat className="text-white animate-spin" size={25} />
@@ -178,12 +133,8 @@ const TaskTab = ({
</div>
{isLoading && (
<div className="w-fit h-fit mt-12 self-center animate-pulse flex flex-col gap-8 items-center">
<span
className={clsx("loading loading-infinity w-32 text-ielts-level")}
/>
<span className={clsx("font-bold text-2xl text-ielts-level")}>
Generating...
</span>
<span className={clsx("loading loading-infinity w-32 text-ielts-level")} />
<span className={clsx("font-bold text-2xl text-ielts-level")}>Generating...</span>
</div>
)}
{exam && (
@@ -196,20 +147,14 @@ const TaskTab = ({
return (
<div key={ex.id} className="w-full h-full flex flex-col gap-2">
<div className="flex gap-2">
<span className="text-xl font-semibold">
Multiple Choice
</span>
<span className="text-xl font-semibold">Multiple Choice</span>
<span className="rounded-xl bg-white border border-ielts-level p-1 px-4 w-fit">
{exercise.questions.length} questions
</span>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{exercise.questions.map((question) => (
<QuestionDisplay
question={question}
onUpdate={onUpdate}
key={question.id}
/>
<QuestionDisplay question={question} onUpdate={onUpdate} key={question.id} />
))}
</div>
</div>
@@ -225,9 +170,7 @@ const LevelGeneration = () => {
const [generatedExam, setGeneratedExam] = useState<LevelPart>();
const [isLoading, setIsLoading] = useState(false);
const [resultingExam, setResultingExam] = useState<LevelExam>();
const [difficulty, setDifficulty] = useState<Difficulty>(
sample(DIFFICULTIES)!
);
const [difficulty, setDifficulty] = useState<Difficulty>(sample(DIFFICULTIES)!);
const router = useRouter();
@@ -237,12 +180,9 @@ const LevelGeneration = () => {
const loadExam = async (examId: string) => {
const exam = await getExamById("level", examId.trim());
if (!exam) {
toast.error(
"Unknown Exam ID! Please make sure you selected the right module and entered the right exam ID",
{
toast.error("Unknown Exam ID! Please make sure you selected the right module and entered the right exam ID", {
toastId: "invalid-exam-id",
}
);
});
return;
}
@@ -274,18 +214,14 @@ const LevelGeneration = () => {
.then((result) => {
playSound("sent");
console.log(`Generated Exam ID: ${result.data.id}`);
toast.success(
"This new exam has been generated successfully! Check the ID in our browser's console."
);
toast.success("This new exam has been generated successfully! Check the ID in our browser's console.");
setResultingExam(result.data);
setGeneratedExam(undefined);
})
.catch((error) => {
console.log(error);
toast.error(
"Something went wrong while generating, please try again later."
);
toast.error("Something went wrong while generating, please try again later.");
})
.finally(() => setIsLoading(false));
};
@@ -294,17 +230,13 @@ const LevelGeneration = () => {
<>
<div className="flex gap-4 w-1/2">
<div className="flex flex-col gap-3 w-full">
<label className="font-normal text-base text-mti-gray-dim">
Difficulty
</label>
<label className="font-normal text-base text-mti-gray-dim">Difficulty</label>
<Select
options={DIFFICULTIES.map((x) => ({
value: x,
label: capitalize(x),
}))}
onChange={(value) =>
value ? setDifficulty(value.value as Difficulty) : null
}
onChange={(value) => (value ? setDifficulty(value.value as Difficulty) : null)}
value={{value: difficulty, label: capitalize(difficulty)}}
/>
</div>
@@ -317,21 +249,14 @@ const LevelGeneration = () => {
"w-full rounded-lg py-2.5 text-sm font-medium leading-5 text-ielts-level/70",
"ring-white ring-opacity-60 ring-offset-2 ring-offset-ielts-level focus:outline-none focus:ring-2",
"transition duration-300 ease-in-out",
selected
? "bg-white shadow"
: "text-blue-100 hover:bg-white/[0.12] hover:text-ielts-level"
selected ? "bg-white shadow" : "text-blue-100 hover:bg-white/[0.12] hover:text-ielts-level",
)
}
>
}>
Exam
</Tab>
</Tab.List>
<Tab.Panels>
<TaskTab
difficulty={difficulty}
exam={generatedExam}
setExam={setGeneratedExam}
/>
<TaskTab difficulty={difficulty} exam={generatedExam} setExam={setGeneratedExam} />
</Tab.Panels>
</Tab.Group>
<div className="w-full flex justify-end gap-4">
@@ -342,9 +267,8 @@ const LevelGeneration = () => {
className={clsx(
"bg-white border border-ielts-level text-ielts-level w-full max-w-[200px] rounded-xl h-[70px] self-end",
"hover:bg-ielts-level hover:text-white disabled:bg-ielts-level/40 disabled:cursor-not-allowed",
"transition ease-in-out duration-300"
)}
>
"transition ease-in-out duration-300",
)}>
Perform Exam
</button>
)}
@@ -356,9 +280,8 @@ const LevelGeneration = () => {
"bg-ielts-level/70 border border-ielts-level text-white w-full max-w-[200px] rounded-xl h-[70px] self-end",
"hover:bg-ielts-level disabled:bg-ielts-level/40 disabled:cursor-not-allowed",
"transition ease-in-out duration-300",
!generatedExam && "tooltip"
)}
>
!generatedExam && "tooltip",
)}>
{isLoading ? (
<div className="flex items-center justify-center">
<BsArrowRepeat className="text-white animate-spin" size={25} />

211
src/pages/record.tsx
View File

@@ -18,17 +18,7 @@ import { sortByModule } from "@/utils/moduleUtils";
import Layout from "@/components/High/Layout";
import clsx from "clsx";
import {calculateBandScore} from "@/utils/score";
import {
BsBook,
BsClipboard,
BsClock,
BsHeadphones,
BsMegaphone,
BsPen,
BsPersonDash,
BsPersonFillX,
BsXCircle,
} from "react-icons/bs";
import {BsBook, BsClipboard, BsClock, BsHeadphones, BsMegaphone, BsPen, BsPersonDash, BsPersonFillX, BsXCircle} from "react-icons/bs";
import Select from "@/components/Low/Select";
import useGroups from "@/hooks/useGroups";
import {shouldRedirectHome} from "@/utils/navigation.disabled";
@@ -68,15 +58,10 @@ const defaultSelectableCorporate = {
};
export default function History({user}: {user: User}) {
const [statsUserId, setStatsUserId] = useRecordStore((state) => [
state.selectedUser,
state.setSelectedUser,
]);
const [statsUserId, setStatsUserId] = useRecordStore((state) => [state.selectedUser, state.setSelectedUser]);
// const [statsUserId, setStatsUserId] = useState<string | undefined>(user.id);
const [groupedStats, setGroupedStats] = useState<{[key: string]: Stat[]}>();
const [filter, setFilter] = useState<
"months" | "weeks" | "days" | "assignments"
>();
const [filter, setFilter] = useState<"months" | "weeks" | "days" | "assignments">();
const {assignments} = useAssignments({});
const {users} = useUsers();
@@ -106,8 +91,8 @@ export default function History({ user }: { user: User }) {
)
return false;
return true;
})
)
}),
),
);
}
}, [stats, isStatsLoading]);
@@ -129,8 +114,7 @@ export default function History({ user }: { user: User }) {
const filteredStats: {[key: string]: Stat[]} = {};
Object.keys(stats).forEach((timestamp) => {
if (timestamp >= filterDate)
filteredStats[timestamp] = stats[timestamp];
if (timestamp >= filterDate) filteredStats[timestamp] = stats[timestamp];
});
return filteredStats;
@@ -140,14 +124,8 @@ export default function History({ user }: { user: User }) {
const filteredStats: {[key: string]: Stat[]} = {};
Object.keys(stats).forEach((timestamp) => {
if (
stats[timestamp]
.map((s) => s.assignment === undefined)
.includes(false)
)
filteredStats[timestamp] = [
...stats[timestamp].filter((s) => !!s.assignment),
];
if (stats[timestamp].map((s) => s.assignment === undefined).includes(false))
filteredStats[timestamp] = [...stats[timestamp].filter((s) => !!s.assignment)];
});
return filteredStats;
@@ -163,9 +141,7 @@ export default function History({ user }: { user: User }) {
return date.format(formatter);
};
const aggregateScoresByModule = (
stats: Stat[]
): { module: Module; total: number; missing: number; correct: number }[] => {
const aggregateScoresByModule = (stats: Stat[]): {module: Module; total: number; missing: number; correct: number}[] => {
const scores: {
[key in Module]: {total: number; missing: number; correct: number};
} = {
@@ -213,21 +189,10 @@ export default function History({ user }: { user: User }) {
if (!groupedStats) return <></>;
const dateStats = groupedStats[timestamp];
const correct = dateStats.reduce(
(accumulator, current) => accumulator + current.score.correct,
0
);
const total = dateStats.reduce(
(accumulator, current) => accumulator + current.score.total,
0
);
const aggregatedScores = aggregateScoresByModule(dateStats).filter(
(x) => x.total > 0
);
const assignmentID = dateStats.reduce(
(_, current) => current.assignment as any,
""
);
const correct = dateStats.reduce((accumulator, current) => accumulator + current.score.correct, 0);
const total = dateStats.reduce((accumulator, current) => accumulator + current.score.total, 0);
const aggregatedScores = aggregateScoresByModule(dateStats).filter((x) => x.total > 0);
const assignmentID = dateStats.reduce((_, current) => current.assignment as any, "");
const assignment = assignments.find((a) => a.id === assignmentID);
const isDisabled = dateStats.some((x) => x.isDisabled);
@@ -244,6 +209,8 @@ export default function History({ user }: { user: User }) {
return getExamById(stat.module, stat.exam);
});
if (isDisabled) return;
Promise.all(examPromises).then((exams) => {
if (exams.every((x) => !!x)) {
if (!!timeSpent) setTimeSpent(timeSpent);
@@ -256,7 +223,7 @@ export default function History({ user }: { user: User }) {
exams
.map((x) => x!)
.sort(sortByModule)
.map((x) => x!.module)
.map((x) => x!.module),
);
router.push("/exercises");
}
@@ -266,7 +233,7 @@ export default function History({ user }: { user: User }) {
const textColor = clsx(
correct / total >= 0.7 && "text-mti-purple",
correct / total >= 0.3 && correct / total < 0.7 && "text-mti-red",
correct / total < 0.3 && "text-mti-rose"
correct / total < 0.3 && "text-mti-rose",
);
const content = (
@@ -276,18 +243,12 @@ export default function History({ user }: { user: User }) {
<span className="font-medium">{formatTimestamp(timestamp)}</span>
<div className="flex items-center gap-2">
{!!timeSpent && (
<span
className="text-sm flex gap-2 items-center tooltip"
data-tip="Time Spent"
>
<span className="text-sm flex gap-2 items-center tooltip" data-tip="Time Spent">
<BsClock /> {Math.floor(timeSpent / 60)} minutes
</span>
)}
{!!inactivity && (
<span
className="text-sm flex gap-2 items-center tooltip"
data-tip="Inactivity"
>
<span className="text-sm flex gap-2 items-center tooltip" data-tip="Inactivity">
<BsXCircle /> {Math.floor(inactivity / 60)} minutes
</span>
)}
@@ -296,12 +257,7 @@ export default function History({ user }: { user: User }) {
<div className="flex flex-row gap-2">
<span className={textColor}>
Level{" "}
{(
aggregatedLevels.reduce(
(accumulator, current) => accumulator + current.level,
0
) / aggregatedLevels.length
).toFixed(1)}
{(aggregatedLevels.reduce((accumulator, current) => accumulator + current.level, 0) / aggregatedLevels.length).toFixed(1)}
</span>
{renderPdfIcon(session, textColor, textColor)}
</div>
@@ -318,9 +274,8 @@ export default function History({ user }: { user: User }) {
module === "listening" && "bg-ielts-listening",
module === "writing" && "bg-ielts-writing",
module === "speaking" && "bg-ielts-speaking",
module === "level" && "bg-ielts-level"
)}
>
module === "level" && "bg-ielts-level",
)}>
{module === "reading" && <BsBook className="w-4 h-4" />}
{module === "listening" && <BsHeadphones className="w-4 h-4" />}
{module === "writing" && <BsPen className="w-4 h-4" />}
@@ -333,8 +288,7 @@ export default function History({ user }: { user: User }) {
{assignment && (
<span className="font-light text-sm">
Assignment: {assignment.name}, Teacher:{" "}
{users.find((u) => u.id === assignment.assigner)?.name}
Assignment: {assignment.name}, Teacher: {users.find((u) => u.id === assignment.assigner)?.name}
</span>
)}
</div>
@@ -349,15 +303,12 @@ export default function History({ user }: { user: User }) {
"flex flex-col justify-between gap-4 border border-mti-gray-platinum p-4 cursor-pointer rounded-xl transition ease-in-out duration-300 -md:hidden",
isDisabled && "grayscale tooltip",
correct / total >= 0.7 && "hover:border-mti-purple",
correct / total >= 0.3 &&
correct / total < 0.7 &&
"hover:border-mti-red",
correct / total < 0.3 && "hover:border-mti-rose"
correct / total >= 0.3 && correct / total < 0.7 && "hover:border-mti-red",
correct / total < 0.3 && "hover:border-mti-rose",
)}
onClick={isDisabled ? () => null : selectExam}
onClick={selectExam}
data-tip="This exam is still being evaluated..."
role="button"
>
role="button">
{content}
</div>
<div
@@ -365,14 +316,11 @@ export default function History({ user }: { user: User }) {
className={clsx(
"flex flex-col gap-4 border border-mti-gray-platinum p-4 cursor-pointer rounded-xl transition ease-in-out duration-300 -md:tooltip md:hidden",
correct / total >= 0.7 && "hover:border-mti-purple",
correct / total >= 0.3 &&
correct / total < 0.7 &&
"hover:border-mti-red",
correct / total < 0.3 && "hover:border-mti-rose"
correct / total >= 0.3 && correct / total < 0.7 && "hover:border-mti-red",
correct / total < 0.3 && "hover:border-mti-rose",
)}
data-tip="Your screen size is too small to view previous exams."
role="button"
>
role="button">
{content}
</div>
</>
@@ -389,20 +337,15 @@ export default function History({ user }: { user: User }) {
})),
];
const [selectedCorporate, setSelectedCorporate] = useState<string>(
defaultSelectableCorporate.value
);
const [selectedCorporate, setSelectedCorporate] = useState<string>(defaultSelectableCorporate.value);
const getUsersList = (): User[] => {
if (selectedCorporate) {
// get groups for that corporate
const selectedCorporateGroups = allGroups.filter(
(x) => x.admin === selectedCorporate
);
const selectedCorporateGroups = allGroups.filter((x) => x.admin === selectedCorporate);
// get the teacher ids for that group
const selectedCorporateGroupsParticipants =
selectedCorporateGroups.flatMap((x) => x.participants);
const selectedCorporateGroupsParticipants = selectedCorporateGroups.flatMap((x) => x.participants);
// // search for groups for these teachers
// const teacherGroups = allGroups.filter((x) => {
@@ -413,9 +356,7 @@ export default function History({ user }: { user: User }) {
// ...selectedCorporateGroupsParticipants,
// ...teacherGroups.flatMap((x) => x.participants),
// ];
const userListWithUsers = selectedCorporateGroupsParticipants.map((x) =>
users.find((y) => y.id === x)
) as User[];
const userListWithUsers = selectedCorporateGroupsParticipants.map((x) => users.find((y) => y.id === x)) as User[];
return userListWithUsers.filter((x) => x);
}
@@ -426,9 +367,7 @@ export default function History({ user }: { user: User }) {
const getSelectedUser = () => {
if (selectedCorporate) {
const userInCorporate = corporateFilteredUserList.find(
(x) => x.id === statsUserId
);
const userInCorporate = corporateFilteredUserList.find((x) => x.id === statsUserId);
return userInCorporate || corporateFilteredUserList[0];
}
@@ -463,34 +402,21 @@ export default function History({ user }: { user: User }) {
<div className="xl:w-3/4">
{(user.type === "developer" || user.type === "admin") && (
<>
<label className="font-normal text-base text-mti-gray-dim">
Corporate
</label>
<label className="font-normal text-base text-mti-gray-dim">Corporate</label>
<Select
options={selectableCorporates}
value={selectableCorporates.find(
(x) => x.value === selectedCorporate
)}
onChange={(value) =>
setSelectedCorporate(value?.value || "")
}
value={selectableCorporates.find((x) => x.value === selectedCorporate)}
onChange={(value) => setSelectedCorporate(value?.value || "")}
styles={{
menuPortal: (base) => ({...base, zIndex: 9999}),
option: (styles, state) => ({
...styles,
backgroundColor: state.isFocused
? "#D5D9F0"
: state.isSelected
? "#7872BF"
: "white",
backgroundColor: state.isFocused ? "#D5D9F0" : state.isSelected ? "#7872BF" : "white",
color: state.isFocused ? "black" : styles.color,
}),
}}
></Select>
<label className="font-normal text-base text-mti-gray-dim">
User
</label>
}}></Select>
<label className="font-normal text-base text-mti-gray-dim">User</label>
<Select
options={corporateFilteredUserList.map((x) => ({
@@ -503,29 +429,20 @@ export default function History({ user }: { user: User }) {
menuPortal: (base) => ({...base, zIndex: 9999}),
option: (styles, state) => ({
...styles,
backgroundColor: state.isFocused
? "#D5D9F0"
: state.isSelected
? "#7872BF"
: "white",
backgroundColor: state.isFocused ? "#D5D9F0" : state.isSelected ? "#7872BF" : "white",
color: state.isFocused ? "black" : styles.color,
}),
}}
/>
</>
)}
{(user.type === "corporate" || user.type === "teacher") &&
groups.length > 0 && (
{(user.type === "corporate" || user.type === "teacher") && groups.length > 0 && (
<>
<label className="font-normal text-base text-mti-gray-dim">
User
</label>
<label className="font-normal text-base text-mti-gray-dim">User</label>
<Select
options={users
.filter((x) =>
groups.flatMap((y) => y.participants).includes(x.id)
)
.filter((x) => groups.flatMap((y) => y.participants).includes(x.id))
.map((x) => ({
value: x.id,
label: `${x.name} - ${x.email}`,
@@ -536,11 +453,7 @@ export default function History({ user }: { user: User }) {
menuPortal: (base) => ({...base, zIndex: 9999}),
option: (styles, state) => ({
...styles,
backgroundColor: state.isFocused
? "#D5D9F0"
: state.isSelected
? "#7872BF"
: "white",
backgroundColor: state.isFocused ? "#D5D9F0" : state.isSelected ? "#7872BF" : "white",
color: state.isFocused ? "black" : styles.color,
}),
}}
@@ -553,59 +466,49 @@ export default function History({ user }: { user: User }) {
className={clsx(
"bg-mti-purple-ultralight text-mti-purple px-4 py-2 rounded-full hover:text-white hover:bg-mti-purple-light",
"transition duration-300 ease-in-out",
filter === "assignments" && "!bg-mti-purple-light !text-white"
filter === "assignments" && "!bg-mti-purple-light !text-white",
)}
onClick={() => toggleFilter("assignments")}
>
onClick={() => toggleFilter("assignments")}>
Assignments
</button>
<button
className={clsx(
"bg-mti-purple-ultralight text-mti-purple px-4 py-2 rounded-full hover:text-white hover:bg-mti-purple-light",
"transition duration-300 ease-in-out",
filter === "months" && "!bg-mti-purple-light !text-white"
filter === "months" && "!bg-mti-purple-light !text-white",
)}
onClick={() => toggleFilter("months")}
>
onClick={() => toggleFilter("months")}>
Last month
</button>
<button
className={clsx(
"bg-mti-purple-ultralight text-mti-purple px-4 py-2 rounded-full hover:text-white hover:bg-mti-purple-light",
"transition duration-300 ease-in-out",
filter === "weeks" && "!bg-mti-purple-light !text-white"
filter === "weeks" && "!bg-mti-purple-light !text-white",
)}
onClick={() => toggleFilter("weeks")}
>
onClick={() => toggleFilter("weeks")}>
Last week
</button>
<button
className={clsx(
"bg-mti-purple-ultralight text-mti-purple px-4 py-2 rounded-full hover:text-white hover:bg-mti-purple-light",
"transition duration-300 ease-in-out",
filter === "days" && "!bg-mti-purple-light !text-white"
filter === "days" && "!bg-mti-purple-light !text-white",
)}
onClick={() => toggleFilter("days")}
>
onClick={() => toggleFilter("days")}>
Last day
</button>
</div>
</div>
{groupedStats &&
Object.keys(groupedStats).length > 0 &&
!isStatsLoading && (
{groupedStats && Object.keys(groupedStats).length > 0 && !isStatsLoading && (
<div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 w-full gap-4 xl:gap-6">
{Object.keys(filterStatsByDate(groupedStats))
.sort((a, b) => parseInt(b) - parseInt(a))
.map(customContent)}
</div>
)}
{groupedStats &&
Object.keys(groupedStats).length === 0 &&
!isStatsLoading && (
<span className="font-semibold ml-1">
No record to display...
</span>
{groupedStats && Object.keys(groupedStats).length === 0 && !isStatsLoading && (
<span className="font-semibold ml-1">No record to display...</span>
)}
</Layout>
)}

2
src/utils/evaluation.ts
View File

@@ -51,7 +51,7 @@ export const evaluateSpeakingAnswer = async (
case "speaking":
return {...(await evaluateSpeakingExercise(exercise, exercise.id, solution, id, task)), id} as UserSolution;
case "interactiveSpeaking":
return {...(await evaluateInteractiveSpeakingExercise(exercise.id, solution, id, exercise.variant)), id} as UserSolution;
return {...(await evaluateInteractiveSpeakingExercise(exercise.id, solution, id, task === 3 ? "final" : "initial")), id} as UserSolution;
default:
return undefined;
}