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

added access variable to exams soo we can distinguish private, public and confidential exams and also bugfixes and improvements

Browse Source
This commit is contained in:
José Lima
2025-02-09 04:28:34 +00:00
parent f95bce6fa2
commit b175d8797e
32 changed files with 1320 additions and 909 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
scripts/updatePrivateFieldExams.js Normal file
View File

@@ -0,0 +1,51 @@
import dotenv from "dotenv";
dotenv.config();
import { MongoClient } from "mongodb";
const uri = process.env.MONGODB_URI || "";
const options = {
maxPoolSize: 10,
};
const dbName = process.env.MONGODB_DB; // change this to prod db when needed
async function migrateData() {
const MODULE_ARRAY = ["reading", "listening", "writing", "speaking", "level"];
const client = new MongoClient(uri, options);
try {
await client.connect();
console.log("Connected to MongoDB");
if (!process.env.MONGODB_DB) {
throw new Error("Missing env var: MONGODB_DB");
}
const db = client.db(dbName);
for (const string of MODULE_ARRAY) {
const collection = db.collection(string);
const result = await collection.updateMany(
{ private: { $exists: false } },
{ $set: { access: "public" } }
);
const result2 = await collection.updateMany(
{ private: true },
{ $set: { access: "private" }, $unset: { private: "" } }
);
const result1 = await collection.updateMany(
{ private: { $exists: true } },
{ $set: { access: "public" } }
);
console.log(
`Updated ${
result.modifiedCount + result1.modifiedCount
} documents to "access: public" in ${string}`
);
console.log(
`Updated ${result2.modifiedCount} documents to "access: private" and removed private var in ${string}`
);
}
console.log("Migration completed successfully!");
} catch (error) {
console.error("Migration failed:", error);
} finally {
await client.close();
console.log("MongoDB connection closed.");
}
}
//migrateData(); // uncomment to run the migration

11
src/components/Diagnostic.tsx
View File

@@ -1,17 +1,12 @@
import {infoButtonStyle} from "@/constants/buttonStyles";
import {Module} from "@/interfaces";
import {User} from "@/interfaces/user";
import useExamStore from "@/stores/exam";
import {getExam, getExamById} from "@/utils/exams";
import {getExam} from "@/utils/exams";
import {MODULE_ARRAY} from "@/utils/moduleUtils";
import {writingMarking} from "@/utils/score";
import {Menu} from "@headlessui/react";
import axios from "axios";
import clsx from "clsx";
import {capitalize} from "lodash";
import {useRouter} from "next/router";
import {useEffect, useState} from "react";
import {BsBook, BsChevronDown, BsHeadphones, BsMegaphone, BsPen, BsQuestionSquare} from "react-icons/bs";
import { useState} from "react";
import { BsQuestionSquare} from "react-icons/bs";
import {toast} from "react-toastify";
import Button from "./Low/Button";
import ModuleLevelSelector from "./Medium/ModuleLevelSelector";

6
src/components/ExamEditor/SettingsEditor/level.tsx
View File

@@ -38,7 +38,7 @@ const LevelSettings: React.FC = () => {
difficulty,
sections,
minTimer,
isPrivate,
access,
} = useExamEditorStore(state => state.modules[currentModule]);
const { localSettings, updateLocalAndScheduleGlobal } = useSettingsState<LevelSectionSettings>(
@@ -200,7 +200,7 @@ const LevelSettings: React.FC = () => {
module: "level",
id: title,
difficulty,
private: isPrivate,
access,
};
const result = await axios.post('/api/exam/level', exam);
@@ -243,7 +243,7 @@ const LevelSettings: React.FC = () => {
isDiagnostic: false,
variant: undefined,
difficulty,
private: isPrivate,
access,
} as LevelExam);
setExerciseIndex(0);
setQuestionIndex(0);

6
src/components/ExamEditor/SettingsEditor/listening/index.tsx
View File

@@ -27,7 +27,7 @@ const ListeningSettings: React.FC = () => {
difficulty,
sections,
minTimer,
isPrivate,
access,
instructionsState
} = useExamEditorStore(state => state.modules[currentModule]);
@@ -144,7 +144,7 @@ const ListeningSettings: React.FC = () => {
id: title,
variant: sections.length === 4 ? "full" : "partial",
difficulty,
private: isPrivate,
access,
instructions: instructionsURL
};
@@ -191,7 +191,7 @@ const ListeningSettings: React.FC = () => {
isDiagnostic: false,
variant: sections.length === 4 ? "full" : "partial",
difficulty,
private: isPrivate,
access,
instructions: instructionsState.currentInstructionsURL
} as ListeningExam);
setExerciseIndex(0);

64
src/components/ExamEditor/SettingsEditor/reading/index.tsx
View File

@@ -26,40 +26,38 @@ const ReadingSettings: React.FC = () => {
} = usePersistentExamStore();
const { currentModule, title } = useExamEditorStore();
const {
focusedSection,
difficulty,
sections,
minTimer,
isPrivate,
type,
} = useExamEditorStore(state => state.modules[currentModule]);
const { focusedSection, difficulty, sections, minTimer, access, type } =
useExamEditorStore((state) => state.modules[currentModule]);
const { localSettings, updateLocalAndScheduleGlobal } = useSettingsState<ReadingSectionSettings>(
currentModule,
focusedSection
);
const currentSection = sections.find((section) => section.sectionId == focusedSection)?.state as ReadingPart;
const { localSettings, updateLocalAndScheduleGlobal } =
useSettingsState<ReadingSectionSettings>(currentModule, focusedSection);
const currentSection = sections.find(
(section) => section.sectionId == focusedSection
)?.state as ReadingPart;
const defaultPresets: Option[] = [
{
label: "Preset: Reading Passage 1",
value: "Welcome to {part} of the {label}. You will read texts relating to everyday topics and situations. These may include advertisements, brochures, manuals, or official documents. Answer questions that test your ability to locate specific information and understand main ideas."
value:
"Welcome to {part} of the {label}. You will read texts relating to everyday topics and situations. These may include advertisements, brochures, manuals, or official documents. Answer questions that test your ability to locate specific information and understand main ideas.",
},
{
label: "Preset: Reading Passage 2",
value: "Welcome to {part} of the {label}. You will read texts dealing with general interest topics that may include news articles, company policies, or workplace documents. Answer questions testing your understanding of main ideas, specific details, and the author's views."
value:
"Welcome to {part} of the {label}. You will read texts dealing with general interest topics that may include news articles, company policies, or workplace documents. Answer questions testing your understanding of main ideas, specific details, and the author's views.",
},
{
label: "Preset: Reading Passage 3",
value: "Welcome to {part} of the {label}. You will read longer academic texts that may include journal articles, academic essays, or research papers. Answer questions testing your ability to understand complex arguments, identify key points, and follow the development of ideas."
}
value:
"Welcome to {part} of the {label}. You will read longer academic texts that may include journal articles, academic essays, or research papers. Answer questions testing your ability to understand complex arguments, identify key points, and follow the development of ideas.",
},
];
const canPreviewOrSubmit = sections.some(
(s) => (s.state as ReadingPart).exercises && (s.state as ReadingPart).exercises.length > 0
(s) =>
(s.state as ReadingPart).exercises &&
(s.state as ReadingPart).exercises.length > 0
);
const submitReading = () => {
@@ -73,7 +71,7 @@ const ReadingSettings: React.FC = () => {
return {
...exercise,
intro: localSettings.currentIntro,
category: localSettings.category
category: localSettings.category,
};
}),
isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
@@ -82,11 +80,12 @@ const ReadingSettings: React.FC = () => {
id: title,
variant: sections.length === 3 ? "full" : "partial",
difficulty,
private: isPrivate,
type: type!
access,
type: type!,
};
axios.post(`/api/exam/reading`, exam)
axios
.post(`/api/exam/reading`, exam)
.then((result) => {
playSound("sent");
// Successfully submitted exam
@@ -98,9 +97,12 @@ const ReadingSettings: React.FC = () => {
})
.catch((error) => {
console.log(error);
toast.error(error.response.data.error || "Something went wrong while submitting, please try again later.");
})
}
toast.error(
error.response.data.error ||
"Something went wrong while submitting, please try again later."
);
});
};
const preview = () => {
setExam({
@@ -109,7 +111,7 @@ const ReadingSettings: React.FC = () => {
return {
...exercises,
intro: s.settings.currentIntro,
category: s.settings.category
category: s.settings.category,
};
}),
minTimer,
@@ -118,15 +120,15 @@ const ReadingSettings: React.FC = () => {
isDiagnostic: false,
variant: undefined,
difficulty,
private: isPrivate,
type: type!
access: access,
type: type!,
} as ReadingExam);
setExerciseIndex(0);
setQuestionIndex(0);
setPartIndex(0);
setBgColor("bg-white");
openDetachedTab("popout?type=Exam&module=reading", router)
}
openDetachedTab("popout?type=Exam&module=reading", router);
};
return (
<SettingsEditor

6
src/components/ExamEditor/SettingsEditor/speaking/index.tsx
View File

@@ -30,7 +30,7 @@ const SpeakingSettings: React.FC = () => {
} = usePersistentExamStore();
const { title, currentModule } = useExamEditorStore();
const { focusedSection, difficulty, sections, minTimer, isPrivate } = useExamEditorStore((store) => store.modules[currentModule])
const { focusedSection, difficulty, sections, minTimer, access } = useExamEditorStore((store) => store.modules[currentModule])
const section = sections.find((section) => section.sectionId == focusedSection)?.state;
@@ -185,7 +185,7 @@ const SpeakingSettings: React.FC = () => {
variant: undefined,
difficulty,
instructorGender: "varied",
private: isPrivate,
access,
};
const result = await axios.post('/api/exam/speaking', exam);
@@ -238,7 +238,7 @@ const SpeakingSettings: React.FC = () => {
isDiagnostic: false,
variant: undefined,
difficulty,
private: isPrivate,
access,
} as SpeakingExam);
setExerciseIndex(0);
setQuestionIndex(0);

