Merge branch 'develop' of https://bitbucket.org/ecropdev/ielts-ui into ENCOA-316-ENCOA-317

This commit is contained in:
José Marques Lima
2025-01-25 20:01:52 +00:00
12 changed files with 557 additions and 360 deletions

View File

@@ -43,7 +43,7 @@ export default function ExamPage({
const [variant, setVariant] = useState<Variant>("full");
const [avoidRepeated, setAvoidRepeated] = useState(false);
const [showAbandonPopup, setShowAbandonPopup] = useState(false);
const [pendingExercises, setPendingExercises] = useState<string[]>([]);
const [moduleLock, setModuleLock] = useState(false);
const {
exam,
@@ -74,7 +74,6 @@ export default function ExamPage({
saveSession,
setFlags,
setShuffles,
evaluated,
} = useExamStore();
const [isFetchingExams, setIsFetchingExams] = useState(false);
@@ -139,96 +138,107 @@ export default function ExamPage({
setShowAbandonPopup(false);
};
useEvaluationPolling(sessionId ? [sessionId] : [], "exam", user?.id);
useEffect(() => {
if (flags.finalizeModule && !showSolutions && flags.pendingEvaluation) {
setModuleLock(true);
}, [flags.finalizeModule]);
useEffect(() => {
if (flags.finalizeModule && !showSolutions) {
if (
exam &&
(exam.module === "writing" || exam.module === "speaking") &&
userSolutions.length > 0 &&
!showSolutions
userSolutions.length > 0
) {
const exercisesToEvaluate = exam.exercises.map(
(exercise) => exercise.id
);
setPendingExercises(exercisesToEvaluate);
(async () => {
await Promise.all(
exam.exercises.map(async (exercise, index) => {
if (exercise.type === "writing")
await evaluateWritingAnswer(
user.id,
sessionId,
exercise,
index + 1,
userSolutions.find((x) => x.exercise === exercise.id)!,
exercise.attachment?.url
);
if (
exercise.type === "interactiveSpeaking" ||
exercise.type === "speaking"
) {
await evaluateSpeakingAnswer(
user.id,
sessionId,
exercise,
userSolutions.find((x) => x.exercise === exercise.id)!,
index + 1
);
}
})
);
try {
const results = await Promise.all(
exam.exercises.map(async (exercise, index) => {
if (exercise.type === "writing") {
const sol = await evaluateWritingAnswer(
user.id,
sessionId,
exercise,
index + 1,
userSolutions.find((x) => x.exercise === exercise.id)!,
exercise.attachment?.url
);
return sol;
}
if (
exercise.type === "interactiveSpeaking" ||
exercise.type === "speaking"
) {
const sol = await evaluateSpeakingAnswer(
user.id,
sessionId,
exercise,
userSolutions.find((x) => x.exercise === exercise.id)!,
index + 1
);
return sol;
}
return null;
})
);
const updatedSolutions = userSolutions.map((solution) => {
const completed = results
.filter((r) => r !== null)
.find((c: any) => c.exercise === solution.exercise);
return completed || solution;
});
setUserSolutions(updatedSolutions);
} catch (error) {
console.error("Error during module evaluation:", error);
} finally {
setModuleLock(false);
}
})();
} else {
setModuleLock(false);
}
}
}, [exam, showSolutions, userSolutions, sessionId, user?.id, flags]);
useEvaluationPolling({ pendingExercises, setPendingExercises });
}, [
exam,
showSolutions,
userSolutions,
sessionId,
user.id,
flags.finalizeModule,
setUserSolutions,
]);
useEffect(() => {
if (flags.finalizeExam && moduleIndex !== -1) {
setModuleIndex(-1);
if (flags.finalizeExam && moduleIndex !== -1 && !moduleLock) {
(async () => {
setModuleIndex(-1);
await saveStats();
await axios.get("/api/stats/update");
})();
}
}, [flags.finalizeExam, moduleIndex, setModuleIndex]);
}, [
flags.finalizeExam,
moduleIndex,
saveStats,
setModuleIndex,
userSolutions,
moduleLock,
flags.finalizeModule,
]);
useEffect(() => {
if (
flags.finalizeExam &&
!flags.pendingEvaluation &&
pendingExercises.length === 0
!userSolutions.some((s) => s.isDisabled) &&
!moduleLock
) {
(async () => {
if (evaluated.length !== 0) {
setUserSolutions(
userSolutions.map((solution) => {
const evaluatedSolution = evaluated.find(
(e) => e.exercise === solution.exercise
);
if (evaluatedSolution) {
return { ...solution, ...evaluatedSolution };
}
return solution;
})
);
}
await saveStats();
await axios.get("/api/stats/update");
setShowSolutions(true);
setFlags({ finalizeExam: false });
dispatch({ type: "UPDATE_EXAMS" });
})();
setShowSolutions(true);
setFlags({ finalizeExam: false });
dispatch({ type: "UPDATE_EXAMS" });
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [
saveStats,
setFlags,
setModuleIndex,
evaluated,
pendingExercises,
setUserSolutions,
flags,
]);
}, [flags.finalizeExam, userSolutions, showSolutions, moduleLock]);
const aggregateScoresByModule = (
isPractice?: boolean
@@ -269,7 +279,7 @@ export default function ExamPage({
};
userSolutions.forEach((x) => {
if ((isPractice && x.isPractice) || (!isPractice && !x.isPractice)) {
if (x.isPractice === isPractice) {
const examModule =
x.module ||
(x.type === "writing"
@@ -286,12 +296,13 @@ export default function ExamPage({
}
});
return Object.keys(scores).reduce((acc, x) => {
if (scores[x as Module].total > 0) {
acc.push({ module: x as Module, ...scores[x as Module] });
}
return acc;
}, [] as any[]);
return Object.keys(scores).reduce<
{ module: Module; total: number; missing: number; correct: number }[]
>((accm, x) => {
if (scores[x as Module].total > 0)
accm.push({ module: x as Module, ...scores[x as Module] });
return accm;
}, []);
};
const ModuleExamMap: Record<Module, React.ComponentType<ExamProps<Exam>>> = {
@@ -318,8 +329,7 @@ export default function ExamPage({
useEffect(() => {
setOnFocusLayerMouseEnter(() => () => setShowAbandonPopup(true));
}, [
]);
}, []);
useEffect(() => {
setBgColor(bgColor);
@@ -339,111 +349,112 @@ export default function ExamPage({
setHideSidebar,
showSolutions,
]);
return (
<>
<ToastContainer />
{user && (
<>
{/* Modules weren't yet set by an INIT_EXAM or INIT_SOLUTIONS dispatch, show Selection component*/}
{selectedModules.length === 0 && (
<Selection
page={page}
user={user!}
onStart={(
modules: Module[],
avoid: boolean,
variant: Variant
) => {
setModuleIndex(0);
setAvoidRepeated(avoid);
setSelectedModules(modules);
setVariant(variant);
}}
/>
)}
{isFetchingExams && (
<div className="flex flex-grow flex-col items-center justify-center animate-pulse">
<span
className={`loading loading-infinity w-32 bg-ielts-${selectedModules[0]}`}
/>
<span
className={`font-bold text-2xl text-ielts-${selectedModules[0]}`}
>
Loading Exam ...
</span>
</div>
)}
{moduleIndex === -1 && selectedModules.length !== 0 && (
<Finish
isLoading={flags.pendingEvaluation}
user={user!}
modules={selectedModules}
solutions={userSolutions}
assignment={assignment}
information={{
timeSpent,
inactivity,
}}
destination={destination}
onViewResults={(index?: number) => {
if (exams[0].module === "level") {
const levelExam = exams[0] as LevelExam;
const allExercises = levelExam.parts.flatMap(
(part) => part.exercises
);
const exerciseOrderMap = new Map(
allExercises.map((ex, index) => [ex.id, index])
);
const orderedSolutions = userSolutions
.slice()
.sort((a, b) => {
const indexA =
exerciseOrderMap.get(a.exercise) ?? Infinity;
const indexB =
exerciseOrderMap.get(b.exercise) ?? Infinity;
return indexA - indexB;
});
setUserSolutions(orderedSolutions);
} else {
setUserSolutions(userSolutions);
}
setShuffles([]);
if (index === undefined) {
setFlags({ reviewAll: true });
<>
{/* Modules weren't yet set by an INIT_EXAM or INIT_SOLUTIONS dispatch, show Selection component*/}
{selectedModules.length === 0 && (
<Selection
page={page}
user={user!}
onStart={(
modules: Module[],
avoid: boolean,
variant: Variant
) => {
setModuleIndex(0);
setExam(exams[0]);
} else {
setModuleIndex(index);
setExam(exams[index]);
}
setShowSolutions(true);
setQuestionIndex(0);
setExerciseIndex(0);
setPartIndex(0);
}}
scores={aggregateScoresByModule()}
practiceScores={aggregateScoresByModule(true)}
/>
)}
{/* Exam is on going, display it and the abandon modal */}
{isExamLoaded && moduleIndex !== -1 && (
<>
{exam && CurrentExam && (
<CurrentExam exam={exam} showSolutions={showSolutions} />
)}
{!showSolutions && (
<AbandonPopup
isOpen={showAbandonPopup}
abandonPopupTitle="Leave Exercise"
abandonPopupDescription="Are you sure you want to leave the exercise? Your progress will be saved and this exam can be resumed on the Dashboard."
abandonConfirmButtonText="Confirm"
onAbandon={onAbandon}
onCancel={() => setShowAbandonPopup(false)}
setAvoidRepeated(avoid);
setSelectedModules(modules);
setVariant(variant);
}}
/>
)}
{isFetchingExams && (
<div className="flex flex-grow flex-col items-center justify-center animate-pulse">
<span
className={`loading loading-infinity w-32 bg-ielts-${selectedModules[0]}`}
/>
)}
</>
)}
</>
<span
className={`font-bold text-2xl text-ielts-${selectedModules[0]}`}
>
Loading Exam ...
</span>
</div>
)}
{moduleIndex === -1 && selectedModules.length !== 0 && (
<Finish
isLoading={userSolutions.some((s) => s.isDisabled)}
user={user!}
modules={selectedModules}
solutions={userSolutions}
assignment={assignment}
information={{
timeSpent,
inactivity,
}}
destination={destination}
onViewResults={(index?: number) => {
if (exams[0].module === "level") {
const levelExam = exams[0] as LevelExam;
const allExercises = levelExam.parts.flatMap(
(part) => part.exercises
);
const exerciseOrderMap = new Map(
allExercises.map((ex, index) => [ex.id, index])
);
const orderedSolutions = userSolutions
.slice()
.sort((a, b) => {
const indexA =
exerciseOrderMap.get(a.exercise) ?? Infinity;
const indexB =
exerciseOrderMap.get(b.exercise) ?? Infinity;
return indexA - indexB;
});
setUserSolutions(orderedSolutions);
} else {
setUserSolutions(userSolutions);
}
setShuffles([]);
if (index === undefined) {
setFlags({ reviewAll: true });
setModuleIndex(0);
setExam(exams[0]);
} else {
setModuleIndex(index);
setExam(exams[index]);
}
setShowSolutions(true);
setQuestionIndex(0);
setExerciseIndex(0);
setPartIndex(0);
}}
scores={aggregateScoresByModule()}
practiceScores={aggregateScoresByModule(true)}
/>
)}
{/* Exam is on going, display it and the abandon modal */}
{isExamLoaded && moduleIndex !== -1 && (
<>
{exam && CurrentExam && (
<CurrentExam exam={exam} showSolutions={showSolutions} />
)}
{!showSolutions && (
<AbandonPopup
isOpen={showAbandonPopup}
abandonPopupTitle="Leave Exercise"
abandonPopupDescription="Are you sure you want to leave the exercise? Your progress will be saved and this exam can be resumed on the Dashboard."
abandonConfirmButtonText="Confirm"
onAbandon={onAbandon}
onCancel={() => setShowAbandonPopup(false)}
/>
)}
</>
)}
</>
)}
</>
);

View File

@@ -4,21 +4,71 @@ import { withIronSessionApiRoute } from "iron-session/next";
import { sessionOptions } from "@/lib/session";
import { UserSolution } from "@/interfaces/exam";
import { speakingReverseMarking, writingReverseMarking } from "@/utils/score";
import { Stat } from "@/interfaces/user";
const db = client.db(process.env.MONGODB_DB);
export default withIronSessionApiRoute(handler, sessionOptions);
async function handler(req: NextApiRequest, res: NextApiResponse) {
if (req.method === "POST") return post(req, res);
}
async function post(req: NextApiRequest, res: NextApiResponse) {
if (!req.session.user) {
res.status(401).json({ ok: false });
return;
}
const { sessionId, userId, userSolutions } = req.body;
try {
return await getSessionEvals(req, res);
} catch (error) {
console.error(error);
res.status(500).json({ ok: false });
}
}
function formatSolutionWithEval(userSolution: UserSolution | Stat, evaluation: any) {
if (userSolution.type === 'writing') {
return {
...userSolution,
solutions: [{
...userSolution.solutions[0],
evaluation: evaluation.result
}],
score: {
correct: writingReverseMarking[evaluation.result.overall],
total: 100,
missing: 0
},
isDisabled: false
};
}
if (userSolution.type === 'speaking' || userSolution.type === 'interactiveSpeaking') {
return {
...userSolution,
solutions: [{
...userSolution.solutions[0],
...(
userSolution.type === 'speaking'
? { fullPath: evaluation.result.fullPath }
: { answer: evaluation.result.answer }
),
evaluation: evaluation.result
}],
score: {
correct: speakingReverseMarking[evaluation.result.overall || 0] || 0,
total: 100,
missing: 0
},
isDisabled: false
};
}
return {
solution: userSolution,
evaluation
};
}
async function getSessionEvals(req: NextApiRequest, res: NextApiResponse) {
const { sessionId, userId, stats } = req.body;
const completedEvals = await db.collection("evaluation").find({
session_id: sessionId,
user: userId,
@@ -29,52 +79,11 @@ async function post(req: NextApiRequest, res: NextApiResponse) {
completedEvals.map(e => [e.exercise_id, e])
);
const solutionsWithEvals = userSolutions.filter((solution: UserSolution) =>
evalsByExercise.has(solution.exercise)
).map((solution: any) => {
const evaluation = evalsByExercise.get(solution.exercise)!;
const statsWithEvals = stats
.filter((solution: UserSolution | Stat) => evalsByExercise.has(solution.exercise))
.map((solution: UserSolution | Stat) =>
formatSolutionWithEval(solution, evalsByExercise.get(solution.exercise)!)
);
if (solution.type === 'writing') {
return {
...solution,
solutions: [{
...solution.solutions[0],
evaluation: evaluation.result
}],
score: {
correct: writingReverseMarking[evaluation.result.overall],
total: 100,
missing: 0
},
isDisabled: false
};
}
if (solution.type === 'speaking' || solution.type === 'interactiveSpeaking') {
return {
...solution,
solutions: [{
...solution.solutions[0],
...(
solution.type === 'speaking'
? { fullPath: evaluation.result.fullPath }
: { answer: evaluation.result.answer }
),
evaluation: evaluation.result
}],
score: {
correct: speakingReverseMarking[evaluation.result.overall || 0] || 0,
total: 100,
missing: 0
},
isDisabled: false
};
}
return {
solution,
evaluation
};
});
res.status(200).json(solutionsWithEvals)
res.status(200).json(statsWithEvals);
}

View File

@@ -11,19 +11,100 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
if (req.method === "GET") return get(req, res);
}
type Query = {
op: string;
sessionId: string;
userId: string;
}
async function get(req: NextApiRequest, res: NextApiResponse) {
if (!req.session.user) {
res.status(401).json({ ok: false });
return;
return res.status(401).json({ ok: false });
}
const { sessionId, userId } = req.query;
const { sessionId, userId, op } = req.query as Query;
switch (op) {
case 'pending':
return getPendingEvaluation(userId, sessionId, res);
case 'disabled':
return getSessionsWIthDisabledWithPending(userId, res);
default:
return res.status(400).json({
ok: false,
});
}
}
async function getPendingEvaluation(
userId: string,
sessionId: string,
res: NextApiResponse
) {
const singleEval = await db.collection("evaluation").findOne({
session_id: sessionId,
user: userId,
status: "pending",
});
res.status(200).json({ hasPendingEvaluation: singleEval !== null});
return res.status(200).json({ hasPendingEvaluation: singleEval !== null });
}
async function getSessionsWIthDisabledWithPending(
userId: string,
res: NextApiResponse
) {
const sessions = await db.collection("stats")
.aggregate([
{
$match: {
user: userId,
disabled: true
}
},
{
$project: {
_id: 0,
session: 1
}
},
{
$lookup: {
from: "evaluation",
let: { sessionId: "$session" },
pipeline: [
{
$match: {
$expr: {
$and: [
{ $eq: ["$session", "$$sessionId"] },
{ $eq: ["$user", userId] },
{ $eq: ["$status", "pending"] }
]
}
}
},
{
$project: {
_id: 1
}
}
],
as: "pendingEvals"
}
},
{
$match: {
"pendingEvals.0": { $exists: true }
}
},
{
$group: {
id: "$session"
}
}
]).toArray();
return res.status(200).json({
sessions: sessions.map(s => s.id)
});
}

View File

@@ -3,37 +3,41 @@ import type { NextApiRequest, NextApiResponse } from "next";
import client from "@/lib/mongodb";
import { withIronSessionApiRoute } from "iron-session/next";
import { sessionOptions } from "@/lib/session";
import { Stat } from "@/interfaces/user";
import { requestUser } from "@/utils/api";
import { UserSolution } from "@/interfaces/exam";
import { WithId } from "mongodb";
const db = client.db(process.env.MONGODB_DB);
export default withIronSessionApiRoute(handler, sessionOptions);
async function handler(req: NextApiRequest, res: NextApiResponse) {
if (req.method === "POST") return post(req, res);
}
interface Body {
solutions: UserSolution[];
sessionID: string;
}
async function post(req: NextApiRequest, res: NextApiResponse) {
const user = await requestUser(req, res)
if (!user) return res.status(401).json({ ok: false });
const { solutions, sessionID } = req.body as Body;
if (req.method === "POST") return post(req, res);
}
const disabledStats = await db.collection("stats").find({ user: user.id, session: sessionID, disabled: true }).toArray();
interface Body {
solutions: UserSolution[];
sessionId: string;
userId: string;
}
async function post(req: NextApiRequest, res: NextApiResponse) {
const { userId, solutions, sessionId } = req.body as Body;
const disabledStats = await db.collection("stats").find(
{ user: userId, session: sessionId, isDisabled: true }
).toArray();
await Promise.all(disabledStats.map(async (stat) => {
const matchingSolution = solutions.find(s => s.exercise === stat.exercise);
if (matchingSolution) {
const { _id, ...updateFields } = matchingSolution as WithId<UserSolution>;
await db.collection("stats").updateOne(
{ id: stat.id },
{ $set: { ...matchingSolution } }
{ $set: { ...updateFields } }
);
}
}));

View File

@@ -0,0 +1,21 @@
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
import type {NextApiRequest, NextApiResponse} from "next";
import client from "@/lib/mongodb";
import {withIronSessionApiRoute} from "iron-session/next";
import {sessionOptions} from "@/lib/session";
const db = client.db(process.env.MONGODB_DB);
export default withIronSessionApiRoute(handler, sessionOptions);
async function handler(req: NextApiRequest, res: NextApiResponse) {
if (!req.session.user) {
res.status(401).json({ok: false});
return;
}
const {session} = req.query;
const snapshot = await db.collection("stats").find({ user: req.session.user.id, session }).toArray();
res.status(200).json(snapshot);
}

View File

@@ -29,6 +29,8 @@ import { EntityWithRoles } from "@/interfaces/entity";
import CardList from "@/components/High/CardList";
import { requestUser } from "@/utils/api";
import { useAllowedEntities } from "@/hooks/useEntityPermissions";
import getPendingEvals from "@/utils/disabled.be";
import useEvaluationPolling from "@/hooks/useEvaluationPolling";
export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => {
const user = await requestUser(req, res)
@@ -44,9 +46,10 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => {
const users = await (isAdmin ? getUsers() : getEntitiesUsers(entitiesIds))
const assignments = await (isAdmin ? getAssignments() : getEntitiesAssignments(entitiesIds))
const gradingSystems = await getGradingSystemByEntities(entitiesIds)
const pendingSessionIds = await getPendingEvals(user.id);
return {
props: serialize({ user, users, assignments, entities, gradingSystems,isAdmin }),
props: serialize({ user, users, assignments, entities, gradingSystems, isAdmin, pendingSessionIds }),
};
}, sessionOptions);
@@ -58,12 +61,13 @@ interface Props {
assignments: Assignment[];
entities: EntityWithRoles[]
gradingSystems: Grading[]
pendingSessionIds: string[];
isAdmin:boolean
}
const MAX_TRAINING_EXAMS = 10;
export default function History({ user, users, assignments, entities, gradingSystems,isAdmin }: Props) {
export default function History({ user, users, assignments, entities, gradingSystems, isAdmin, pendingSessionIds }: Props) {
const router = useRouter();
const [statsUserId, setStatsUserId, training, setTraining] = useRecordStore((state) => [
state.selectedUser,
@@ -85,9 +89,11 @@ export default function History({ user, users, assignments, entities, gradingSys
const groupedStats = useMemo(() => groupByDate(
stats.filter((x) => {
if (
(x.module === "writing" || x.module === "speaking") &&
!x.isDisabled &&
!x.solutions.every((y) => Object.keys(y).includes("evaluation"))
(
x.module === "writing" || x.module === "speaking") &&
!x.isDisabled && Array.isArray(x.solutions) &&
!x.solutions.every((y) => Object.keys(y).includes("evaluation")
)
)
return false;
return true;
@@ -179,6 +185,8 @@ export default function History({ user, users, assignments, entities, gradingSys
);
};
useEvaluationPolling(pendingSessionIds ? pendingSessionIds : [], "records", user.id);
return (
<>
<Head>