6
src/components/ExamEditor/SettingsEditor/writing/index.tsx
View File

@@ -23,7 +23,7 @@ const WritingSettings: React.FC = () => {
const {
minTimer,
difficulty,
isPrivate,
access,
sections,
focusedSection,
type,
@@ -81,7 +81,7 @@ const WritingSettings: React.FC = () => {
isDiagnostic: false,
variant: undefined,
difficulty,
private: isPrivate,
access,
type: type!
});
setExerciseIndex(0);
@@ -134,7 +134,7 @@ const WritingSettings: React.FC = () => {
isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
variant: undefined,
difficulty,
private: isPrivate,
access,
type: type!
};

137
src/components/ExamEditor/index.tsx
View File

@@ -3,12 +3,12 @@ import SectionRenderer from "./SectionRenderer";
import Checkbox from "../Low/Checkbox";
import Input from "../Low/Input";
import Select from "../Low/Select";
import {capitalize} from "lodash";
import {Difficulty} from "@/interfaces/exam";
import {useCallback, useEffect, useMemo, useState} from "react";
import {toast} from "react-toastify";
import {ModuleState, SectionState} from "@/stores/examEditor/types";
import {Module} from "@/interfaces";
import { capitalize } from "lodash";
import { AccessType, ACCESSTYPE, Difficulty } from "@/interfaces/exam";
import { useCallback, useEffect, useState } from "react";
import { toast } from "react-toastify";
import { ModuleState, SectionState } from "@/stores/examEditor/types";
import { Module } from "@/interfaces";
import useExamEditorStore from "@/stores/examEditor";
import WritingSettings from "./SettingsEditor/writing";
import ReadingSettings from "./SettingsEditor/reading";
@@ -16,24 +16,33 @@ import LevelSettings from "./SettingsEditor/level";
import ListeningSettings from "./SettingsEditor/listening";
import SpeakingSettings from "./SettingsEditor/speaking";
import ImportOrStartFromScratch from "./ImportExam/ImportOrFromScratch";
import {defaultSectionSettings} from "@/stores/examEditor/defaults";
import { defaultSectionSettings } from "@/stores/examEditor/defaults";
import Button from "../Low/Button";
import ResetModule from "./Standalone/ResetModule";
import ListeningInstructions from "./Standalone/ListeningInstructions";
import {EntityWithRoles} from "@/interfaces/entity";
import { EntityWithRoles } from "@/interfaces/entity";
const DIFFICULTIES: Difficulty[] = ["A1", "A2", "B1", "B2", "C1", "C2"];
const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: EntityWithRoles[]}> = ({
levelParts = 0,
entitiesAllowEditPrivacy = [],
}) => {
const {currentModule, dispatch} = useExamEditorStore();
const {sections, minTimer, expandedSections, examLabel, isPrivate, difficulty, sectionLabels, importModule} = useExamEditorStore(
(state) => state.modules[currentModule],
);
const ExamEditor: React.FC<{
levelParts?: number;
entitiesAllowEditPrivacy: EntityWithRoles[];
}> = ({ levelParts = 0, entitiesAllowEditPrivacy = [] }) => {
const { currentModule, dispatch } = useExamEditorStore();
const {
sections,
minTimer,
expandedSections,
examLabel,
access,
difficulty,
sectionLabels,
importModule,
} = useExamEditorStore((state) => state.modules[currentModule]);
const [numberOfLevelParts, setNumberOfLevelParts] = useState(levelParts !== 0 ? levelParts : 1);
const [numberOfLevelParts, setNumberOfLevelParts] = useState(
levelParts !== 0 ? levelParts : 1
);
const [isResetModuleOpen, setIsResetModuleOpen] = useState(false);
// For exam edits
@@ -44,7 +53,7 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
type: "UPDATE_MODULE",
payload: {
updates: {
sectionLabels: Array.from({length: levelParts}).map((_, i) => ({
sectionLabels: Array.from({ length: levelParts }).map((_, i) => ({
id: i + 1,
label: `Part ${i + 1}`,
})),
@@ -61,11 +70,16 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
const currentLabels = sectionLabels;
let updatedSections: SectionState[];
let updatedLabels: any;
if ((currentModule === "level" && currentSections.length !== currentLabels.length) || numberOfLevelParts !== currentSections.length) {
if (
(currentModule === "level" &&
currentSections.length !== currentLabels.length) ||
numberOfLevelParts !== currentSections.length
) {
const newSections = [...currentSections];
const newLabels = [...currentLabels];
for (let i = currentLabels.length; i < numberOfLevelParts; i++) {
if (currentSections.length !== numberOfLevelParts) newSections.push(defaultSectionSettings(currentModule, i + 1));
if (currentSections.length !== numberOfLevelParts)
newSections.push(defaultSectionSettings(currentModule, i + 1));
newLabels.push({
id: i + 1,
label: `Part ${i + 1}`,
@@ -80,7 +94,9 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
return;
}
const updatedExpandedSections = expandedSections.filter((sectionId) => updatedSections.some((section) => section.sectionId === sectionId));
const updatedExpandedSections = expandedSections.filter((sectionId) =>
updatedSections.some((section) => section.sectionId === sectionId)
);
dispatch({
type: "UPDATE_MODULE",
@@ -99,9 +115,9 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
const updateModule = useCallback(
(updates: Partial<ModuleState>) => {
dispatch({type: "UPDATE_MODULE", payload: {updates}});
dispatch({ type: "UPDATE_MODULE", payload: { updates } });
},
[dispatch],
[dispatch]
);
const toggleSection = (sectionId: number) => {
@@ -109,7 +125,7 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
toast.error("Include at least one section!");
return;
}
dispatch({type: "TOGGLE_SECTION", payload: {sectionId}});
dispatch({ type: "TOGGLE_SECTION", payload: { sectionId } });
};
const ModuleSettings: Record<Module, React.ComponentType> = {
@@ -121,7 +137,8 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
};
const Settings = ModuleSettings[currentModule];
const showImport = importModule && ["reading", "listening", "level"].includes(currentModule);
const showImport =
importModule && ["reading", "listening", "level"].includes(currentModule);
const updateLevelParts = (parts: number) => {
setNumberOfLevelParts(parts);
@@ -130,7 +147,10 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
return (
<>
{showImport ? (
<ImportOrStartFromScratch module={currentModule} setNumberOfLevelParts={updateLevelParts} />
<ImportOrStartFromScratch
module={currentModule}
setNumberOfLevelParts={updateLevelParts}
/>
) : (
<>
{isResetModuleOpen && (
@@ -144,7 +164,9 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
<div className="flex gap-4 w-full items-center -xl:flex-col">
<div className="flex flex-row gap-3 w-full">
<div className="flex flex-col gap-3">
<label className="font-normal text-base text-mti-gray-dim">Timer</label>
<label className="font-normal text-base text-mti-gray-dim">
Timer
</label>
<Input
type="number"
name="minTimer"
@@ -158,7 +180,9 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
/>
</div>
<div className="flex flex-col gap-3 flex-grow">
<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
isMulti={true}
options={DIFFICULTIES.map((x) => ({
@@ -166,12 +190,17 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
label: capitalize(x),
}))}
onChange={(values) => {
const selectedDifficulties = values ? values.map((v) => v.value as Difficulty) : [];
updateModule({difficulty: selectedDifficulties});
const selectedDifficulties = values
? values.map((v) => v.value as Difficulty)
: [];
updateModule({ difficulty: selectedDifficulties });
}}
value={
difficulty
? difficulty.map((d) => ({
? (Array.isArray(difficulty)
? difficulty
: [difficulty]
).map((d) => ({
value: d,
label: capitalize(d),
}))
@@ -182,9 +211,11 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
</div>
{sectionLabels.length != 0 && currentModule !== "level" ? (
<div className="flex flex-col gap-3 -xl:w-full">
<label className="font-normal text-base text-mti-gray-dim">{sectionLabels[0].label.split(" ")[0]}</label>
<label className="font-normal text-base text-mti-gray-dim">
{sectionLabels[0].label.split(" ")[0]}
</label>
<div className="flex flex-row gap-8">
{sectionLabels.map(({id, label}) => (
{sectionLabels.map(({ id, label }) => (
<span
key={id}
className={clsx(
@@ -192,9 +223,10 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
"transition duration-300 ease-in-out",
sectionIds.includes(id)
? `bg-ielts-${currentModule}/70 border-ielts-${currentModule} text-white`
: "bg-white border-mti-gray-platinum",
: "bg-white border-mti-gray-platinum"
)}
onClick={() => toggleSection(id)}>
onClick={() => toggleSection(id)}
>
{label}
</span>
))}
@@ -202,7 +234,9 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
</div>
) : (
<div className="flex flex-col gap-3 w-1/3">
<label className="font-normal text-base text-mti-gray-dim">Number of Parts</label>
<label className="font-normal text-base text-mti-gray-dim">
Number of Parts
</label>
<Input
type="number"
name="Number of Parts"
@@ -212,24 +246,32 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
/>
</div>
)}
<div className="flex flex-col gap-3 w-fit h-fit">
<div className="h-6" />
<Checkbox
isChecked={isPrivate}
onChange={(checked) => updateModule({isPrivate: checked})}
disabled={entitiesAllowEditPrivacy.length === 0}>
Privacy (Only available for Assignments)
</Checkbox>
</div>
<div className="flex flex-row gap-3 w-64">
<Select
label="Access Type"
options={ACCESSTYPE.map((item) => ({
value: item,
label: capitalize(item),
}))}
onChange={(value) => {
if (value?.value) {
updateModule({ access: value.value! as AccessType });
}
}}
value={{ value: access, label: capitalize(access) }}
/>
</div>
<div className="flex flex-row gap-3 w-full">
<div className="flex flex-col gap-3 flex-grow">
<label className="font-normal text-base text-mti-gray-dim">Exam Label *</label>
<label className="font-normal text-base text-mti-gray-dim">
Exam Label *
</label>
<Input
type="text"
placeholder="Exam Label"
name="label"
onChange={(text) => updateModule({examLabel: text})}
onChange={(text) => updateModule({ examLabel: text })}
roundness="xl"
value={examLabel}
required
@@ -239,7 +281,8 @@ const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: Entit
<Button
onClick={() => setIsResetModuleOpen(true)}
customColor={`bg-ielts-${currentModule}/70 hover:bg-ielts-${currentModule} border-ielts-${currentModule}`}
className={`text-white self-end`}>
className={`text-white self-end`}
>
Reset Module
</Button>
</div>

8
src/components/High/Table.tsx
View File

@@ -149,10 +149,16 @@ export default function Table<T>({
))}
</tbody>
</table>
{isLoading && (
{isLoading ? (
<div className="min-h-screen flex justify-center items-start">
<span className="loading loading-infinity w-32" />
</div>
) : (
rows.length === 0 && (
<div className="w-full flex justify-center items-start">
<span className="text-xl text-gray-500">No data found...</span>
</div>
)
)}
</div>
);

8
src/hooks/useExams.tsx
View File

@@ -1,6 +1,6 @@
import {Exam} from "@/interfaces/exam";
import { Exam } from "@/interfaces/exam";
import axios from "axios";
import {useEffect, useState} from "react";
import { useEffect, useState } from "react";
export default function useExams() {
const [exams, setExams] = useState<Exam[]>([]);
@@ -10,12 +10,12 @@ export default function useExams() {
const getData = () => {
setIsLoading(true);
axios
.get<Exam[]>("/api/exam")
.get<Exam[]>(`/api/exam`)
.then((response) => setExams(response.data))
.finally(() => setIsLoading(false));
};
useEffect(getData, []);
return {exams, isLoading, isError, reload: getData};
return { exams, isLoading, isError, reload: getData };
}

115
src/hooks/usePagination.tsx
View File

@@ -1,25 +1,74 @@
import Button from "@/components/Low/Button";
import {useMemo, useState} from "react";
import {BiChevronLeft} from "react-icons/bi";
import {BsChevronDoubleLeft, BsChevronDoubleRight, BsChevronLeft, BsChevronRight} from "react-icons/bs";
import { useEffect, useMemo, useState } from "react";
import {
BsChevronDoubleLeft,
BsChevronDoubleRight,
BsChevronLeft,
BsChevronRight,
} from "react-icons/bs";
import Select from "../components/Low/Select";
export default function usePagination<T>(list: T[], size = 25) {
const [page, setPage] = useState(0);
const [itemsPerPage, setItemsPerPage] = useState(size);
const items = useMemo(() => list.slice(page * size, (page + 1) * size), [page, size, list]);
const items = useMemo(
() => list.slice(page * itemsPerPage, (page + 1) * itemsPerPage),
[list, page, itemsPerPage]
);
useEffect(() => {
if (page * itemsPerPage >= list.length) setPage(0);
}, [items, itemsPerPage, list.length, page]);
const itemsPerPageOptions = [25, 50, 100, 200];
const render = () => (
<div className="w-full flex gap-2 justify-between items-center">
<div className="flex items-center gap-4 w-fit">
<Button className="w-[200px] h-fit" disabled={page === 0} onClick={() => setPage((prev) => prev - 1)}>
<Button
className="w-[200px] h-fit"
disabled={page === 0}
onClick={() => setPage((prev) => prev - 1)}
>
Previous Page
</Button>
</div>
<div className="flex items-center gap-4 w-fit">
<span className="opacity-80">
{page * size + 1} - {(page + 1) * size > list.length ? list.length : (page + 1) * size} / {list.length}
<div className="flex flex-row items-center gap-1 w-56">
<Select
value={{
value: itemsPerPage.toString(),
label: (itemsPerPage * page > items.length
? items.length
: itemsPerPage * page
).toString(),
}}
onChange={(value) =>
setItemsPerPage(parseInt(value!.value ?? "25"))
}
options={itemsPerPageOptions.map((size) => ({
label: size.toString(),
value: size.toString(),
}))}
isClearable={false}
styles={{
control: (styles) => ({ ...styles, width: "100px" }),
container: (styles) => ({ ...styles, width: "100px" }),
}}
/>
<span className="opacity-80 w-32 text-center">
{page * itemsPerPage + 1} -{" "}
{itemsPerPage * (page + 1) > list.length
? list.length
: itemsPerPage * (page + 1)}
{list.length}
</span>
<Button className="w-[200px]" disabled={(page + 1) * size >= list.length} onClick={() => setPage((prev) => prev + 1)}>
</div>
<Button
className="w-[200px]"
disabled={(page + 1) * itemsPerPage >= list.length}
onClick={() => setPage((prev) => prev + 1)}
>
Next Page
</Button>
</div>
@@ -29,32 +78,64 @@ export default function usePagination<T>(list: T[], size = 25) {
const renderMinimal = () => (
<div className="flex gap-4 items-center">
<div className="flex gap-2 items-center">
<button disabled={page === 0} onClick={() => setPage(0)} className="disabled:opacity-60 disabled:cursor-not-allowed">
<button
disabled={page === 0}
onClick={() => setPage(0)}
className="disabled:opacity-60 disabled:cursor-not-allowed"
>
<BsChevronDoubleLeft />
</button>
<button disabled={page === 0} onClick={() => setPage((prev) => prev - 1)} className="disabled:opacity-60 disabled:cursor-not-allowed">
<button
disabled={page === 0}
onClick={() => setPage((prev) => prev - 1)}
className="disabled:opacity-60 disabled:cursor-not-allowed"
>
<BsChevronLeft />
</button>
</div>
<div className="flex flex-row items-center gap-1 w-56">
<Select
value={{
value: itemsPerPage.toString(),
label: itemsPerPage.toString(),
}}
onChange={(value) => setItemsPerPage(parseInt(value!.value ?? "25"))}
options={itemsPerPageOptions.map((size) => ({
label: size.toString(),
value: size.toString(),
}))}
isClearable={false}
styles={{
control: (styles) => ({ ...styles, width: "100px" }),
container: (styles) => ({ ...styles, width: "100px" }),
}}
/>
<span className="opacity-80 w-32 text-center">
{page * size + 1} - {(page + 1) * size > list.length ? list.length : (page + 1) * size} / {list.length}
{page * itemsPerPage + 1} -{" "}
{itemsPerPage * (page + 1) > list.length
? list.length
: itemsPerPage * (page + 1)}
/ {list.length}
</span>
</div>
<div className="flex gap-2 items-center">
<button
disabled={(page + 1) * size >= list.length}
disabled={(page + 1) * itemsPerPage >= list.length}
onClick={() => setPage((prev) => prev + 1)}
className="disabled:opacity-60 disabled:cursor-not-allowed">
className="disabled:opacity-60 disabled:cursor-not-allowed"
>
<BsChevronRight />
</button>
<button
disabled={(page + 1) * size >= list.length}
onClick={() => setPage(Math.floor(list.length / size))}
className="disabled:opacity-60 disabled:cursor-not-allowed">
disabled={(page + 1) * itemsPerPage >= list.length}
onClick={() => setPage(Math.floor(list.length / itemsPerPage))}
className="disabled:opacity-60 disabled:cursor-not-allowed"
>
<BsChevronDoubleRight />
</button>
</div>
</div>
);
return {page, items, setPage, render, renderMinimal};
return { page, items, setPage, render, renderMinimal };
}

6
src/interfaces/exam.ts
View File

@@ -1,4 +1,3 @@
import instructions from "@/pages/api/exam/media/instructions";
import { Module } from ".";
export type Exam = ReadingExam | ListeningExam | WritingExam | SpeakingExam | LevelExam;
@@ -10,6 +9,9 @@ export type Difficulty = BasicDifficulty | CEFRLevels;
// Left easy, medium and hard to support older exam versions
export type BasicDifficulty = "easy" | "medium" | "hard";
export type CEFRLevels = "A1" | "A2" | "B1" | "B2" | "C1" | "C2";
export const ACCESSTYPE = ["public", "private", "confidential"] as const;
export type AccessType = typeof ACCESSTYPE[number];
export interface ExamBase {
@@ -24,7 +26,7 @@ export interface ExamBase {
shuffle?: boolean;
createdBy?: string; // option as it has been added later
createdAt?: string; // option as it has been added later
private?: boolean;
access: AccessType;
label?: string;
}
export interface ReadingExam extends ExamBase {

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

@@ -265,7 +265,7 @@ export default function CorporateGradingSystem({
<>
<Separator />
<label className="font-normal text-base text-mti-gray-dim">
Apply this grading system to other entities
Copy this grading system to other entities
</label>
<Select
options={entities.map((e) => ({ value: e.id, label: e.label }))}
@@ -282,7 +282,7 @@ export default function CorporateGradingSystem({
disabled={isLoading || otherEntities.length === 0}
variant="outline"
>
Apply to {otherEntities.length} other entities
Copy to {otherEntities.length} other entities
</Button>
<Separator />
</>
@@ -326,7 +326,7 @@ export default function CorporateGradingSystem({
disabled={isLoading}
className="mt-8"
>
Save Grading System
Save Changes to entities
</Button>
</div>
);

82
src/pages/(admin)/Lists/CodeList.tsx
View File

@@ -15,26 +15,41 @@ import { findBy, mapBy } from "@/utils";
import useEntitiesCodes from "@/hooks/useEntitiesCodes";
import Table from "@/components/High/Table";
type TableData = Code & { entity?: EntityWithRoles, creator?: User }
type TableData = Code & { entity?: EntityWithRoles; creator?: User };
const columnHelper = createColumnHelper<TableData>();
export default function CodeList({ user, entities, canDeleteCodes }
: { user: User, entities: EntityWithRoles[], canDeleteCodes?: boolean }) {
export default function CodeList({
user,
entities,
canDeleteCodes,
}: {
user: User;
entities: EntityWithRoles[];
canDeleteCodes?: boolean;
}) {
const [selectedCodes, setSelectedCodes] = useState<string[]>([]);
const entityIDs = useMemo(() => mapBy(entities, 'id'), [entities])
const entityIDs = useMemo(() => mapBy(entities, "id"), [entities]);
const { users } = useUsers();
const { codes, reload } = useEntitiesCodes(isAdmin(user) ? undefined : entityIDs)
const { codes, reload, isLoading } = useEntitiesCodes(
isAdmin(user) ? undefined : entityIDs
);
const data: TableData[] = useMemo(() => codes.map((code) => ({
const data: TableData[] = useMemo(
() =>
codes.map((code) => ({
...code,
entity: findBy(entities, 'id', code.entity),
creator: findBy(users, 'id', code.creator)
})) as TableData[], [codes, entities, users])
entity: findBy(entities, "id", code.entity),
creator: findBy(users, "id", code.creator),
})) as TableData[],
[codes, entities, users]
);
const toggleCode = (id: string) => {
setSelectedCodes((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));
setSelectedCodes((prev) =>
prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]
);
};
// const toggleAllCodes = (checked: boolean) => {
@@ -44,8 +59,11 @@ export default function CodeList({ user, entities, canDeleteCodes }
// };
const deleteCodes = async (codes: string[]) => {
if (!canDeleteCodes) return
if (!confirm(`Are you sure you want to delete these ${codes.length} code(s)?`)) return;
if (!canDeleteCodes) return;
if (
!confirm(`Are you sure you want to delete these ${codes.length} code(s)?`)
)
return;
const params = new URLSearchParams();
codes.forEach((code) => params.append("code", code));
@@ -73,8 +91,9 @@ export default function CodeList({ user, entities, canDeleteCodes }
};
const deleteCode = async (code: Code) => {
if (!canDeleteCodes) return
if (!confirm(`Are you sure you want to delete this "${code.code}" code?`)) return;
if (!canDeleteCodes) return;
if (!confirm(`Are you sure you want to delete this "${code.code}" code?`))
return;
axios
.delete(`/api/code/${code.code}`)
@@ -99,10 +118,13 @@ export default function CodeList({ user, entities, canDeleteCodes }
columnHelper.accessor("code", {
id: "codeCheckbox",
enableSorting: false,
header: () => (""),
header: () => "",
cell: (info) =>
!info.row.original.userId ? (
<Checkbox isChecked={selectedCodes.includes(info.getValue())} onChange={() => toggleCode(info.getValue())}>
<Checkbox
isChecked={selectedCodes.includes(info.getValue())}
onChange={() => toggleCode(info.getValue())}
>
{""}
</Checkbox>
) : null,
@@ -113,7 +135,8 @@ export default function CodeList({ user, entities, canDeleteCodes }
}),
columnHelper.accessor("creationDate", {
header: "Creation Date",
cell: (info) => (info.getValue() ? moment(info.getValue()).format("DD/MM/YYYY") : "N/A"),
cell: (info) =>
info.getValue() ? moment(info.getValue()).format("DD/MM/YYYY") : "N/A",
}),
columnHelper.accessor("email", {
header: "E-mail",
@@ -121,7 +144,12 @@ export default function CodeList({ user, entities, canDeleteCodes }
}),
columnHelper.accessor("creator", {
header: "Creator",
cell: (info) => info.getValue() ? `${info.getValue().name} (${USER_TYPE_LABELS[info.getValue().type]})` : "N/A",
cell: (info) =>
info.getValue()
? `${info.getValue().name} (${
USER_TYPE_LABELS[info.getValue().type]
})`
: "N/A",
}),
columnHelper.accessor("entity", {
header: "Entity",
@@ -147,7 +175,11 @@ export default function CodeList({ user, entities, canDeleteCodes }
return (
<div className="flex gap-4">
{canDeleteCodes && !row.original.userId && (
<div data-tip="Delete" className="cursor-pointer tooltip" onClick={() => deleteCode(row.original)}>
<div
data-tip="Delete"
className="cursor-pointer tooltip"
onClick={() => deleteCode(row.original)}
>
<BsTrash className="hover:text-mti-purple-light transition ease-in-out duration-300" />
</div>
)}
@@ -168,7 +200,8 @@ export default function CodeList({ user, entities, canDeleteCodes }
variant="outline"
color="red"
className="!py-1 px-10"
onClick={() => deleteCodes(selectedCodes)}>
onClick={() => deleteCodes(selectedCodes)}
>
Delete
</Button>
</div>
@@ -177,7 +210,14 @@ export default function CodeList({ user, entities, canDeleteCodes }
<Table<TableData>
data={data}
columns={defaultColumns}
searchFields={[["code"], ["email"], ["entity", "label"], ["creator", "name"], ['creator', 'type']]}
isLoading={isLoading}
searchFields={[
["code"],
["email"],
["entity", "label"],
["creator", "name"],
["creator", "type"],
]}
/>
</>
);

229
src/pages/(admin)/Lists/ExamList.tsx
View File

@@ -1,54 +1,79 @@
import {useMemo, useState} from "react";
import {PERMISSIONS} from "@/constants/userPermissions";
import { useMemo, useState } from "react";
import { PERMISSIONS } from "@/constants/userPermissions";
import useExams from "@/hooks/useExams";
import useUsers from "@/hooks/useUsers";
import {Module} from "@/interfaces";
import {Exam} from "@/interfaces/exam";
import {User} from "@/interfaces/user";
import { Module } from "@/interfaces";
import { Exam } from "@/interfaces/exam";
import { User } from "@/interfaces/user";
import useExamStore from "@/stores/exam";
import {getExamById} from "@/utils/exams";
import {countExercises} from "@/utils/moduleUtils";
import {createColumnHelper, flexRender, getCoreRowModel, useReactTable} from "@tanstack/react-table";
import { getExamById } from "@/utils/exams";
import { countExercises } from "@/utils/moduleUtils";
import {
createColumnHelper,
flexRender,
getCoreRowModel,
useReactTable,
} from "@tanstack/react-table";
import axios from "axios";
import {capitalize, uniq} from "lodash";
import {useRouter} from "next/router";
import {BsBan, BsCheck, BsCircle, BsPencil, BsTrash, BsUpload, BsX} from "react-icons/bs";
import {toast} from "react-toastify";
import {useListSearch} from "@/hooks/useListSearch";
import { capitalize } from "lodash";
import { useRouter } from "next/router";
import { BsCheck, BsPencil, BsTrash, BsUpload, BsX } from "react-icons/bs";
import { toast } from "react-toastify";
import { useListSearch } from "@/hooks/useListSearch";
import Modal from "@/components/Modal";
import {checkAccess} from "@/utils/permissions";
import useGroups from "@/hooks/useGroups";
import { checkAccess, findAllowedEntities } from "@/utils/permissions";
import Button from "@/components/Low/Button";
import {EntityWithRoles} from "@/interfaces/entity";
import {BiEdit} from "react-icons/bi";
import {findBy, mapBy} from "@/utils";
import {getUserName} from "@/utils/users";
import { EntityWithRoles } from "@/interfaces/entity";
import { BiEdit } from "react-icons/bi";
import { findBy, mapBy } from "@/utils";
const searchFields = [["module"], ["id"], ["createdBy"]];
const CLASSES: {[key in Module]: string} = {
const CLASSES: { [key in Module]: string } = {
reading: "text-ielts-reading",
listening: "text-ielts-listening",
speaking: "text-ielts-speaking",
writing: "text-ielts-writing",
level: "text-ielts-level",
};
const columnHelper = createColumnHelper<Exam>();
export default function ExamList({user, entities}: {user: User; entities: EntityWithRoles[]}) {
export default function ExamList({
user,
entities,
}: {
user: User;
entities: EntityWithRoles[];
}) {
const [selectedExam, setSelectedExam] = useState<Exam>();
const {exams, reload} = useExams();
const {users} = useUsers();
const canViewConfidentialEntities = useMemo(
() =>
mapBy(
findAllowedEntities(user, entities, "view_confidential_exams"),
"id"
),
[user, entities]
);
const { exams, reload, isLoading } = useExams();
const { users } = useUsers();
// Pass this permission filter to the backend later
const filteredExams = useMemo(
() =>
exams.filter((e) => {
if (!e.private) return true;
return (e.entities || []).some((ent) => mapBy(user.entities, "id").includes(ent));
["admin", "developer"].includes(user.type)
? exams
: exams.filter((item) => {
if (
item.access === "confidential" &&
!canViewConfidentialEntities.find((x) =>
(item.entities ?? []).includes(x)
)
)
return false;
return true;
}),
[exams, user?.entities],
[canViewConfidentialEntities, exams, user.type]
);
const parsedExams = useMemo(() => {
@@ -67,7 +92,10 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
});
}, [filteredExams, users]);
const {rows: filteredRows, renderSearch} = useListSearch<Exam>(searchFields, parsedExams);
const { rows: filteredRows, renderSearch } = useListSearch<Exam>(
searchFields,
parsedExams
);
const dispatch = useExamStore((state) => state.dispatch);
@@ -76,22 +104,36 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
const loadExam = async (module: Module, examId: string) => {
const exam = await getExamById(module, 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;
}
dispatch({type: "INIT_EXAM", payload: {exams: [exam], modules: [module]}});
dispatch({
type: "INIT_EXAM",
payload: { exams: [exam], modules: [module] },
});
router.push("/exam");
};
/*
const privatizeExam = async (exam: Exam) => {
if (!confirm(`Are you sure you want to make this ${capitalize(exam.module)} exam ${exam.private ? "public" : "private"}?`)) return;
if (
!confirm(
`Are you sure you want to make this ${capitalize(exam.module)} exam ${
exam.access
}?`
)
)
return;
axios
.patch(`/api/exam/${exam.module}/${exam.id}`, {private: !exam.private})
.patch(`/api/exam/${exam.module}/${exam.id}`, { private: !exam.private })
.then(() => toast.success(`Updated the "${exam.id}" exam`))
.catch((reason) => {
if (reason.response.status === 404) {
@@ -108,9 +150,15 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
})
.finally(reload);
};
*/
const deleteExam = async (exam: Exam) => {
if (!confirm(`Are you sure you want to delete this ${capitalize(exam.module)} exam?`)) return;
if (
!confirm(
`Are you sure you want to delete this ${capitalize(exam.module)} exam?`
)
)
return;
axios
.delete(`/api/exam/${exam.module}/${exam.id}`)
@@ -132,8 +180,12 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
};
const getTotalExercises = (exam: Exam) => {
if (exam.module === "reading" || exam.module === "listening" || exam.module === "level") {
return countExercises(exam.parts.flatMap((x) => x.exercises));
if (
exam.module === "reading" ||
exam.module === "listening" ||
exam.module === "level"
) {
return countExercises((exam.parts ?? []).flatMap((x) => x.exercises));
}
return countExercises(exam.exercises);
@@ -146,7 +198,11 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
}),
columnHelper.accessor("module", {
header: "Module",
cell: (info) => <span className={CLASSES[info.getValue()]}>{capitalize(info.getValue())}</span>,
cell: (info) => (
<span className={CLASSES[info.getValue()]}>
{capitalize(info.getValue())}
</span>
),
}),
columnHelper.accessor((x) => getTotalExercises(x), {
header: "Exercises",
@@ -156,9 +212,9 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
header: "Timer",
cell: (info) => <>{info.getValue()} minute(s)</>,
}),
columnHelper.accessor("private", {
header: "Private",
cell: (info) => <span className="w-full flex items-center justify-center">{!info.getValue() ? <BsX /> : <BsCheck />}</span>,
columnHelper.accessor("access", {
header: "Access",
cell: (info) => <span>{capitalize(info.getValue())}</span>,
}),
columnHelper.accessor("createdAt", {
header: "Created At",
@@ -173,24 +229,30 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
}),
columnHelper.accessor("createdBy", {
header: "Created By",
cell: (info) => (!info.getValue() ? "System" : findBy(users, "id", info.getValue())?.name || "N/A"),
cell: (info) =>
!info.getValue()
? "System"
: findBy(users, "id", info.getValue())?.name || "N/A",
}),
{
header: "",
id: "actions",
cell: ({row}: {row: {original: Exam}}) => {
cell: ({ row }: { row: { original: Exam } }) => {
return (
<div className="flex gap-4">
{(row.original.owners?.includes(user.id) || checkAccess(user, ["admin", "developer"])) && (
{(row.original.owners?.includes(user.id) ||
checkAccess(user, ["admin", "developer"])) && (
<>
{checkAccess(user, [
"admin",
"developer",
"mastercorporate",
]) && (
<button
data-tip={row.original.private ? "Set as public" : "Set as private"}
onClick={async () => await privatizeExam(row.original)}
className="cursor-pointer tooltip">
{row.original.private ? <BsCircle /> : <BsBan />}
</button>
{checkAccess(user, ["admin", "developer", "mastercorporate"]) && (
<button data-tip="Edit exam" onClick={() => setSelectedExam(row.original)} className="cursor-pointer tooltip">
data-tip="Edit exam"
onClick={() => setSelectedExam(row.original)}
className="cursor-pointer tooltip"
>
<BsPencil />
</button>
)}
@@ -199,11 +261,18 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
<button
data-tip="Load exam"
className="cursor-pointer tooltip"
onClick={async () => await loadExam(row.original.module, row.original.id)}>
onClick={async () =>
await loadExam(row.original.module, row.original.id)
}
>
<BsUpload className="hover:text-mti-purple-light transition ease-in-out duration-300" />
</button>
{PERMISSIONS.examManagement.delete.includes(user.type) && (
<div data-tip="Delete" className="cursor-pointer tooltip" onClick={() => deleteExam(row.original)}>
<div
data-tip="Delete"
className="cursor-pointer tooltip"
onClick={() => deleteExam(row.original)}
>
<BsTrash className="hover:text-mti-purple-light transition ease-in-out duration-300" />
</div>
)}
@@ -220,34 +289,53 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
});
const handleExamEdit = () => {
router.push(`/generation?id=${selectedExam!.id}&module=${selectedExam!.module}`);
router.push(
`/generation?id=${selectedExam!.id}&module=${selectedExam!.module}`
);
};
return (
<div className="flex flex-col gap-4 w-full h-full">
{renderSearch()}
<Modal isOpen={!!selectedExam} onClose={() => setSelectedExam(undefined)} maxWidth="max-w-xl">
<Modal
isOpen={!!selectedExam}
onClose={() => setSelectedExam(undefined)}
maxWidth="max-w-xl"
>
{!!selectedExam ? (
<>
<div className="p-6">
<div className="mb-6">
<div className="flex items-center gap-2 mb-4">
<BiEdit className="w-5 h-5 text-gray-600" />
<span className="text-gray-600 font-medium">Ready to Edit</span>
<span className="text-gray-600 font-medium">
Ready to Edit
</span>
</div>
<div className="bg-gray-50 rounded-lg p-4 mb-3">
<p className="font-medium mb-1">Exam ID: {selectedExam.id}</p>
</div>
<p className="text-gray-500 text-sm">Click &apos;Next&apos; to proceed to the exam editor.</p>
<p className="text-gray-500 text-sm">
Click &apos;Next&apos; to proceed to the exam editor.
</p>
</div>
<div className="flex justify-between gap-4 mt-8">
<Button color="purple" variant="outline" onClick={() => setSelectedExam(undefined)} className="w-32">
<Button
color="purple"
variant="outline"
onClick={() => setSelectedExam(undefined)}
className="w-32"
>
Cancel
</Button>
<Button color="purple" onClick={handleExamEdit} className="w-32 text-white flex items-center justify-center gap-2">
<Button
color="purple"
onClick={handleExamEdit}
className="w-32 text-white flex items-center justify-center gap-2"
>
Proceed
</Button>
</div>
@@ -264,7 +352,12 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
<tr key={headerGroup.id}>
{headerGroup.headers.map((header) => (
<th className="p-4 text-left" key={header.id}>
{header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}
{header.isPlaceholder
? null
: flexRender(
header.column.columnDef.header,
header.getContext()
)}
</th>
))}
</tr>
@@ -272,7 +365,10 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
</thead>
<tbody className="px-2">
{table.getRowModel().rows.map((row) => (
<tr className="odd:bg-white even:bg-mti-purple-ultralight/40 rounded-lg py-2" key={row.id}>
<tr
className="odd:bg-white even:bg-mti-purple-ultralight/40 rounded-lg py-2"
key={row.id}
>
{row.getVisibleCells().map((cell) => (
<td className="px-4 py-2" key={cell.id}>
{flexRender(cell.column.columnDef.cell, cell.getContext())}
@@ -282,6 +378,17 @@ export default function ExamList({user, entities}: {user: User; entities: Entity
))}
</tbody>
</table>
{isLoading ? (
<div className="min-h-screen flex justify-center items-start">
<span className="loading loading-infinity w-32" />
</div>
) : (
filteredRows.length === 0 && (
<div className="w-full flex justify-center items-start">
<span className="text-xl text-gray-500">No data found...</span>
</div>
)
)}
</div>
);
}

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

@@ -22,8 +22,6 @@ import useFilterStore from "@/stores/listFilterStore";
import { useRouter } from "next/router";
import { mapBy } from "@/utils";
import { exportListToExcel } from "@/utils/users";
import usePermissions from "@/hooks/usePermissions";
import useUserBalance from "@/hooks/useUserBalance";
import useEntitiesUsers from "@/hooks/useEntitiesUsers";
import { WithLabeledEntities } from "@/interfaces/entity";
import Table from "@/components/High/Table";
@@ -494,21 +492,19 @@ export default function UserList({
},
];
const downloadExcel = (rows: WithLabeledEntities<User>[]) => {
const downloadExcel = async (rows: WithLabeledEntities<User>[]) => {
if (entitiesDownloadUsers.length === 0)
return toast.error("You are not allowed to download the user list.");
const allowedRows = rows.filter((r) =>
mapBy(r.entities, "id").some((e) =>
mapBy(entitiesDownloadUsers, "id").includes(e)
)
);
const csv = exportListToExcel(allowedRows);
const allowedRows = rows;
const csv = await exportListToExcel(allowedRows);
const element = document.createElement("a");
const file = new Blob([csv], { type: "text/csv" });
const file = new Blob([csv], {
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
});
element.href = URL.createObjectURL(file);
element.download = "users.csv";
element.download = "users.xlsx";
document.body.appendChild(element);
element.click();
document.body.removeChild(element);

1
src/pages/(admin)/Lists/index.tsx
View File

@@ -4,7 +4,6 @@ import clsx from "clsx";
import CodeList from "./CodeList";
import DiscountList from "./DiscountList";
import ExamList from "./ExamList";
import GroupList from "./GroupList";
import PackageList from "./PackageList";
import UserList from "./UserList";
import { checkAccess } from "@/utils/permissions";

12
src/pages/api/code/entities.ts
View File

@@ -3,16 +3,8 @@ import type { NextApiRequest, NextApiResponse } from "next";
import client from "@/lib/mongodb";
import { withIronSessionApiRoute } from "iron-session/next";
import { sessionOptions } from "@/lib/session";
import { Code, Group, Type } from "@/interfaces/user";
import { PERMISSIONS } from "@/constants/userPermissions";
import { prepareMailer, prepareMailOptions } from "@/email";
import { isAdmin } from "@/utils/users";
import { Code, } from "@/interfaces/user";
import { requestUser } from "@/utils/api";
import { doesEntityAllow } from "@/utils/permissions";
import { getEntity, getEntityWithRoles } from "@/utils/entities.be";
import { findBy } from "@/utils";
import { EntityWithRoles } from "@/interfaces/entity";
const db = client.db(process.env.MONGODB_DB);
export default withIronSessionApiRoute(handler, sessionOptions);
@@ -30,7 +22,7 @@ async function get(req: NextApiRequest, res: NextApiResponse) {
const { entities } = req.query as { entities?: string[] };
if (entities)
return res.status(200).json(await db.collection("codes").find<Code>({ entity: { $in: entities } }).toArray());
return res.status(200).json(await db.collection("codes").find<Code>({ entity: { $in: Array.isArray(entities) ? entities : [entities] } }).toArray());
return res.status(200).json(await db.collection("codes").find<Code>({}).toArray());
}

1
src/pages/api/code/index.ts
View File

@@ -32,6 +32,7 @@ async function get(req: NextApiRequest, res: NextApiResponse) {
}
const { entity } = req.query as { entity?: string };
const snapshot = await db.collection("codes").find(entity ? { entity } : {}).toArray();
res.status(200).json(snapshot);

2
src/pages/api/exam/[module]/index.ts
View File

@@ -10,6 +10,7 @@ import { getApprovalWorkflowsByExamId, updateApprovalWorkflows } from "@/utils/a
import { generateExamDifferences } from "@/utils/exam.differences";
import { getExams } from "@/utils/exams.be";
import { isAdmin } from "@/utils/users";
import { access } from "fs";
import { withIronSessionApiRoute } from "iron-session/next";
import type { NextApiRequest, NextApiResponse } from "next";
@@ -52,6 +53,7 @@ async function POST(req: NextApiRequest, res: NextApiResponse) {
try {
const exam = {
access: "public", // default access is public
...req.body,
module: module,
entities,

40
src/pages/api/exam/index.ts
View File

@@ -1,11 +1,13 @@
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
import type {NextApiRequest, NextApiResponse} from "next";
import type { NextApiRequest, NextApiResponse } from "next";
import client from "@/lib/mongodb";
import {withIronSessionApiRoute} from "iron-session/next";
import {sessionOptions} from "@/lib/session";
import {flatten} from "lodash";
import {Exam} from "@/interfaces/exam";
import {MODULE_ARRAY} from "@/utils/moduleUtils";
import { withIronSessionApiRoute } from "iron-session/next";
import { sessionOptions } from "@/lib/session";
import { flatten, map } from "lodash";
import { AccessType, Exam } from "@/interfaces/exam";
import { MODULE_ARRAY } from "@/utils/moduleUtils";
import { requestUser } from "../../../utils/api";
import { mapBy } from "../../../utils";
const db = client.db(process.env.MONGODB_DB);
@@ -14,17 +16,37 @@ export default withIronSessionApiRoute(handler, sessionOptions);
async function handler(req: NextApiRequest, res: NextApiResponse) {
if (req.method === "GET") return await GET(req, res);
res.status(404).json({ok: false});
res.status(404).json({ ok: false });
}
async function GET(req: NextApiRequest, res: NextApiResponse) {
if (!req.session.user) {
res.status(401).json({ok: false});
res.status(401).json({ ok: false });
return;
}
const user = await requestUser(req, res)
if (!user)
return res.status(401).json({ ok: false, reason: "You must be logged in!" })
const isAdmin = ["admin", "developer"].includes(user.type)
const { entities = [] } = req.query as { access?: AccessType, entities?: string[] | string };
let entitiesToFetch = Array.isArray(entities) ? entities : entities ? [entities] : []
if (!isAdmin) {
const userEntitiesIDs = mapBy(user.entities || [], 'id')
entitiesToFetch = entities ? entitiesToFetch.filter((entity): entity is string => entity ? userEntitiesIDs.includes(entity) : false) : userEntitiesIDs
if ((entitiesToFetch.length ?? 0) === 0) {
res.status(200).json([])
return
}
}
const moduleExamsPromises = MODULE_ARRAY.map(async (module) => {
const snapshot = await db.collection(module).find<Exam>({ isDiagnostic: false }).toArray();
const snapshot = await db.collection(module).find<Exam>({
isDiagnostic: false, ...(isAdmin && (entitiesToFetch.length ?? 0) === 0 ? {
} : {
entity: { $in: entitiesToFetch }
})
}).toArray();
return snapshot.map((doc) => ({
...doc,

1
src/pages/assignments/creator/[id].tsx
View File

@@ -33,7 +33,6 @@ import moment from "moment";
import Head from "next/head";
import Link from "next/link";
import { useRouter } from "next/router";
import { generate } from "random-words";
import { useEffect, useMemo, useState } from "react";
import ReactDatePicker from "react-datepicker";
import {

34
src/pages/classrooms/[id].tsx
View File

@@ -159,6 +159,21 @@ export default function Home({ user, group, users, entity }: Props) {
prev.includes(u.id) ? prev.filter((p) => p !== u.id) : [...prev, u.id]
);
const toggleAllUsersInList = () =>
setSelectedUsers((prev) =>
prev.length === rows.length
? []
: [
...prev,
...items.reduce((acc, i) => {
if (!prev.find((item) => item === i.id)) {
(acc as string[]).push(i.id);
}
return acc;
}, [] as string[]),
]
);
const removeParticipants = () => {
if (selectedUsers.length === 0) return;
if (!canRemoveParticipants) return;
@@ -428,6 +443,25 @@ export default function Home({ user, group, users, entity }: Props) {
{capitalize(type)}
</button>
))}
<button
onClick={() => {
toggleAllUsersInList();
}}
disabled={rows.length === 0}
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",
"disabled:grayscale disabled:hover:bg-mti-purple-ultralight disabled:hover:text-mti-purple disabled:cursor-not-allowed",
(isAdding ? nonParticipantUsers : group.participants)
.length === selectedUsers.length &&
"!bg-mti-purple-light !text-white"
)}
>
{"De/Select All"}
</button>
<span className="opacity-80">
{selectedUsers.length} selected
</span>
</div>
</section>

2
src/pages/settings.tsx
View File

@@ -10,7 +10,7 @@ import BatchCodeGenerator from "./(admin)/BatchCodeGenerator";
import {shouldRedirectHome} from "@/utils/navigation.disabled";
import BatchCreateUser from "./(admin)/Lists/BatchCreateUser";
import {checkAccess, getTypesOfUser} from "@/utils/permissions";
import {useEffect, useState} from "react";
import { useState} from "react";
import Modal from "@/components/Modal";
import IconCard from "@/components/IconCard";
import {BsCode, BsCodeSquare, BsGearFill, BsPeopleFill, BsPersonFill} from "react-icons/bs";

2
src/resources/entityPermissions.ts
View File

@@ -71,7 +71,7 @@ export type RolePermission =
| "view_workflows"
| "configure_workflows"
| "edit_workflow"
| "delete_workflow";
| "delete_workflow" | "view_confidential_exams";
export const DEFAULT_PERMISSIONS: RolePermission[] = [
"view_students",

2
src/stores/examEditor/defaults.ts
View File

@@ -158,7 +158,7 @@ const defaultModuleSettings = (module: Module, minTimer: number, reset: boolean
examLabel: defaultExamLabel(module),
minTimer,
difficulty: [sample(["A1", "A2", "B1", "B2", "C1", "C2"] as Difficulty[])!],
isPrivate: true,
access: "private",
sectionLabels: sectionLabels(module),
expandedSections: [(reset && (module === "writing" || module === "speaking")) ? 0 : 1],
focusedSection: 1,

3
src/stores/examEditor/reducers/index.ts
View File

@@ -6,6 +6,7 @@ import { SECTION_ACTIONS, SectionActions, sectionReducer } from "./sectionReduce
import { Module } from "@/interfaces";
import { updateExamWithUserSolutions } from "@/stores/exam/utils";
import { defaultExamUserSolutions } from "@/utils/exams";
import { access } from "fs";
type RootActions = { type: 'FULL_RESET' } |
{ type: 'INIT_EXAM_EDIT', payload: { exam: Exam; examModule: Module; id: string } } |
@@ -121,7 +122,7 @@ export const rootReducer = (
...defaultModuleSettings(examModule, exam.minTimer),
examLabel: exam.label,
difficulty: exam.difficulty,
isPrivate: exam.private,
access: exam.access,
sections: examState,
importModule: false,
sectionLabels:

12
src/stores/examEditor/types.ts
View File

@@ -1,4 +1,4 @@
import { Difficulty, InteractiveSpeakingExercise, LevelPart, ListeningPart, ReadingPart, Script, SpeakingExercise, WritingExercise } from "@/interfaces/exam";
import { AccessType, Difficulty, InteractiveSpeakingExercise, LevelPart, ListeningPart, ReadingPart, Script, SpeakingExercise, WritingExercise } from "@/interfaces/exam";
import { Module } from "@/interfaces";
import Option from "@/interfaces/option";
@@ -87,7 +87,7 @@ export interface LevelSectionSettings extends SectionSettings {
export type Context = "passage" | "video" | "audio" | "listeningScript" | "speakingScript" | "writing";
export type Generating = Context | "exercises" | string | undefined;
export type LevelGenResults = {generating: string, result: Record<string, any>[], module: Module};
export type LevelGenResults = { generating: string, result: Record<string, any>[], module: Module };
export type Section = LevelPart | ReadingPart | ListeningPart | WritingExercise | SpeakingExercise | InteractiveSpeakingExercise;
export type ExamPart = ListeningPart | ReadingPart | LevelPart;
@@ -97,10 +97,10 @@ export interface SectionState {
state: Section;
expandedSubSections: number[];
generating: Generating;
genResult: {generating: string, result: Record<string, any>[], module: Module} | undefined;
genResult: { generating: string, result: Record<string, any>[], module: Module } | undefined;
levelGenerating: Generating[];
levelGenResults: LevelGenResults[];
focusedExercise?: {questionId: number; id: string} | undefined;
focusedExercise?: { questionId: number; id: string } | undefined;
writingSection?: number;
speakingSection?: number;
readingSection?: number;
@@ -126,8 +126,8 @@ export interface ModuleState {
sections: SectionState[];
minTimer: number;
difficulty: Difficulty[];
isPrivate: boolean;
sectionLabels: {id: number; label: string;}[];
access: AccessType;
sectionLabels: { id: number; label: string; }[];
expandedSections: number[];
focusedSection: number;
importModule: boolean;

3
src/utils/exams.be.ts
View File

@@ -64,6 +64,7 @@ export const getExams = async (
.collection(module)
.find<Exam>({
isDiagnostic: false,
access: "public",
})
.toArray();
@@ -72,7 +73,7 @@ export const getExams = async (
...doc,
module,
})) as Exam[],
).filter((x) => !x.private);
)
let exams: Exam[] = await filterByEntities(shuffledPublicExams, userId);
exams = filterByVariant(exams, variant);

6
src/utils/moduleUtils.ts
View File

@@ -23,7 +23,7 @@ export const sortByModuleName = (a: string, b: string) => {
};
export const countExercises = (exercises: Exercise[]) => {
const lengthMap = exercises.map((e) => {
const lengthMap = (exercises ?? []).map((e) => {
if (e.type === "multipleChoice") return e.questions.length;
if (e.type === "interactiveSpeaking") return e.prompts.length;
if (e.type === "fillBlanks") return e.solutions.length;
@@ -40,7 +40,7 @@ export const countCurrentExercises = (
exercises: Exercise[],
exerciseIndex: number,
questionIndex?: number
) => {
) => {
return exercises.reduce((acc, exercise, index) => {
if (index > exerciseIndex) {
return acc;
@@ -70,7 +70,7 @@ export const countCurrentExercises = (
return acc + count;
}, 0);
};
};
export const countFullExams = (stats: Stat[]) => {
const sessionExams = groupBySession(stats);

1
src/utils/permissions.ts
View File

@@ -2,7 +2,6 @@ import { EntityWithRoles, Role } from "@/interfaces/entity";
import { PermissionType } from "@/interfaces/permissions";
import { User, Type, userTypes } from "@/interfaces/user";
import { RolePermission } from "@/resources/entityPermissions";
import axios from "axios";
import { findBy, mapBy } from ".";
import { isAdmin } from "./users";

52
src/utils/users.ts
View File

@@ -1,8 +1,9 @@
import {WithLabeledEntities} from "@/interfaces/entity";
import {User} from "@/interfaces/user";
import {USER_TYPE_LABELS} from "@/resources/user";
import {capitalize} from "lodash";
import { WithLabeledEntities } from "@/interfaces/entity";
import { User } from "@/interfaces/user";
import { USER_TYPE_LABELS } from "@/resources/user";
import { capitalize } from "lodash";
import moment from "moment";
import ExcelJS from "exceljs";
export interface UserListRow {
name: string;
@@ -17,6 +18,22 @@ export interface UserListRow {
gender: string;
}
const indexToLetter = (index: number): string => {
// Base case: if the index is less than 0, return an empty string
if (index < 0) {
return '';
}
// Calculate the quotient for recursion (number of times the letter sequence repeats)
const quotient = Math.floor(index / 26);
// Calculate the remainder for the current letter
const remainder = index % 26;
// Recursively call indexToLetter for the quotient and append the current letter
return indexToLetter(quotient - 1) + String.fromCharCode(65 + remainder);
};
export const exportListToExcel = (rowUsers: WithLabeledEntities<User>[]) => {
const rows: UserListRow[] = rowUsers.map((user) => ({
name: user.name,
@@ -33,10 +50,31 @@ export const exportListToExcel = (rowUsers: WithLabeledEntities<User>[]) => {
gender: user.demographicInformation?.gender ? capitalize(user.demographicInformation.gender) : "N/A",
verified: user.isVerified?.toString() || "FALSE",
}));
const header = "Name,Email,Type,Entities,Expiry Date,Country,Phone,Employment/Department,Gender,Verification";
const rowsString = rows.map((x) => Object.values(x).join(",")).join("\n");
const workbook = new ExcelJS.Workbook();
const worksheet = workbook.addWorksheet("User Data");
const border: Partial<ExcelJS.Borders> = { top: { style: 'thin' as ExcelJS.BorderStyle }, left: { style: 'thin' as ExcelJS.BorderStyle }, bottom: { style: 'thin' as ExcelJS.BorderStyle }, right: { style: 'thin' as ExcelJS.BorderStyle } }
const header = ['Name', 'Email', 'Type', 'Entities', 'Expiry Date', 'Country', 'Phone', 'Employment/Department', 'Gender', 'Verification'].forEach((item, index) => {
const cell = worksheet.getCell(`${indexToLetter(index)}1`);
const column = worksheet.getColumn(index + 1);
column.width = item.length * 2;
cell.value = item;
cell.font = { bold: true, size: 16 };
cell.border = border;
return `${header}\n${rowsString}`;
});
rows.forEach((x, index) => {
(Object.keys(x) as (keyof UserListRow)[]).forEach((key, i) => {
const cell = worksheet.getCell(`${indexToLetter(i)}${index + 2}`);
cell.value = x[key];
if (index === 0) {
const column = worksheet.getColumn(i + 1);
column.width = Math.max(column.width ?? 0, x[key].toString().length * 2);
}
cell.border = border;
});
})
return workbook.xlsx.writeBuffer();
};
export const getUserName = (user?: User) => {