Compare commits

..

24 Commits

Author SHA1 Message Date
Tiago Ribeiro
fec3b51553 Created two new permissions 2025-02-17 10:32:57 +00:00
João Correia
d8386bdd8e Merged in approval-workflows (pull request #152)
Approval workflows

Approved-by: Tiago Ribeiro
2025-02-11 12:09:17 +00:00
Joao Correia
df2f83e496 make access confidential when user submits exam with approval process. make access private upon approval workflow completed. 2025-02-10 13:25:11 +00:00
Joao Correia
e214d8b598 improve edited exam changes again 2025-02-10 11:30:24 +00:00
Joao Correia
c14f16c97a improve edited exam changes printing format 2025-02-09 21:12:29 +00:00
Joao Correia
ca2cf739ee improve edited exam changes printing format 2025-02-09 20:56:55 +00:00
João Correia
d432fb4bc4 Merged in approval-workflows (pull request #151)
Approval workflows

Approved-by: Tiago Ribeiro
2025-02-09 18:44:44 +00:00
Joao Correia
d5bffc9bad Add pagination to approval workflows table and change module styling to match project colors. 2025-02-09 18:10:59 +00:00
Joao Correia
75b4643918 Add button to submit exam without approval process 2025-02-09 17:37:19 +00:00
Joao Correia
9ae6b8e894 make sure admin id is passed to step component if the admin is not assigned to the workflow but approved a step. 2025-02-09 16:55:50 +00:00
Joao Correia
6f6c5a4209 make first step approved by default 2025-02-09 15:44:37 +00:00
Tiago Ribeiro
769b1b39d3 Added the permission 2025-02-09 11:35:52 +00:00
Francisco Lima
4bb12c7f01 Merged in addedAccess-bugfixes (pull request #150)
AddedAccess bugfixes

Approved-by: Tiago Ribeiro
2025-02-09 11:16:24 +00:00
Francisco Lima
a80a342ae2 Merged develop into addedAccess-bugfixes 2025-02-09 04:32:42 +00:00
José Lima
e5e60fcce9 fixed some issues related to build 2025-02-09 04:29:32 +00:00
José Lima
b175d8797e added access variable to exams soo we can distinguish private, public and confidential exams and also bugfixes and improvements 2025-02-09 04:28:34 +00:00
João Correia
f06349e350 Merged in approval-workflows (pull request #149)
filter workflows user can see based on entities

Approved-by: Tiago Ribeiro
2025-02-08 19:35:46 +00:00
Tiago Ribeiro
34caf9986c Merged develop into approval-workflows 2025-02-08 19:35:31 +00:00
Joao Correia
3a3d3d014d filter workflows user can see based on entities 2025-02-08 19:23:42 +00:00
João Correia
c49c303f20 Merged in approval-workflows (pull request #148)
temporary fix for same exam instance being used for all entities and implement approval process skip edge cases

Approved-by: Tiago Ribeiro
2025-02-08 18:03:43 +00:00
Joao Correia
cbe353c2c5 - start only one of the configured workflows (randomly at the moment) for the exam Author.
- skip approval process for admins
2025-02-08 15:26:16 +00:00
Tiago Ribeiro
991adede96 Merged in develop (pull request #147)
Develop
2025-02-07 17:54:57 +00:00
Tiago Ribeiro
f95bce6fa2 Did some fixes related to master corporates 2025-02-07 16:19:47 +00:00
João Correia
1dd6cead9e Merged in workflow-permissions (pull request #146)
Workflow permissions

Approved-by: Tiago Ribeiro
2025-02-07 15:43:34 +00:00
43 changed files with 2241 additions and 1726 deletions

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

View File

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

View File

@@ -19,7 +19,7 @@ interface SettingsEditorProps {
children?: ReactNode; children?: ReactNode;
canPreview: boolean; canPreview: boolean;
canSubmit: boolean; canSubmit: boolean;
submitModule: () => void; submitModule: (requiresApproval: boolean) => void;
preview: () => void; preview: () => void;
} }
@@ -148,18 +148,33 @@ const SettingsEditor: React.FC<SettingsEditorProps> = ({
</div> </div>
</Dropdown> </Dropdown>
{children} {children}
<div className="flex flex-row justify-between mt-4"> <div className="flex flex-col gap-3 mt-4">
<button <button
className={clsx( className={clsx(
"flex items-center justify-center px-4 py-2 text-white rounded-xl transition-colors duration-300", "flex items-center justify-center px-4 py-2 text-white rounded-xl transition-colors duration-300",
`bg-ielts-${module}/70 border border-ielts-${module} hover:bg-ielts-${module} disabled:bg-ielts-${module}/30`, `bg-ielts-${module}/70 border border-ielts-${module} hover:bg-ielts-${module} disabled:bg-ielts-${module}/30`,
"disabled:cursor-not-allowed disabled:text-gray-200" "disabled:cursor-not-allowed disabled:text-gray-200"
)} )}
onClick={submitModule} onClick={() => submitModule(true)}
disabled={!canSubmit} disabled={!canSubmit}
> >
<FaFileUpload className="mr-2" size={18} /> <FaFileUpload className="mr-2" size={18} />
Submit Module as Exam Submit module as exam for approval
</button>
<button
className={clsx(
"flex items-center justify-center px-4 py-2 text-white rounded-xl transition-colors duration-300",
`bg-ielts-${module}/70 border border-ielts-${module} hover:bg-ielts-${module} disabled:bg-ielts-${module}/30`,
"disabled:cursor-not-allowed disabled:text-gray-200"
)}
onClick={() => {
if (!confirm(`Are you sure you want to skip the approval process for this exam?`)) return;
submitModule(false);
}}
disabled={!canSubmit}
>
<FaFileUpload className="mr-2" size={18} />
Submit module as exam and skip approval process
</button> </button>
<button <button
className={clsx( className={clsx(
@@ -171,7 +186,7 @@ const SettingsEditor: React.FC<SettingsEditorProps> = ({
disabled={!canPreview} disabled={!canPreview}
> >
<FaEye className="mr-2" size={18} /> <FaEye className="mr-2" size={18} />
Preview Module Preview module
</button> </button>
</div> </div>
</div> </div>

View File

@@ -38,7 +38,7 @@ const LevelSettings: React.FC = () => {
difficulty, difficulty,
sections, sections,
minTimer, minTimer,
isPrivate, access,
} = useExamEditorStore(state => state.modules[currentModule]); } = useExamEditorStore(state => state.modules[currentModule]);
const { localSettings, updateLocalAndScheduleGlobal } = useSettingsState<LevelSectionSettings>( const { localSettings, updateLocalAndScheduleGlobal } = useSettingsState<LevelSectionSettings>(
@@ -76,7 +76,7 @@ const LevelSettings: React.FC = () => {
}); });
}); });
const submitLevel = async () => { const submitLevel = async (requiresApproval: boolean) => {
if (title === "") { if (title === "") {
toast.error("Enter a title for the exam!"); toast.error("Enter a title for the exam!");
return; return;
@@ -195,12 +195,13 @@ const LevelSettings: React.FC = () => {
category: s.settings.category category: s.settings.category
}; };
}).filter(part => part.exercises.length > 0), }).filter(part => part.exercises.length > 0),
isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed. requiresApproval: requiresApproval,
isDiagnostic: false,
minTimer, minTimer,
module: "level", module: "level",
id: title, id: title,
difficulty, difficulty,
private: isPrivate, access,
}; };
const result = await axios.post('/api/exam/level', exam); const result = await axios.post('/api/exam/level', exam);
@@ -243,7 +244,7 @@ const LevelSettings: React.FC = () => {
isDiagnostic: false, isDiagnostic: false,
variant: undefined, variant: undefined,
difficulty, difficulty,
private: isPrivate, access,
} as LevelExam); } as LevelExam);
setExerciseIndex(0); setExerciseIndex(0);
setQuestionIndex(0); setQuestionIndex(0);

View File

@@ -27,7 +27,7 @@ const ListeningSettings: React.FC = () => {
difficulty, difficulty,
sections, sections,
minTimer, minTimer,
isPrivate, access,
instructionsState instructionsState
} = useExamEditorStore(state => state.modules[currentModule]); } = useExamEditorStore(state => state.modules[currentModule]);
@@ -65,7 +65,7 @@ const ListeningSettings: React.FC = () => {
} }
]; ];
const submitListening = async () => { const submitListening = async (requiresApproval: boolean) => {
if (title === "") { if (title === "") {
toast.error("Enter a title for the exam!"); toast.error("Enter a title for the exam!");
return; return;
@@ -138,13 +138,14 @@ const ListeningSettings: React.FC = () => {
category: s.settings.category category: s.settings.category
}; };
}), }),
isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed. requiresApproval: requiresApproval,
isDiagnostic: false,
minTimer, minTimer,
module: "listening", module: "listening",
id: title, id: title,
variant: sections.length === 4 ? "full" : "partial", variant: sections.length === 4 ? "full" : "partial",
difficulty, difficulty,
private: isPrivate, access,
instructions: instructionsURL instructions: instructionsURL
}; };
@@ -191,7 +192,7 @@ const ListeningSettings: React.FC = () => {
isDiagnostic: false, isDiagnostic: false,
variant: sections.length === 4 ? "full" : "partial", variant: sections.length === 4 ? "full" : "partial",
difficulty, difficulty,
private: isPrivate, access,
instructions: instructionsState.currentInstructionsURL instructions: instructionsState.currentInstructionsURL
} as ListeningExam); } as ListeningExam);
setExerciseIndex(0); setExerciseIndex(0);

View File

@@ -15,135 +15,138 @@ import ReadingComponents from "./components";
import { getExamById } from "@/utils/exams"; import { getExamById } from "@/utils/exams";
const ReadingSettings: React.FC = () => { const ReadingSettings: React.FC = () => {
const router = useRouter(); const router = useRouter();
const { const {
setExam, setExam,
setExerciseIndex, setExerciseIndex,
setPartIndex, setPartIndex,
setQuestionIndex, setQuestionIndex,
setBgColor, setBgColor,
} = usePersistentExamStore(); } = usePersistentExamStore();
const { currentModule, title } = useExamEditorStore(); const { currentModule, title } = useExamEditorStore();
const { const { focusedSection, difficulty, sections, minTimer, access, type } =
focusedSection, useExamEditorStore((state) => state.modules[currentModule]);
difficulty,
sections,
minTimer,
isPrivate,
type,
} = useExamEditorStore(state => state.modules[currentModule]);
const { localSettings, updateLocalAndScheduleGlobal } = useSettingsState<ReadingSectionSettings>( const { localSettings, updateLocalAndScheduleGlobal } =
currentModule, useSettingsState<ReadingSectionSettings>(currentModule, focusedSection);
focusedSection
);
const currentSection = sections.find((section) => section.sectionId == focusedSection)?.state as ReadingPart; 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.",
},
{
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.",
},
{
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.",
},
];
const defaultPresets: Option[] = [ const canPreviewOrSubmit = sections.some(
{ (s) =>
label: "Preset: Reading Passage 1", (s.state as ReadingPart).exercises &&
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." (s.state as ReadingPart).exercises.length > 0
}, );
{
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."
},
{
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."
}
];
const canPreviewOrSubmit = sections.some( const submitReading = (requiresApproval: boolean) => {
(s) => (s.state as ReadingPart).exercises && (s.state as ReadingPart).exercises.length > 0 if (title === "") {
); toast.error("Enter a title for the exam!");
return;
const submitReading = () => { }
if (title === "") { const exam: ReadingExam = {
toast.error("Enter a title for the exam!"); parts: sections.map((s) => {
return; const exercise = s.state as ReadingPart;
} return {
const exam: ReadingExam = { ...exercise,
parts: sections.map((s) => { intro: localSettings.currentIntro,
const exercise = s.state as ReadingPart; category: localSettings.category,
return {
...exercise,
intro: localSettings.currentIntro,
category: localSettings.category
};
}),
isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed.
minTimer,
module: "reading",
id: title,
variant: sections.length === 3 ? "full" : "partial",
difficulty,
private: isPrivate,
type: type!
}; };
}),
requiresApproval: requiresApproval,
isDiagnostic: false,
minTimer,
module: "reading",
id: title,
variant: sections.length === 3 ? "full" : "partial",
difficulty,
access,
type: type!,
};
axios.post(`/api/exam/reading`, exam) axios
.then((result) => { .post(`/api/exam/reading`, exam)
playSound("sent"); .then((result) => {
// Successfully submitted exam playSound("sent");
if (result.status === 200) { // Successfully submitted exam
toast.success(result.data.message); if (result.status === 200) {
} else if (result.status === 207) { toast.success(result.data.message);
toast.warning(result.data.message); } else if (result.status === 207) {
} toast.warning(result.data.message);
}) }
.catch((error) => { })
console.log(error); .catch((error) => {
toast.error(error.response.data.error || "Something went wrong while submitting, please try again later."); console.log(error);
}) toast.error(
} error.response.data.error ||
"Something went wrong while submitting, please try again later."
);
});
};
const preview = () => { const preview = () => {
setExam({ setExam({
parts: sections.map((s) => { parts: sections.map((s) => {
const exercises = s.state as ReadingPart; const exercises = s.state as ReadingPart;
return { return {
...exercises, ...exercises,
intro: s.settings.currentIntro, intro: s.settings.currentIntro,
category: s.settings.category category: s.settings.category,
}; };
}), }),
minTimer, minTimer,
module: "reading", module: "reading",
id: title, id: title,
isDiagnostic: false, isDiagnostic: false,
variant: undefined, variant: undefined,
difficulty, difficulty,
private: isPrivate, access: access,
type: type! type: type!,
} as ReadingExam); } as ReadingExam);
setExerciseIndex(0); setExerciseIndex(0);
setQuestionIndex(0); setQuestionIndex(0);
setPartIndex(0); setPartIndex(0);
setBgColor("bg-white"); setBgColor("bg-white");
openDetachedTab("popout?type=Exam&module=reading", router) openDetachedTab("popout?type=Exam&module=reading", router);
} };
return ( return (
<SettingsEditor <SettingsEditor
sectionLabel={`Passage ${focusedSection}`} sectionLabel={`Passage ${focusedSection}`}
sectionId={focusedSection} sectionId={focusedSection}
module="reading" module="reading"
introPresets={[defaultPresets[focusedSection - 1]]} introPresets={[defaultPresets[focusedSection - 1]]}
preview={preview} preview={preview}
canPreview={canPreviewOrSubmit} canPreview={canPreviewOrSubmit}
canSubmit={canPreviewOrSubmit} canSubmit={canPreviewOrSubmit}
submitModule={submitReading} submitModule={submitReading}
> >
<ReadingComponents <ReadingComponents
{...{ localSettings, updateLocalAndScheduleGlobal, currentSection }} {...{ localSettings, updateLocalAndScheduleGlobal, currentSection }}
/> />
</SettingsEditor> </SettingsEditor>
); );
}; };
export default ReadingSettings; export default ReadingSettings;

View File

@@ -30,7 +30,7 @@ const SpeakingSettings: React.FC = () => {
} = usePersistentExamStore(); } = usePersistentExamStore();
const { title, currentModule } = useExamEditorStore(); 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; const section = sections.find((section) => section.sectionId == focusedSection)?.state;
@@ -84,7 +84,7 @@ const SpeakingSettings: React.FC = () => {
}); });
})(); })();
const submitSpeaking = async () => { const submitSpeaking = async (requiresApproval: boolean) => {
if (title === "") { if (title === "") {
toast.error("Enter a title for the exam!"); toast.error("Enter a title for the exam!");
return; return;
@@ -181,11 +181,12 @@ const SpeakingSettings: React.FC = () => {
minTimer, minTimer,
module: "speaking", module: "speaking",
id: title, id: title,
isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed. requiresApproval: requiresApproval,
isDiagnostic: false,
variant: undefined, variant: undefined,
difficulty, difficulty,
instructorGender: "varied", instructorGender: "varied",
private: isPrivate, access,
}; };
const result = await axios.post('/api/exam/speaking', exam); const result = await axios.post('/api/exam/speaking', exam);
@@ -238,7 +239,7 @@ const SpeakingSettings: React.FC = () => {
isDiagnostic: false, isDiagnostic: false,
variant: undefined, variant: undefined,
difficulty, difficulty,
private: isPrivate, access,
} as SpeakingExam); } as SpeakingExam);
setExerciseIndex(0); setExerciseIndex(0);
setQuestionIndex(0); setQuestionIndex(0);

View File

@@ -23,7 +23,7 @@ const WritingSettings: React.FC = () => {
const { const {
minTimer, minTimer,
difficulty, difficulty,
isPrivate, access,
sections, sections,
focusedSection, focusedSection,
type, type,
@@ -81,14 +81,14 @@ const WritingSettings: React.FC = () => {
isDiagnostic: false, isDiagnostic: false,
variant: undefined, variant: undefined,
difficulty, difficulty,
private: isPrivate, access,
type: type! type: type!
}); });
setExerciseIndex(0); setExerciseIndex(0);
openDetachedTab("popout?type=Exam&module=writing", router) openDetachedTab("popout?type=Exam&module=writing", router)
} }
const submitWriting = async () => { const submitWriting = async (requiresApproval: boolean) => {
if (title === "") { if (title === "") {
toast.error("Enter a title for the exam!"); toast.error("Enter a title for the exam!");
return; return;
@@ -131,10 +131,11 @@ const WritingSettings: React.FC = () => {
minTimer, minTimer,
module: "writing", module: "writing",
id: title, id: title,
isDiagnostic: true, // using isDiagnostic to keep exam hidden until the respective approval workflow is completed. requiresApproval: requiresApproval,
isDiagnostic: false,
variant: undefined, variant: undefined,
difficulty, difficulty,
private: isPrivate, access,
type: type! type: type!
}; };

View File

@@ -3,12 +3,12 @@ import SectionRenderer from "./SectionRenderer";
import Checkbox from "../Low/Checkbox"; import Checkbox from "../Low/Checkbox";
import Input from "../Low/Input"; import Input from "../Low/Input";
import Select from "../Low/Select"; import Select from "../Low/Select";
import {capitalize} from "lodash"; import { capitalize } from "lodash";
import {Difficulty} from "@/interfaces/exam"; import { AccessType, ACCESSTYPE, Difficulty } from "@/interfaces/exam";
import {useCallback, useEffect, useMemo, useState} from "react"; import { useCallback, useEffect, useState } from "react";
import {toast} from "react-toastify"; import { toast } from "react-toastify";
import {ModuleState, SectionState} from "@/stores/examEditor/types"; import { ModuleState, SectionState } from "@/stores/examEditor/types";
import {Module} from "@/interfaces"; import { Module } from "@/interfaces";
import useExamEditorStore from "@/stores/examEditor"; import useExamEditorStore from "@/stores/examEditor";
import WritingSettings from "./SettingsEditor/writing"; import WritingSettings from "./SettingsEditor/writing";
import ReadingSettings from "./SettingsEditor/reading"; import ReadingSettings from "./SettingsEditor/reading";
@@ -16,243 +16,286 @@ import LevelSettings from "./SettingsEditor/level";
import ListeningSettings from "./SettingsEditor/listening"; import ListeningSettings from "./SettingsEditor/listening";
import SpeakingSettings from "./SettingsEditor/speaking"; import SpeakingSettings from "./SettingsEditor/speaking";
import ImportOrStartFromScratch from "./ImportExam/ImportOrFromScratch"; import ImportOrStartFromScratch from "./ImportExam/ImportOrFromScratch";
import {defaultSectionSettings} from "@/stores/examEditor/defaults"; import { defaultSectionSettings } from "@/stores/examEditor/defaults";
import Button from "../Low/Button"; import Button from "../Low/Button";
import ResetModule from "./Standalone/ResetModule"; import ResetModule from "./Standalone/ResetModule";
import ListeningInstructions from "./Standalone/ListeningInstructions"; 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 DIFFICULTIES: Difficulty[] = ["A1", "A2", "B1", "B2", "C1", "C2"];
const ExamEditor: React.FC<{levelParts?: number; entitiesAllowEditPrivacy: EntityWithRoles[]}> = ({ const ExamEditor: React.FC<{
levelParts = 0, levelParts?: number;
entitiesAllowEditPrivacy = [], entitiesAllowEditPrivacy: EntityWithRoles[];
}) => { }> = ({ levelParts = 0, entitiesAllowEditPrivacy = [] }) => {
const {currentModule, dispatch} = useExamEditorStore(); const { currentModule, dispatch } = useExamEditorStore();
const {sections, minTimer, expandedSections, examLabel, isPrivate, difficulty, sectionLabels, importModule} = useExamEditorStore( const {
(state) => state.modules[currentModule], 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(
const [isResetModuleOpen, setIsResetModuleOpen] = useState(false); levelParts !== 0 ? levelParts : 1
);
const [isResetModuleOpen, setIsResetModuleOpen] = useState(false);
// For exam edits // For exam edits
useEffect(() => { useEffect(() => {
if (levelParts !== 0) { if (levelParts !== 0) {
setNumberOfLevelParts(levelParts); setNumberOfLevelParts(levelParts);
dispatch({ dispatch({
type: "UPDATE_MODULE", type: "UPDATE_MODULE",
payload: { payload: {
updates: { updates: {
sectionLabels: Array.from({length: levelParts}).map((_, i) => ({ sectionLabels: Array.from({ length: levelParts }).map((_, i) => ({
id: i + 1, id: i + 1,
label: `Part ${i + 1}`, label: `Part ${i + 1}`,
})), })),
}, },
module: "level", module: "level",
}, },
}); });
} }
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [levelParts]); }, [levelParts]);
useEffect(() => { useEffect(() => {
const currentSections = sections; const currentSections = sections;
const currentLabels = sectionLabels; const currentLabels = sectionLabels;
let updatedSections: SectionState[]; let updatedSections: SectionState[];
let updatedLabels: any; let updatedLabels: any;
if ((currentModule === "level" && currentSections.length !== currentLabels.length) || numberOfLevelParts !== currentSections.length) { if (
const newSections = [...currentSections]; (currentModule === "level" &&
const newLabels = [...currentLabels]; currentSections.length !== currentLabels.length) ||
for (let i = currentLabels.length; i < numberOfLevelParts; i++) { numberOfLevelParts !== currentSections.length
if (currentSections.length !== numberOfLevelParts) newSections.push(defaultSectionSettings(currentModule, i + 1)); ) {
newLabels.push({ const newSections = [...currentSections];
id: i + 1, const newLabels = [...currentLabels];
label: `Part ${i + 1}`, for (let i = currentLabels.length; i < numberOfLevelParts; i++) {
}); if (currentSections.length !== numberOfLevelParts)
} newSections.push(defaultSectionSettings(currentModule, i + 1));
updatedSections = newSections; newLabels.push({
updatedLabels = newLabels; id: i + 1,
} else if (numberOfLevelParts < currentSections.length) { label: `Part ${i + 1}`,
updatedSections = currentSections.slice(0, numberOfLevelParts); });
updatedLabels = currentLabels.slice(0, numberOfLevelParts); }
} else { updatedSections = newSections;
return; updatedLabels = newLabels;
} } else if (numberOfLevelParts < currentSections.length) {
updatedSections = currentSections.slice(0, numberOfLevelParts);
updatedLabels = currentLabels.slice(0, numberOfLevelParts);
} else {
return;
}
const updatedExpandedSections = expandedSections.filter((sectionId) => updatedSections.some((section) => section.sectionId === sectionId)); const updatedExpandedSections = expandedSections.filter((sectionId) =>
updatedSections.some((section) => section.sectionId === sectionId)
);
dispatch({ dispatch({
type: "UPDATE_MODULE", type: "UPDATE_MODULE",
payload: { payload: {
updates: { updates: {
sections: updatedSections, sections: updatedSections,
sectionLabels: updatedLabels, sectionLabels: updatedLabels,
expandedSections: updatedExpandedSections, expandedSections: updatedExpandedSections,
}, },
}, },
}); });
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [numberOfLevelParts]); }, [numberOfLevelParts]);
const sectionIds = sections.map((section) => section.sectionId); const sectionIds = sections.map((section) => section.sectionId);
const updateModule = useCallback( const updateModule = useCallback(
(updates: Partial<ModuleState>) => { (updates: Partial<ModuleState>) => {
dispatch({type: "UPDATE_MODULE", payload: {updates}}); dispatch({ type: "UPDATE_MODULE", payload: { updates } });
}, },
[dispatch], [dispatch]
); );
const toggleSection = (sectionId: number) => { const toggleSection = (sectionId: number) => {
if (expandedSections.length === 1 && sectionIds.includes(sectionId)) { if (expandedSections.length === 1 && sectionIds.includes(sectionId)) {
toast.error("Include at least one section!"); toast.error("Include at least one section!");
return; return;
} }
dispatch({type: "TOGGLE_SECTION", payload: {sectionId}}); dispatch({ type: "TOGGLE_SECTION", payload: { sectionId } });
}; };
const ModuleSettings: Record<Module, React.ComponentType> = { const ModuleSettings: Record<Module, React.ComponentType> = {
reading: ReadingSettings, reading: ReadingSettings,
writing: WritingSettings, writing: WritingSettings,
speaking: SpeakingSettings, speaking: SpeakingSettings,
listening: ListeningSettings, listening: ListeningSettings,
level: LevelSettings, level: LevelSettings,
}; };
const Settings = ModuleSettings[currentModule]; const Settings = ModuleSettings[currentModule];
const showImport = importModule && ["reading", "listening", "level"].includes(currentModule); const showImport =
importModule && ["reading", "listening", "level"].includes(currentModule);
const updateLevelParts = (parts: number) => { const updateLevelParts = (parts: number) => {
setNumberOfLevelParts(parts); setNumberOfLevelParts(parts);
}; };
return ( return (
<> <>
{showImport ? ( {showImport ? (
<ImportOrStartFromScratch module={currentModule} setNumberOfLevelParts={updateLevelParts} /> <ImportOrStartFromScratch
) : ( module={currentModule}
<> setNumberOfLevelParts={updateLevelParts}
{isResetModuleOpen && ( />
<ResetModule ) : (
module={currentModule} <>
isOpen={isResetModuleOpen} {isResetModuleOpen && (
setIsOpen={setIsResetModuleOpen} <ResetModule
setNumberOfLevelParts={setNumberOfLevelParts} module={currentModule}
/> isOpen={isResetModuleOpen}
)} setIsOpen={setIsResetModuleOpen}
<div className="flex gap-4 w-full items-center -xl:flex-col"> setNumberOfLevelParts={setNumberOfLevelParts}
<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> <div className="flex gap-4 w-full items-center -xl:flex-col">
<Input <div className="flex flex-row gap-3 w-full">
type="number" <div className="flex flex-col gap-3">
name="minTimer" <label className="font-normal text-base text-mti-gray-dim">
onChange={(e) => Timer
updateModule({ </label>
minTimer: parseInt(e) < 15 ? 15 : parseInt(e), <Input
}) type="number"
} name="minTimer"
value={minTimer} onChange={(e) =>
className="max-w-[300px]" updateModule({
/> minTimer: parseInt(e) < 15 ? 15 : parseInt(e),
</div> })
<div className="flex flex-col gap-3 flex-grow"> }
<label className="font-normal text-base text-mti-gray-dim">Difficulty</label> value={minTimer}
<Select className="max-w-[300px]"
isMulti={true} />
options={DIFFICULTIES.map((x) => ({ </div>
value: x, <div className="flex flex-col gap-3 flex-grow">
label: capitalize(x), <label className="font-normal text-base text-mti-gray-dim">
}))} Difficulty
onChange={(values) => { </label>
const selectedDifficulties = values ? values.map((v) => v.value as Difficulty) : []; <Select
updateModule({difficulty: selectedDifficulties}); isMulti={true}
}} options={DIFFICULTIES.map((x) => ({
value={ value: x,
difficulty label: capitalize(x),
? difficulty.map((d) => ({ }))}
value: d, onChange={(values) => {
label: capitalize(d), const selectedDifficulties = values
})) ? values.map((v) => v.value as Difficulty)
: null : [];
} updateModule({ difficulty: selectedDifficulties });
/> }}
</div> value={
</div> difficulty
{sectionLabels.length != 0 && currentModule !== "level" ? ( ? (Array.isArray(difficulty)
<div className="flex flex-col gap-3 -xl:w-full"> ? difficulty
<label className="font-normal text-base text-mti-gray-dim">{sectionLabels[0].label.split(" ")[0]}</label> : [difficulty]
<div className="flex flex-row gap-8"> ).map((d) => ({
{sectionLabels.map(({id, label}) => ( value: d,
<span label: capitalize(d),
key={id} }))
className={clsx( : null
"px-6 py-4 w-48 h-[72px] flex justify-center items-center text-sm font-normal rounded-full border focus:outline-none cursor-pointer", }
"transition duration-300 ease-in-out", />
sectionIds.includes(id) </div>
? `bg-ielts-${currentModule}/70 border-ielts-${currentModule} text-white` </div>
: "bg-white border-mti-gray-platinum", {sectionLabels.length != 0 && currentModule !== "level" ? (
)} <div className="flex flex-col gap-3 -xl:w-full">
onClick={() => toggleSection(id)}> <label className="font-normal text-base text-mti-gray-dim">
{label} {sectionLabels[0].label.split(" ")[0]}
</span> </label>
))} <div className="flex flex-row gap-8">
</div> {sectionLabels.map(({ id, label }) => (
</div> <span
) : ( key={id}
<div className="flex flex-col gap-3 w-1/3"> className={clsx(
<label className="font-normal text-base text-mti-gray-dim">Number of Parts</label> "px-6 py-4 w-48 h-[72px] flex justify-center items-center text-sm font-normal rounded-full border focus:outline-none cursor-pointer",
<Input "transition duration-300 ease-in-out",
type="number" sectionIds.includes(id)
name="Number of Parts" ? `bg-ielts-${currentModule}/70 border-ielts-${currentModule} text-white`
min={1} : "bg-white border-mti-gray-platinum"
onChange={(v) => setNumberOfLevelParts(parseInt(v))} )}
value={numberOfLevelParts} onClick={() => toggleSection(id)}
/> >
</div> {label}
)} </span>
<div className="flex flex-col gap-3 w-fit h-fit"> ))}
<div className="h-6" /> </div>
<Checkbox </div>
isChecked={isPrivate} ) : (
onChange={(checked) => updateModule({isPrivate: checked})} <div className="flex flex-col gap-3 w-1/3">
disabled={entitiesAllowEditPrivacy.length === 0}> <label className="font-normal text-base text-mti-gray-dim">
Privacy (Only available for Assignments) Number of Parts
</Checkbox> </label>
</div> <Input
</div> type="number"
<div className="flex flex-row gap-3 w-full"> name="Number of Parts"
<div className="flex flex-col gap-3 flex-grow"> min={1}
<label className="font-normal text-base text-mti-gray-dim">Exam Label *</label> onChange={(v) => setNumberOfLevelParts(parseInt(v))}
<Input value={numberOfLevelParts}
type="text" />
placeholder="Exam Label" </div>
name="label" )}
onChange={(text) => updateModule({examLabel: text})} </div>
roundness="xl" <div className="flex flex-row gap-3 w-64">
value={examLabel} <Select
required label="Access Type"
/> options={ACCESSTYPE.map((item) => ({
</div> value: item,
{currentModule === "listening" && <ListeningInstructions />} label: capitalize(item),
<Button }))}
onClick={() => setIsResetModuleOpen(true)} onChange={(value) => {
customColor={`bg-ielts-${currentModule}/70 hover:bg-ielts-${currentModule} border-ielts-${currentModule}`} if (value?.value) {
className={`text-white self-end`}> updateModule({ access: value.value! as AccessType });
Reset Module }
</Button> }}
</div> value={{ value: access, label: capitalize(access) }}
<div className="flex flex-row gap-8 -2xl:flex-col"> />
<Settings /> </div>
<div className="flex-grow max-w-[66%] -2xl:max-w-full"> <div className="flex flex-row gap-3 w-full">
<SectionRenderer /> <div className="flex flex-col gap-3 flex-grow">
</div> <label className="font-normal text-base text-mti-gray-dim">
</div> Exam Label *
</> </label>
)} <Input
</> type="text"
); placeholder="Exam Label"
name="label"
onChange={(text) => updateModule({ examLabel: text })}
roundness="xl"
value={examLabel}
required
/>
</div>
{currentModule === "listening" && <ListeningInstructions />}
<Button
onClick={() => setIsResetModuleOpen(true)}
customColor={`bg-ielts-${currentModule}/70 hover:bg-ielts-${currentModule} border-ielts-${currentModule}`}
className={`text-white self-end`}
>
Reset Module
</Button>
</div>
<div className="flex flex-row gap-8 -2xl:flex-col">
<Settings />
<div className="flex-grow max-w-[66%] -2xl:max-w-full">
<SectionRenderer />
</div>
</div>
</>
)}
</>
);
}; };
export default ExamEditor; export default ExamEditor;

View File

@@ -149,10 +149,16 @@ export default function Table<T>({
))} ))}
</tbody> </tbody>
</table> </table>
{isLoading && ( {isLoading ? (
<div className="min-h-screen flex justify-center items-start"> <div className="min-h-screen flex justify-center items-start">
<span className="loading loading-infinity w-32" /> <span className="loading loading-infinity w-32" />
</div> </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> </div>
); );

View File

@@ -2,7 +2,7 @@ import { ApprovalWorkflow } from "@/interfaces/approval.workflow";
import axios from "axios"; import axios from "axios";
import { useCallback, useEffect, useState } from "react"; import { useCallback, useEffect, useState } from "react";
export default function useApprovalWorkflows() { export default function useApprovalWorkflows(entitiesString?: string) {
const [workflows, setWorkflows] = useState<ApprovalWorkflow[]>([]); const [workflows, setWorkflows] = useState<ApprovalWorkflow[]>([]);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [isError, setIsError] = useState(false); const [isError, setIsError] = useState(false);
@@ -10,7 +10,7 @@ export default function useApprovalWorkflows() {
const getData = useCallback(() => { const getData = useCallback(() => {
setIsLoading(true); setIsLoading(true);
axios axios
.get<ApprovalWorkflow[]>(`/api/approval-workflows`) .get<ApprovalWorkflow[]>(`/api/approval-workflows`, {params: { entityIds: entitiesString }})
.then((response) => setWorkflows(response.data)) .then((response) => setWorkflows(response.data))
.catch((error) => { .catch((error) => {
setIsError(true); setIsError(true);

View File

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

View File

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

View File

@@ -1,4 +1,3 @@
import instructions from "@/pages/api/exam/media/instructions";
import { Module } from "."; import { Module } from ".";
export type Exam = ReadingExam | ListeningExam | WritingExam | SpeakingExam | LevelExam; 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 // Left easy, medium and hard to support older exam versions
export type BasicDifficulty = "easy" | "medium" | "hard"; export type BasicDifficulty = "easy" | "medium" | "hard";
export type CEFRLevels = "A1" | "A2" | "B1" | "B2" | "C1" | "C2"; 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 { export interface ExamBase {
@@ -24,8 +26,9 @@ export interface ExamBase {
shuffle?: boolean; shuffle?: boolean;
createdBy?: string; // option as it has been added later createdBy?: string; // option as it has been added later
createdAt?: string; // option as it has been added later createdAt?: string; // option as it has been added later
private?: boolean; access: AccessType;
label?: string; label?: string;
requiresApproval?: boolean;
} }
export interface ReadingExam extends ExamBase { export interface ReadingExam extends ExamBase {
module: "reading"; module: "reading";

View File

@@ -1,7 +1,10 @@
import { Module } from "@/interfaces"; import { Module } from "@/interfaces";
import { getApprovalWorkflowByFormIntaker, createApprovalWorkflow } from "@/utils/approval.workflows.be"; import { getApprovalWorkflowByFormIntaker, createApprovalWorkflow } from "@/utils/approval.workflows.be";
import client from "@/lib/mongodb";
export async function createApprovalWorkflowsOnExamCreation(examAuthor: string, examEntities: string[], examId: string, examModule: string) { const db = client.db(process.env.MONGODB_DB);
/* export async function createApprovalWorkflowsOnExamCreation(examAuthor: string, examEntities: string[], examId: string, examModule: string) {
const results = await Promise.all( const results = await Promise.all(
examEntities.map(async (entity) => { examEntities.map(async (entity) => {
const configuredWorkflow = await getApprovalWorkflowByFormIntaker(entity, examAuthor); const configuredWorkflow = await getApprovalWorkflowByFormIntaker(entity, examAuthor);
@@ -27,6 +30,53 @@ export async function createApprovalWorkflowsOnExamCreation(examAuthor: string,
const successCount = results.filter((r) => r.created).length; const successCount = results.filter((r) => r.created).length;
const totalCount = examEntities.length; const totalCount = examEntities.length;
return {
successCount,
totalCount,
};
} */
// TEMPORARY BEHAVIOUR! ONLY THE FIRST CONFIGURED WORKFLOW FOUND IS STARTED
export async function createApprovalWorkflowOnExamCreation(examAuthor: string, examEntities: string[], examId: string, examModule: string) {
let successCount = 0;
let totalCount = 0;
for (const entity of examEntities) {
const configuredWorkflow = await getApprovalWorkflowByFormIntaker(entity, examAuthor);
if (!configuredWorkflow) {
continue;
}
totalCount = 1; // a workflow was found
configuredWorkflow.modules.push(examModule as Module);
configuredWorkflow.name = examId;
configuredWorkflow.examId = examId;
configuredWorkflow.entityId = entity;
configuredWorkflow.startDate = Date.now();
configuredWorkflow.steps[0].completed = true;
configuredWorkflow.steps[0].completedBy = examAuthor;
configuredWorkflow.steps[0].completedDate = Date.now();
try {
await createApprovalWorkflow("active-workflows", configuredWorkflow);
successCount = 1;
break; // Stop after the first success
} catch (error: any) {
break;
}
}
// prettier-ignore
if (totalCount === 0) { // current behaviour: if no workflow was found skip approval process
await db.collection(examModule).updateOne(
{ id: examId },
{ $set: { id: examId, isDiagnostic: false }},
{ upsert: true }
);
}
return { return {
successCount, successCount,
totalCount, totalCount,

View File

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

View File

@@ -15,170 +15,210 @@ import { findBy, mapBy } from "@/utils";
import useEntitiesCodes from "@/hooks/useEntitiesCodes"; import useEntitiesCodes from "@/hooks/useEntitiesCodes";
import Table from "@/components/High/Table"; import Table from "@/components/High/Table";
type TableData = Code & { entity?: EntityWithRoles, creator?: User } type TableData = Code & { entity?: EntityWithRoles; creator?: User };
const columnHelper = createColumnHelper<TableData>(); const columnHelper = createColumnHelper<TableData>();
export default function CodeList({ user, entities, canDeleteCodes } export default function CodeList({
: { user: User, entities: EntityWithRoles[], canDeleteCodes?: boolean }) { user,
const [selectedCodes, setSelectedCodes] = useState<string[]>([]); 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 { 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(
...code, () =>
entity: findBy(entities, 'id', code.entity), codes.map((code) => ({
creator: findBy(users, 'id', code.creator) ...code,
})) 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) => { 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) => { // const toggleAllCodes = (checked: boolean) => {
// if (checked) return setSelectedCodes(visibleRows.filter((x) => !x.userId).map((x) => x.code)); // if (checked) return setSelectedCodes(visibleRows.filter((x) => !x.userId).map((x) => x.code));
// return setSelectedCodes([]); // return setSelectedCodes([]);
// }; // };
const deleteCodes = async (codes: string[]) => { const deleteCodes = async (codes: string[]) => {
if (!canDeleteCodes) return if (!canDeleteCodes) return;
if (!confirm(`Are you sure you want to delete these ${codes.length} code(s)?`)) return; if (
!confirm(`Are you sure you want to delete these ${codes.length} code(s)?`)
)
return;
const params = new URLSearchParams(); const params = new URLSearchParams();
codes.forEach((code) => params.append("code", code)); codes.forEach((code) => params.append("code", code));
axios axios
.delete(`/api/code?${params.toString()}`) .delete(`/api/code?${params.toString()}`)
.then(() => { .then(() => {
toast.success(`Deleted the codes!`); toast.success(`Deleted the codes!`);
setSelectedCodes([]); setSelectedCodes([]);
}) })
.catch((reason) => { .catch((reason) => {
if (reason.response.status === 404) { if (reason.response.status === 404) {
toast.error("Code not found!"); toast.error("Code not found!");
return; return;
} }
if (reason.response.status === 403) { if (reason.response.status === 403) {
toast.error("You do not have permission to delete this code!"); toast.error("You do not have permission to delete this code!");
return; return;
} }
toast.error("Something went wrong, please try again later."); toast.error("Something went wrong, please try again later.");
}) })
.finally(reload); .finally(reload);
}; };
const deleteCode = async (code: Code) => { const deleteCode = async (code: Code) => {
if (!canDeleteCodes) return if (!canDeleteCodes) return;
if (!confirm(`Are you sure you want to delete this "${code.code}" code?`)) return; if (!confirm(`Are you sure you want to delete this "${code.code}" code?`))
return;
axios axios
.delete(`/api/code/${code.code}`) .delete(`/api/code/${code.code}`)
.then(() => toast.success(`Deleted the "${code.code}" exam`)) .then(() => toast.success(`Deleted the "${code.code}" exam`))
.catch((reason) => { .catch((reason) => {
if (reason.response.status === 404) { if (reason.response.status === 404) {
toast.error("Code not found!"); toast.error("Code not found!");
return; return;
} }
if (reason.response.status === 403) { if (reason.response.status === 403) {
toast.error("You do not have permission to delete this code!"); toast.error("You do not have permission to delete this code!");
return; return;
} }
toast.error("Something went wrong, please try again later."); toast.error("Something went wrong, please try again later.");
}) })
.finally(reload); .finally(reload);
}; };
const defaultColumns = [ const defaultColumns = [
columnHelper.accessor("code", { columnHelper.accessor("code", {
id: "codeCheckbox", id: "codeCheckbox",
enableSorting: false, enableSorting: false,
header: () => (""), header: () => "",
cell: (info) => cell: (info) =>
!info.row.original.userId ? ( !info.row.original.userId ? (
<Checkbox isChecked={selectedCodes.includes(info.getValue())} onChange={() => toggleCode(info.getValue())}> <Checkbox
{""} isChecked={selectedCodes.includes(info.getValue())}
</Checkbox> onChange={() => toggleCode(info.getValue())}
) : null, >
}), {""}
columnHelper.accessor("code", { </Checkbox>
header: "Code", ) : null,
cell: (info) => info.getValue(), }),
}), columnHelper.accessor("code", {
columnHelper.accessor("creationDate", { header: "Code",
header: "Creation Date", cell: (info) => info.getValue(),
cell: (info) => (info.getValue() ? moment(info.getValue()).format("DD/MM/YYYY") : "N/A"), }),
}), columnHelper.accessor("creationDate", {
columnHelper.accessor("email", { header: "Creation Date",
header: "E-mail", cell: (info) =>
cell: (info) => info.getValue() || "N/A", info.getValue() ? moment(info.getValue()).format("DD/MM/YYYY") : "N/A",
}), }),
columnHelper.accessor("creator", { columnHelper.accessor("email", {
header: "Creator", header: "E-mail",
cell: (info) => info.getValue() ? `${info.getValue().name} (${USER_TYPE_LABELS[info.getValue().type]})` : "N/A", cell: (info) => info.getValue() || "N/A",
}), }),
columnHelper.accessor("entity", { columnHelper.accessor("creator", {
header: "Entity", header: "Creator",
cell: (info) => info.getValue()?.label || "N/A", cell: (info) =>
}), info.getValue()
columnHelper.accessor("userId", { ? `${info.getValue().name} (${
header: "Availability", USER_TYPE_LABELS[info.getValue().type]
cell: (info) => })`
info.getValue() ? ( : "N/A",
<span className="flex gap-1 items-center text-mti-green"> }),
<div className="w-2 h-2 rounded-full bg-mti-green" /> In Use columnHelper.accessor("entity", {
</span> header: "Entity",
) : ( cell: (info) => info.getValue()?.label || "N/A",
<span className="flex gap-1 items-center text-mti-red"> }),
<div className="w-2 h-2 rounded-full bg-mti-red" /> Unused columnHelper.accessor("userId", {
</span> header: "Availability",
), cell: (info) =>
}), info.getValue() ? (
{ <span className="flex gap-1 items-center text-mti-green">
header: "", <div className="w-2 h-2 rounded-full bg-mti-green" /> In Use
id: "actions", </span>
cell: ({ row }: { row: { original: Code } }) => { ) : (
return ( <span className="flex gap-1 items-center text-mti-red">
<div className="flex gap-4"> <div className="w-2 h-2 rounded-full bg-mti-red" /> Unused
{canDeleteCodes && !row.original.userId && ( </span>
<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> {
)} header: "",
</div> id: "actions",
); cell: ({ row }: { row: { original: Code } }) => {
}, return (
}, <div className="flex gap-4">
]; {canDeleteCodes && !row.original.userId && (
<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>
)}
</div>
);
},
},
];
return ( return (
<> <>
<div className="flex items-center justify-between pb-4 pt-1"> <div className="flex items-center justify-between pb-4 pt-1">
{canDeleteCodes && ( {canDeleteCodes && (
<div className="flex gap-4 items-center w-full justify-end"> <div className="flex gap-4 items-center w-full justify-end">
<span>{selectedCodes.length} code(s) selected</span> <span>{selectedCodes.length} code(s) selected</span>
<Button <Button
disabled={selectedCodes.length === 0} disabled={selectedCodes.length === 0}
variant="outline" variant="outline"
color="red" color="red"
className="!py-1 px-10" className="!py-1 px-10"
onClick={() => deleteCodes(selectedCodes)}> onClick={() => deleteCodes(selectedCodes)}
Delete >
</Button> Delete
</div> </Button>
)} </div>
</div> )}
<Table<TableData> </div>
data={data} <Table<TableData>
columns={defaultColumns} data={data}
searchFields={[["code"], ["email"], ["entity", "label"], ["creator", "name"], ['creator', 'type']]} columns={defaultColumns}
/> isLoading={isLoading}
</> searchFields={[
); ["code"],
["email"],
["entity", "label"],
["creator", "name"],
["creator", "type"],
]}
/>
</>
);
} }

View File

@@ -1,287 +1,394 @@
import {useMemo, useState} from "react"; import { useMemo, useState } from "react";
import {PERMISSIONS} from "@/constants/userPermissions"; import { PERMISSIONS } from "@/constants/userPermissions";
import useExams from "@/hooks/useExams"; import useExams from "@/hooks/useExams";
import useUsers from "@/hooks/useUsers"; import useUsers from "@/hooks/useUsers";
import {Module} from "@/interfaces"; import { Module } from "@/interfaces";
import {Exam} from "@/interfaces/exam"; import { Exam } from "@/interfaces/exam";
import {User} from "@/interfaces/user"; import { User } from "@/interfaces/user";
import useExamStore from "@/stores/exam"; import useExamStore from "@/stores/exam";
import {getExamById} from "@/utils/exams"; import { getExamById } from "@/utils/exams";
import {countExercises} from "@/utils/moduleUtils"; import { countExercises } from "@/utils/moduleUtils";
import {createColumnHelper, flexRender, getCoreRowModel, useReactTable} from "@tanstack/react-table"; import {
createColumnHelper,
flexRender,
getCoreRowModel,
useReactTable,
} from "@tanstack/react-table";
import axios from "axios"; import axios from "axios";
import {capitalize, uniq} from "lodash"; import { capitalize } from "lodash";
import {useRouter} from "next/router"; import { useRouter } from "next/router";
import {BsBan, BsCheck, BsCircle, BsPencil, BsTrash, BsUpload, BsX} from "react-icons/bs"; import { BsCheck, BsPencil, BsTrash, BsUpload, BsX } from "react-icons/bs";
import {toast} from "react-toastify"; import { toast } from "react-toastify";
import {useListSearch} from "@/hooks/useListSearch"; import { useListSearch } from "@/hooks/useListSearch";
import Modal from "@/components/Modal"; import Modal from "@/components/Modal";
import {checkAccess} from "@/utils/permissions"; import { checkAccess, findAllowedEntities } from "@/utils/permissions";
import useGroups from "@/hooks/useGroups";
import Button from "@/components/Low/Button"; import Button from "@/components/Low/Button";
import {EntityWithRoles} from "@/interfaces/entity"; import { EntityWithRoles } from "@/interfaces/entity";
import {BiEdit} from "react-icons/bi"; import { BiEdit } from "react-icons/bi";
import {findBy, mapBy} from "@/utils"; import { findBy, mapBy } from "@/utils";
import {getUserName} from "@/utils/users";
const searchFields = [["module"], ["id"], ["createdBy"]]; const searchFields = [["module"], ["id"], ["createdBy"]];
const CLASSES: {[key in Module]: string} = { const CLASSES: { [key in Module]: string } = {
reading: "text-ielts-reading", reading: "text-ielts-reading",
listening: "text-ielts-listening", listening: "text-ielts-listening",
speaking: "text-ielts-speaking", speaking: "text-ielts-speaking",
writing: "text-ielts-writing", writing: "text-ielts-writing",
level: "text-ielts-level", level: "text-ielts-level",
}; };
const columnHelper = createColumnHelper<Exam>(); const columnHelper = createColumnHelper<Exam>();
export default function ExamList({user, entities}: {user: User; entities: EntityWithRoles[]}) { export default function ExamList({
const [selectedExam, setSelectedExam] = useState<Exam>(); user,
entities,
}: {
user: User;
entities: EntityWithRoles[];
}) {
const [selectedExam, setSelectedExam] = useState<Exam>();
const {exams, reload} = useExams(); const canViewConfidentialEntities = useMemo(
const {users} = useUsers(); () =>
mapBy(
findAllowedEntities(user, entities, "view_confidential_exams"),
"id"
),
[user, entities]
);
const filteredExams = useMemo( const { exams, reload, isLoading } = useExams();
() => const { users } = useUsers();
exams.filter((e) => { // Pass this permission filter to the backend later
if (!e.private) return true; const filteredExams = useMemo(
return (e.entities || []).some((ent) => mapBy(user.entities, "id").includes(ent)); () =>
}), ["admin", "developer"].includes(user?.type)
[exams, user?.entities], ? exams
); : exams.filter((item) => {
if (
item.access === "confidential" &&
!canViewConfidentialEntities.find((x) =>
(item.entities ?? []).includes(x)
)
)
return false;
return true;
}),
[canViewConfidentialEntities, exams, user?.type]
);
const parsedExams = useMemo(() => { const parsedExams = useMemo(() => {
return filteredExams.map((exam) => { return filteredExams.map((exam) => {
if (exam.createdBy) { if (exam.createdBy) {
const user = users.find((u) => u.id === exam.createdBy); const user = users.find((u) => u.id === exam.createdBy);
if (!user) return exam; if (!user) return exam;
return { return {
...exam, ...exam,
createdBy: user.type === "developer" ? "system" : user.name, createdBy: user.type === "developer" ? "system" : user.name,
}; };
} }
return exam; return exam;
}); });
}, [filteredExams, users]); }, [filteredExams, users]);
const {rows: filteredRows, renderSearch} = useListSearch<Exam>(searchFields, parsedExams); const { rows: filteredRows, renderSearch } = useListSearch<Exam>(
searchFields,
parsedExams
);
const dispatch = useExamStore((state) => state.dispatch); const dispatch = useExamStore((state) => state.dispatch);
const router = useRouter(); const router = useRouter();
const loadExam = async (module: Module, examId: string) => { const loadExam = async (module: Module, examId: string) => {
const exam = await getExamById(module, examId.trim()); const exam = await getExamById(module, examId.trim());
if (!exam) { if (!exam) {
toast.error("Unknown Exam ID! Please make sure you selected the right module and entered the right exam ID", { toast.error(
toastId: "invalid-exam-id", "Unknown Exam ID! Please make sure you selected the right module and entered the right exam ID",
}); {
toastId: "invalid-exam-id",
}
);
return; return;
} }
dispatch({type: "INIT_EXAM", payload: {exams: [exam], modules: [module]}}); dispatch({
type: "INIT_EXAM",
payload: { exams: [exam], modules: [module] },
});
router.push("/exam"); 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; const privatizeExam = async (exam: Exam) => {
if (
!confirm(
`Are you sure you want to make this ${capitalize(exam.module)} exam ${
exam.access
}?`
)
)
return;
axios 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`)) .then(() => toast.success(`Updated the "${exam.id}" exam`))
.catch((reason) => { .catch((reason) => {
if (reason.response.status === 404) { if (reason.response.status === 404) {
toast.error("Exam not found!"); toast.error("Exam not found!");
return; return;
} }
if (reason.response.status === 403) { if (reason.response.status === 403) {
toast.error("You do not have permission to update this exam!"); toast.error("You do not have permission to update this exam!");
return; return;
} }
toast.error("Something went wrong, please try again later."); toast.error("Something went wrong, please try again later.");
}) })
.finally(reload); .finally(reload);
}; };
*/
const deleteExam = async (exam: Exam) => { 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 axios
.delete(`/api/exam/${exam.module}/${exam.id}`) .delete(`/api/exam/${exam.module}/${exam.id}`)
.then(() => toast.success(`Deleted the "${exam.id}" exam`)) .then(() => toast.success(`Deleted the "${exam.id}" exam`))
.catch((reason) => { .catch((reason) => {
if (reason.response.status === 404) { if (reason.response.status === 404) {
toast.error("Exam not found!"); toast.error("Exam not found!");
return; return;
} }
if (reason.response.status === 403) { if (reason.response.status === 403) {
toast.error("You do not have permission to delete this exam!"); toast.error("You do not have permission to delete this exam!");
return; return;
} }
toast.error("Something went wrong, please try again later."); toast.error("Something went wrong, please try again later.");
}) })
.finally(reload); .finally(reload);
}; };
const getTotalExercises = (exam: Exam) => { const getTotalExercises = (exam: Exam) => {
if (exam.module === "reading" || exam.module === "listening" || exam.module === "level") { if (
return countExercises(exam.parts.flatMap((x) => x.exercises)); exam.module === "reading" ||
} exam.module === "listening" ||
exam.module === "level"
) {
return countExercises((exam.parts ?? []).flatMap((x) => x.exercises));
}
return countExercises(exam.exercises); return countExercises(exam.exercises);
}; };
const defaultColumns = [ const defaultColumns = [
columnHelper.accessor("id", { columnHelper.accessor("id", {
header: "ID", header: "ID",
cell: (info) => info.getValue(), cell: (info) => info.getValue(),
}), }),
columnHelper.accessor("module", { columnHelper.accessor("module", {
header: "Module", header: "Module",
cell: (info) => <span className={CLASSES[info.getValue()]}>{capitalize(info.getValue())}</span>, cell: (info) => (
}), <span className={CLASSES[info.getValue()]}>
columnHelper.accessor((x) => getTotalExercises(x), { {capitalize(info.getValue())}
header: "Exercises", </span>
cell: (info) => info.getValue(), ),
}), }),
columnHelper.accessor("minTimer", { columnHelper.accessor((x) => getTotalExercises(x), {
header: "Timer", header: "Exercises",
cell: (info) => <>{info.getValue()} minute(s)</>, cell: (info) => info.getValue(),
}), }),
columnHelper.accessor("private", { columnHelper.accessor("minTimer", {
header: "Private", header: "Timer",
cell: (info) => <span className="w-full flex items-center justify-center">{!info.getValue() ? <BsX /> : <BsCheck />}</span>, cell: (info) => <>{info.getValue()} minute(s)</>,
}), }),
columnHelper.accessor("createdAt", { columnHelper.accessor("access", {
header: "Created At", header: "Access",
cell: (info) => { cell: (info) => <span>{capitalize(info.getValue())}</span>,
const value = info.getValue(); }),
if (value) { columnHelper.accessor("createdAt", {
return new Date(value).toLocaleDateString(); header: "Created At",
} cell: (info) => {
const value = info.getValue();
if (value) {
return new Date(value).toLocaleDateString();
}
return null; return null;
}, },
}), }),
columnHelper.accessor("createdBy", { columnHelper.accessor("createdBy", {
header: "Created By", header: "Created By",
cell: (info) => (!info.getValue() ? "System" : findBy(users, "id", info.getValue())?.name || "N/A"), cell: (info) =>
}), !info.getValue()
{ ? "System"
header: "", : findBy(users, "id", info.getValue())?.name || "N/A",
id: "actions", }),
cell: ({row}: {row: {original: Exam}}) => { {
return ( header: "",
<div className="flex gap-4"> id: "actions",
{(row.original.owners?.includes(user.id) || checkAccess(user, ["admin", "developer"])) && ( cell: ({ row }: { row: { original: Exam } }) => {
<> return (
<button <div className="flex gap-4">
data-tip={row.original.private ? "Set as public" : "Set as private"} {(row.original.owners?.includes(user.id) ||
onClick={async () => await privatizeExam(row.original)} checkAccess(user, ["admin", "developer"])) && (
className="cursor-pointer tooltip"> <>
{row.original.private ? <BsCircle /> : <BsBan />} {checkAccess(user, [
</button> "admin",
{checkAccess(user, ["admin", "developer", "mastercorporate"]) && ( "developer",
<button data-tip="Edit exam" onClick={() => setSelectedExam(row.original)} className="cursor-pointer tooltip"> "mastercorporate",
<BsPencil /> ]) && (
</button> <button
)} data-tip="Edit exam"
</> onClick={() => setSelectedExam(row.original)}
)} className="cursor-pointer tooltip"
<button >
data-tip="Load exam" <BsPencil />
className="cursor-pointer tooltip" </button>
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) && ( <button
<div data-tip="Delete" className="cursor-pointer tooltip" onClick={() => deleteExam(row.original)}> data-tip="Load exam"
<BsTrash className="hover:text-mti-purple-light transition ease-in-out duration-300" /> className="cursor-pointer tooltip"
</div> onClick={async () =>
)} await loadExam(row.original.module, row.original.id)
</div> }
); >
}, <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)}
>
<BsTrash className="hover:text-mti-purple-light transition ease-in-out duration-300" />
</div>
)}
</div>
);
},
},
];
const table = useReactTable({ const table = useReactTable({
data: filteredRows, data: filteredRows,
columns: defaultColumns, columns: defaultColumns,
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
}); });
const handleExamEdit = () => { const handleExamEdit = () => {
router.push(`/generation?id=${selectedExam!.id}&module=${selectedExam!.module}`); router.push(
}; `/generation?id=${selectedExam!.id}&module=${selectedExam!.module}`
);
};
return ( return (
<div className="flex flex-col gap-4 w-full h-full"> <div className="flex flex-col gap-4 w-full h-full">
{renderSearch()} {renderSearch()}
<Modal isOpen={!!selectedExam} onClose={() => setSelectedExam(undefined)} maxWidth="max-w-xl"> <Modal
{!!selectedExam ? ( isOpen={!!selectedExam}
<> onClose={() => setSelectedExam(undefined)}
<div className="p-6"> maxWidth="max-w-xl"
<div className="mb-6"> >
<div className="flex items-center gap-2 mb-4"> {!!selectedExam ? (
<BiEdit className="w-5 h-5 text-gray-600" /> <>
<span className="text-gray-600 font-medium">Ready to Edit</span> <div className="p-6">
</div> <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>
</div>
<div className="bg-gray-50 rounded-lg p-4 mb-3"> <div className="bg-gray-50 rounded-lg p-4 mb-3">
<p className="font-medium mb-1">Exam ID: {selectedExam.id}</p> <p className="font-medium mb-1">Exam ID: {selectedExam.id}</p>
</div> </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">
</div> Click &apos;Next&apos; to proceed to the exam editor.
</p>
</div>
<div className="flex justify-between gap-4 mt-8"> <div className="flex justify-between gap-4 mt-8">
<Button color="purple" variant="outline" onClick={() => setSelectedExam(undefined)} className="w-32"> <Button
Cancel color="purple"
</Button> variant="outline"
<Button color="purple" onClick={handleExamEdit} className="w-32 text-white flex items-center justify-center gap-2"> onClick={() => setSelectedExam(undefined)}
Proceed className="w-32"
</Button> >
</div> Cancel
</div> </Button>
{/*<ExamOwnerSelector options={filteredCorporates} exam={selectedExam} onSave={(owners) => updateExam(selectedExam, { owners })} />*/} <Button
</> color="purple"
) : ( onClick={handleExamEdit}
<div /> className="w-32 text-white flex items-center justify-center gap-2"
)} >
</Modal> Proceed
<table className="rounded-xl bg-mti-purple-ultralight/40 w-full"> </Button>
<thead> </div>
{table.getHeaderGroups().map((headerGroup) => ( </div>
<tr key={headerGroup.id}> {/*<ExamOwnerSelector options={filteredCorporates} exam={selectedExam} onSave={(owners) => updateExam(selectedExam, { owners })} />*/}
{headerGroup.headers.map((header) => ( </>
<th className="p-4 text-left" key={header.id}> ) : (
{header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())} <div />
</th> )}
))} </Modal>
</tr> <table className="rounded-xl bg-mti-purple-ultralight/40 w-full">
))} <thead>
</thead> {table.getHeaderGroups().map((headerGroup) => (
<tbody className="px-2"> <tr key={headerGroup.id}>
{table.getRowModel().rows.map((row) => ( {headerGroup.headers.map((header) => (
<tr className="odd:bg-white even:bg-mti-purple-ultralight/40 rounded-lg py-2" key={row.id}> <th className="p-4 text-left" key={header.id}>
{row.getVisibleCells().map((cell) => ( {header.isPlaceholder
<td className="px-4 py-2" key={cell.id}> ? null
{flexRender(cell.column.columnDef.cell, cell.getContext())} : flexRender(
</td> header.column.columnDef.header,
))} header.getContext()
</tr> )}
))} </th>
</tbody> ))}
</table> </tr>
</div> ))}
); </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}
>
{row.getVisibleCells().map((cell) => (
<td className="px-4 py-2" key={cell.id}>
{flexRender(cell.column.columnDef.cell, cell.getContext())}
</td>
))}
</tr>
))}
</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>
);
} }

View File

@@ -22,8 +22,6 @@ import useFilterStore from "@/stores/listFilterStore";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { mapBy } from "@/utils"; import { mapBy } from "@/utils";
import { exportListToExcel } from "@/utils/users"; import { exportListToExcel } from "@/utils/users";
import usePermissions from "@/hooks/usePermissions";
import useUserBalance from "@/hooks/useUserBalance";
import useEntitiesUsers from "@/hooks/useEntitiesUsers"; import useEntitiesUsers from "@/hooks/useEntitiesUsers";
import { WithLabeledEntities } from "@/interfaces/entity"; import { WithLabeledEntities } from "@/interfaces/entity";
import Table from "@/components/High/Table"; 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) if (entitiesDownloadUsers.length === 0)
return toast.error("You are not allowed to download the user list."); return toast.error("You are not allowed to download the user list.");
const allowedRows = rows.filter((r) => const allowedRows = rows;
mapBy(r.entities, "id").some((e) => const csv = await exportListToExcel(allowedRows);
mapBy(entitiesDownloadUsers, "id").includes(e)
)
);
const csv = exportListToExcel(allowedRows);
const element = document.createElement("a"); 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.href = URL.createObjectURL(file);
element.download = "users.csv"; element.download = "users.xlsx";
document.body.appendChild(element); document.body.appendChild(element);
element.click(); element.click();
document.body.removeChild(element); document.body.removeChild(element);

View File

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

View File

@@ -1,273 +1,272 @@
import Button from "@/components/Low/Button"; import Button from "@/components/Low/Button";
import Checkbox from "@/components/Low/Checkbox"; import Checkbox from "@/components/Low/Checkbox";
import { PERMISSIONS } from "@/constants/userPermissions"; import {PERMISSIONS} from "@/constants/userPermissions";
import { CorporateUser, TeacherUser, Type, User } from "@/interfaces/user"; import {CorporateUser, TeacherUser, Type, User} from "@/interfaces/user";
import { USER_TYPE_LABELS } from "@/resources/user"; import {USER_TYPE_LABELS} from "@/resources/user";
import axios from "axios"; import axios from "axios";
import clsx from "clsx"; import clsx from "clsx";
import { capitalize, uniqBy } from "lodash"; import {capitalize, uniqBy} from "lodash";
import moment from "moment"; import moment from "moment";
import { useEffect, useState } from "react"; import {useEffect, useState} from "react";
import ReactDatePicker from "react-datepicker"; import ReactDatePicker from "react-datepicker";
import { toast } from "react-toastify"; import {toast} from "react-toastify";
import ShortUniqueId from "short-unique-id"; import ShortUniqueId from "short-unique-id";
import { checkAccess, getTypesOfUser } from "@/utils/permissions"; import {checkAccess, getTypesOfUser} from "@/utils/permissions";
import { PermissionType } from "@/interfaces/permissions"; import {PermissionType} from "@/interfaces/permissions";
import usePermissions from "@/hooks/usePermissions"; import usePermissions from "@/hooks/usePermissions";
import Input from "@/components/Low/Input"; import Input from "@/components/Low/Input";
import CountrySelect from "@/components/Low/CountrySelect"; import CountrySelect from "@/components/Low/CountrySelect";
import useGroups from "@/hooks/useGroups"; import useGroups from "@/hooks/useGroups";
import useUsers from "@/hooks/useUsers"; import useUsers from "@/hooks/useUsers";
import { getUserName } from "@/utils/users"; import {getUserName} from "@/utils/users";
import Select from "@/components/Low/Select"; import Select from "@/components/Low/Select";
import { EntityWithRoles } from "@/interfaces/entity"; import {EntityWithRoles} from "@/interfaces/entity";
import useEntitiesGroups from "@/hooks/useEntitiesGroups"; import useEntitiesGroups from "@/hooks/useEntitiesGroups";
import {mapBy} from "@/utils";
const USER_TYPE_PERMISSIONS: { const USER_TYPE_PERMISSIONS: {
[key in Type]: { perm: PermissionType | undefined; list: Type[] }; [key in Type]: {perm: PermissionType | undefined; list: Type[]};
} = { } = {
student: { student: {
perm: "createCodeStudent", perm: "createCodeStudent",
list: [], list: [],
}, },
teacher: { teacher: {
perm: "createCodeTeacher", perm: "createCodeTeacher",
list: [], list: [],
}, },
agent: { agent: {
perm: "createCodeCountryManager", perm: "createCodeCountryManager",
list: ["student", "teacher", "corporate", "mastercorporate"], list: ["student", "teacher", "corporate", "mastercorporate"],
}, },
corporate: { corporate: {
perm: "createCodeCorporate", perm: "createCodeCorporate",
list: ["student", "teacher"], list: ["student", "teacher"],
}, },
mastercorporate: { mastercorporate: {
perm: undefined, perm: undefined,
list: ["student", "teacher", "corporate"], list: ["student", "teacher", "corporate"],
}, },
admin: { admin: {
perm: "createCodeAdmin", perm: "createCodeAdmin",
list: ["student", "teacher", "agent", "corporate", "admin", "mastercorporate"], list: ["student", "teacher", "agent", "corporate", "admin", "mastercorporate"],
}, },
developer: { developer: {
perm: undefined, perm: undefined,
list: ["student", "teacher", "agent", "corporate", "admin", "developer", "mastercorporate"], list: ["student", "teacher", "agent", "corporate", "admin", "developer", "mastercorporate"],
}, },
}; };
interface Props { interface Props {
user: User; user: User;
users: User[]; users: User[];
entities: EntityWithRoles[] entities: EntityWithRoles[];
permissions: PermissionType[]; permissions: PermissionType[];
onFinish: () => void; onFinish: () => void;
} }
export default function UserCreator({ user, users, entities = [], permissions, onFinish }: Props) { export default function UserCreator({user, users, entities = [], permissions, onFinish}: Props) {
const [name, setName] = useState<string>(); const [name, setName] = useState<string>();
const [email, setEmail] = useState<string>(); const [email, setEmail] = useState<string>();
const [phone, setPhone] = useState<string>(); const [phone, setPhone] = useState<string>();
const [passportID, setPassportID] = useState<string>(); const [passportID, setPassportID] = useState<string>();
const [studentID, setStudentID] = useState<string>(); const [studentID, setStudentID] = useState<string>();
const [country, setCountry] = useState(user?.demographicInformation?.country); const [country, setCountry] = useState(user?.demographicInformation?.country);
const [group, setGroup] = useState<string | null>(); const [group, setGroup] = useState<string | null>();
const [password, setPassword] = useState<string>(); const [password, setPassword] = useState<string>();
const [confirmPassword, setConfirmPassword] = useState<string>(); const [confirmPassword, setConfirmPassword] = useState<string>();
const [expiryDate, setExpiryDate] = useState<Date | null>( const [expiryDate, setExpiryDate] = useState<Date | null>(
user?.subscriptionExpirationDate ? moment(user?.subscriptionExpirationDate).toDate() : null, user?.subscriptionExpirationDate ? moment(user?.subscriptionExpirationDate).toDate() : null,
); );
const [isExpiryDateEnabled, setIsExpiryDateEnabled] = useState(true); const [isExpiryDateEnabled, setIsExpiryDateEnabled] = useState(true);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [type, setType] = useState<Type>("student"); const [type, setType] = useState<Type>("student");
const [position, setPosition] = useState<string>(); const [position, setPosition] = useState<string>();
const [entity, setEntity] = useState((entities || [])[0]?.id || undefined) const [entity, setEntity] = useState((entities || [])[0]?.id || undefined);
const { groups } = useEntitiesGroups(); const {groups} = useEntitiesGroups();
useEffect(() => { useEffect(() => {
if (!isExpiryDateEnabled) setExpiryDate(null); if (!isExpiryDateEnabled) setExpiryDate(null);
}, [isExpiryDateEnabled]); }, [isExpiryDateEnabled]);
const createUser = () => { const createUser = () => {
if (!name || name.trim().length === 0) return toast.error("Please enter a valid name!"); if (!name || name.trim().length === 0) return toast.error("Please enter a valid name!");
if (!email || email.trim().length === 0) return toast.error("Please enter a valid e-mail address!"); if (!email || email.trim().length === 0) return toast.error("Please enter a valid e-mail address!");
if (users.map((x) => x.email).includes(email.trim())) return toast.error("That e-mail is already in use!"); if (users.map((x) => x.email).includes(email.trim())) return toast.error("That e-mail is already in use!");
if (!password || password.trim().length < 6) return toast.error("Please enter a valid password!"); if (!password || password.trim().length < 6) return toast.error("Please enter a valid password!");
if (password !== confirmPassword) return toast.error("The passwords do not match!"); if (password !== confirmPassword) return toast.error("The passwords do not match!");
setIsLoading(true); setIsLoading(true);
const body = { const body = {
name, name,
email, email,
password, password,
groupID: group, groupID: group,
entity, entity,
type, type,
studentID: type === "student" ? studentID : undefined, studentID: type === "student" ? studentID : undefined,
expiryDate, expiryDate,
demographicInformation: { demographicInformation: {
passport_id: type === "student" ? passportID : undefined, passport_id: type === "student" ? passportID : undefined,
phone, phone,
country, country,
position, position,
}, },
}; };
axios axios
.post("/api/make_user", body) .post("/api/make_user", body)
.then(() => { .then(() => {
toast.success("That user has been created!"); toast.success("That user has been created!");
onFinish(); onFinish();
setName(""); setName("");
setEmail(""); setEmail("");
setPhone(""); setPhone("");
setPassportID(""); setPassportID("");
setStudentID(""); setStudentID("");
setCountry(user?.demographicInformation?.country); setCountry(user?.demographicInformation?.country);
setGroup(null); setGroup(null);
setEntity((entities || [])[0]?.id || undefined) setEntity((entities || [])[0]?.id || undefined);
setExpiryDate(user?.subscriptionExpirationDate ? moment(user?.subscriptionExpirationDate).toDate() : null); setExpiryDate(user?.subscriptionExpirationDate ? moment(user?.subscriptionExpirationDate).toDate() : null);
setIsExpiryDateEnabled(true); setIsExpiryDateEnabled(true);
setType("student"); setType("student");
setPosition(undefined); setPosition(undefined);
}) })
.catch((error) => { .catch((error) => {
const data = error?.response?.data; const data = error?.response?.data;
if (!!data?.message) return toast.error(data.message); if (!!data?.message) return toast.error(data.message);
toast.error("Something went wrong! Please try again later!"); toast.error("Something went wrong! Please try again later!");
}) })
.finally(() => setIsLoading(false)); .finally(() => setIsLoading(false));
}; };
return ( return (
<div className="flex flex-col gap-4 border p-4 border-mti-gray-platinum rounded-xl"> <div className="flex flex-col gap-4 border p-4 border-mti-gray-platinum rounded-xl">
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
<Input required label="Name" value={name} onChange={setName} type="text" name="name" placeholder="Name" /> <Input required label="Name" value={name} onChange={setName} type="text" name="name" placeholder="Name" />
<Input label="E-mail" required value={email} onChange={setEmail} type="email" name="email" placeholder="E-mail" /> <Input label="E-mail" required value={email} onChange={setEmail} type="email" name="email" placeholder="E-mail" />
<Input type="password" name="password" label="Password" value={password} onChange={setPassword} placeholder="Password" required /> <Input type="password" name="password" label="Password" value={password} onChange={setPassword} placeholder="Password" required />
<Input <Input
type="password" type="password"
name="confirmPassword" name="confirmPassword"
label="Confirm Password" label="Confirm Password"
value={confirmPassword} value={confirmPassword}
onChange={setConfirmPassword} onChange={setConfirmPassword}
placeholder="ConfirmPassword" placeholder="ConfirmPassword"
required required
/> />
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<label className="font-normal text-base text-mti-gray-dim">Country *</label> <label className="font-normal text-base text-mti-gray-dim">Country *</label>
<CountrySelect value={country} onChange={setCountry} /> <CountrySelect value={country} onChange={setCountry} />
</div> </div>
<Input type="tel" name="phone" label="Phone number" value={phone} onChange={setPhone} placeholder="Phone number" required /> <Input type="tel" name="phone" label="Phone number" value={phone} onChange={setPhone} placeholder="Phone number" required />
{type === "student" && ( {type === "student" && (
<> <>
<Input <Input
type="text" type="text"
name="passport_id" name="passport_id"
label="Passport/National ID" label="Passport/National ID"
onChange={setPassportID} onChange={setPassportID}
value={passportID} value={passportID}
placeholder="National ID or Passport number" placeholder="National ID or Passport number"
required required
/> />
<Input type="text" name="studentID" label="Student ID" onChange={setStudentID} value={studentID} placeholder="Student ID" /> <Input type="text" name="studentID" label="Student ID" onChange={setStudentID} value={studentID} placeholder="Student ID" />
</> </>
)} )}
<div className={clsx("flex flex-col gap-4")}> <div className={clsx("flex flex-col gap-4")}>
<label className="font-normal text-base text-mti-gray-dim">Entity</label> <label className="font-normal text-base text-mti-gray-dim">Entity</label>
<Select <Select
defaultValue={{ value: (entities || [])[0]?.id, label: (entities || [])[0]?.label }} defaultValue={{value: (entities || [])[0]?.id, label: (entities || [])[0]?.label}}
options={entities.map((e) => ({ value: e.id, label: e.label }))} options={entities.map((e) => ({value: e.id, label: e.label}))}
onChange={(e) => setEntity(e?.value || undefined)} onChange={(e) => setEntity(e?.value || undefined)}
isClearable={checkAccess(user, ["admin", "developer"])} isClearable={checkAccess(user, ["admin", "developer"])}
/> />
</div> </div>
{["corporate", "mastercorporate"].includes(type) && ( {["corporate", "mastercorporate"].includes(type) && (
<Input type="text" name="department" label="Department" onChange={setPosition} value={position} placeholder="Department" /> <Input type="text" name="department" label="Department" onChange={setPosition} value={position} placeholder="Department" />
)} )}
<div className={clsx("flex flex-col gap-4")}> <div className={clsx("flex flex-col gap-4")}>
<label className="font-normal text-base text-mti-gray-dim">Classroom</label> <label className="font-normal text-base text-mti-gray-dim">Classroom</label>
<Select <Select
options={groups options={groups.filter((x) => x.entity?.id === entity).map((g) => ({value: g.id, label: g.name}))}
.filter((x) => x.entity?.id === entity) onChange={(e) => setGroup(e?.value || undefined)}
.map((g) => ({ value: g.id, label: g.name }))} isClearable
onChange={(e) => setGroup(e?.value || undefined)} />
isClearable </div>
/>
</div>
<div <div
className={clsx( className={clsx(
"flex flex-col gap-4", "flex flex-col gap-4",
!checkAccess(user, ["developer", "admin", "corporate", "mastercorporate"]) && "col-span-2", !checkAccess(user, ["developer", "admin", "corporate", "mastercorporate"]) && "col-span-2",
)}> )}>
<label className="font-normal text-base text-mti-gray-dim">Type</label> <label className="font-normal text-base text-mti-gray-dim">Type</label>
{user && ( {user && (
<select <select
defaultValue="student" defaultValue="student"
value={type} value={type}
onChange={(e) => setType(e.target.value as Type)} onChange={(e) => setType(e.target.value as Type)}
className="p-6 w-full min-w-[350px] min-h-[70px] flex justify-center text-sm font-normal rounded-full border focus:outline-none cursor-pointer bg-white"> className="p-6 w-full min-w-[350px] min-h-[70px] flex justify-center text-sm font-normal rounded-full border focus:outline-none cursor-pointer bg-white">
{Object.keys(USER_TYPE_LABELS) {Object.keys(USER_TYPE_LABELS)
.filter((x) => { .filter((x) => {
const { list, perm } = USER_TYPE_PERMISSIONS[x as Type]; const {list, perm} = USER_TYPE_PERMISSIONS[x as Type];
return checkAccess(user, getTypesOfUser(list), permissions, perm); return checkAccess(user, getTypesOfUser(list), permissions, perm);
}) })
.map((type) => ( .map((type) => (
<option key={type} value={type}> <option key={type} value={type}>
{USER_TYPE_LABELS[type as keyof typeof USER_TYPE_LABELS]} {USER_TYPE_LABELS[type as keyof typeof USER_TYPE_LABELS]}
</option> </option>
))} ))}
</select> </select>
)} )}
</div> </div>
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
{user && checkAccess(user, ["developer", "admin", "corporate", "mastercorporate"]) && ( {user && checkAccess(user, ["developer", "admin", "corporate", "mastercorporate"]) && (
<> <>
<div className="-md:flex-row -md:items-center flex justify-between gap-2 md:flex-col 2xl:flex-row 2xl:items-center"> <div className="-md:flex-row -md:items-center flex justify-between gap-2 md:flex-col 2xl:flex-row 2xl:items-center">
<label className="text-mti-gray-dim text-base font-normal">Expiry Date</label> <label className="text-mti-gray-dim text-base font-normal">Expiry Date</label>
<Checkbox <Checkbox
isChecked={isExpiryDateEnabled} isChecked={isExpiryDateEnabled}
onChange={setIsExpiryDateEnabled} onChange={setIsExpiryDateEnabled}
disabled={!!user?.subscriptionExpirationDate}> disabled={!!user?.subscriptionExpirationDate}>
Enabled Enabled
</Checkbox> </Checkbox>
</div> </div>
{isExpiryDateEnabled && ( {isExpiryDateEnabled && (
<ReactDatePicker <ReactDatePicker
className={clsx( className={clsx(
"flex min-h-[70px] w-full cursor-pointer justify-center rounded-full border p-6 text-sm font-normal focus:outline-none", "flex min-h-[70px] w-full cursor-pointer justify-center rounded-full border p-6 text-sm font-normal focus:outline-none",
"hover:border-mti-purple tooltip", "hover:border-mti-purple tooltip",
"transition duration-300 ease-in-out", "transition duration-300 ease-in-out",
)} )}
filterDate={(date) => filterDate={(date) =>
moment(date).isAfter(new Date()) && moment(date).isAfter(new Date()) &&
(user?.subscriptionExpirationDate ? moment(date).isBefore(user?.subscriptionExpirationDate) : true) (user?.subscriptionExpirationDate ? moment(date).isBefore(user?.subscriptionExpirationDate) : true)
} }
dateFormat="dd/MM/yyyy" dateFormat="dd/MM/yyyy"
selected={expiryDate} selected={expiryDate}
onChange={(date) => setExpiryDate(date)} onChange={(date) => setExpiryDate(date)}
/> />
)} )}
</> </>
)} )}
</div> </div>
</div> </div>
<Button onClick={createUser} isLoading={isLoading} disabled={(isExpiryDateEnabled ? !expiryDate : false) || isLoading}> <Button onClick={createUser} isLoading={isLoading} disabled={(isExpiryDateEnabled ? !expiryDate : false) || isLoading}>
Create User Create User
</Button> </Button>
</div> </div>
); );
} }

View File

@@ -19,5 +19,9 @@ async function get(req: NextApiRequest, res: NextApiResponse) {
return res.status(403).json({ ok: false }); return res.status(403).json({ ok: false });
} }
return res.status(200).json(await getApprovalWorkflows("active-workflows")); const entityIdsString = req.query.entityIds as string;
}
const entityIdsArray = entityIdsString.split(",");
return res.status(200).json(await getApprovalWorkflows("active-workflows", entityIdsArray));
}

View File

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

View File

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

View File

@@ -1,7 +1,7 @@
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
import { Module } from "@/interfaces"; import { Module } from "@/interfaces";
import { Exam, ExamBase, InstructorGender, Variant } from "@/interfaces/exam"; import { Exam, ExamBase, InstructorGender, Variant } from "@/interfaces/exam";
import { createApprovalWorkflowsOnExamCreation } from "@/lib/createWorkflowsOnExamCreation"; import { createApprovalWorkflowOnExamCreation } from "@/lib/createWorkflowsOnExamCreation";
import client from "@/lib/mongodb"; import client from "@/lib/mongodb";
import { sessionOptions } from "@/lib/session"; import { sessionOptions } from "@/lib/session";
import { mapBy } from "@/utils"; import { mapBy } from "@/utils";
@@ -10,6 +10,7 @@ import { getApprovalWorkflowsByExamId, updateApprovalWorkflows } from "@/utils/a
import { generateExamDifferences } from "@/utils/exam.differences"; import { generateExamDifferences } from "@/utils/exam.differences";
import { getExams } from "@/utils/exams.be"; import { getExams } from "@/utils/exams.be";
import { isAdmin } from "@/utils/users"; import { isAdmin } from "@/utils/users";
import { access } from "fs";
import { withIronSessionApiRoute } from "iron-session/next"; import { withIronSessionApiRoute } from "iron-session/next";
import type { NextApiRequest, NextApiResponse } from "next"; import type { NextApiRequest, NextApiResponse } from "next";
@@ -48,10 +49,11 @@ async function POST(req: NextApiRequest, res: NextApiResponse) {
const { module } = req.query as { module: string }; const { module } = req.query as { module: string };
const session = client.startSession(); const session = client.startSession();
const entities = isAdmin(user) ? [] : mapBy(user.entities, "id"); // might need to change this with new approval workflows logic.. if an admin creates an exam no workflow is started because workflows must have entities configured. const entities = isAdmin(user) ? [] : mapBy(user.entities, "id");
try { try {
const exam = { const exam = {
access: "public", // default access is public
...req.body, ...req.body,
module: module, module: module,
entities, entities,
@@ -76,6 +78,10 @@ async function POST(req: NextApiRequest, res: NextApiResponse) {
throw new Error("Name already exists"); throw new Error("Name already exists");
} }
if (exam.requiresApproval === true) {
exam.access = "confidential";
}
await db.collection(module).updateOne( await db.collection(module).updateOne(
{ id: req.body.id }, { id: req.body.id },
{ $set: { id: req.body.id, ...exam } }, { $set: { id: req.body.id, ...exam } },
@@ -88,37 +94,45 @@ async function POST(req: NextApiRequest, res: NextApiResponse) {
// if it doesn't enter the next if condition it means the exam was updated and not created, so we can send this response. // if it doesn't enter the next if condition it means the exam was updated and not created, so we can send this response.
responseStatus = 200; responseStatus = 200;
responseMessage = `Successfully updated exam with ID: "${exam.id}"`; responseMessage = `Successfully updated exam with ID: "${exam.id}"`;
// TODO maybe find a way to start missing approval workflows in case they were only configured after exam creation.
// create workflow only if exam is being created for the first time // create workflow only if exam is being created for the first time
if (docSnap === null) { if (docSnap === null) {
try { try {
const { successCount, totalCount } = await createApprovalWorkflowsOnExamCreation(exam.createdBy, exam.entities, exam.id, module); if (exam.requiresApproval === false) {
if (successCount === totalCount) {
responseStatus = 200; responseStatus = 200;
responseMessage = `Successfully created exam "${exam.id}" and started its Approval Workflow(s)`; responseMessage = `Successfully created exam "${exam.id}" and skipped Approval Workflow due to user request.`;
} else if (successCount > 0) { } else if (isAdmin(user)) {
responseStatus = 207; responseStatus = 200;
responseMessage = `Successfully created exam with ID: "${exam.id}" but was not able to start/find an Approval Workflow for all the author's entities`; responseMessage = `Successfully created exam "${exam.id}" and skipped Approval Workflow due to admin rights.`;
} else { } else {
responseStatus = 207; const { successCount, totalCount } = await createApprovalWorkflowOnExamCreation(exam.createdBy, exam.entities, exam.id, module);
responseMessage = `Successfully created exam with ID: "${exam.id}" but was not able to find any configured Approval Workflow for the author.`;
if (successCount === totalCount) {
responseStatus = 200;
responseMessage = `Successfully created exam "${exam.id}" and started its Approval Workflow.`;
} else if (successCount > 0) {
responseStatus = 207;
responseMessage = `Successfully created exam with ID: "${exam.id}" but was not able to start/find an Approval Workflow for all the author's entities.`;
} else {
responseStatus = 207;
responseMessage = `Successfully created exam with ID: "${exam.id}" but skipping approval process because no approval workflow was found configured for the exam author.`;
}
} }
} catch (error) { } catch (error) {
console.error("Workflow creation error:", error); console.error("Workflow creation error:", error);
responseStatus = 207; responseStatus = 207;
responseMessage = `Successfully created exam with ID: "${exam.id}" but something went wrong while creating the Approval Workflow(s).`; responseMessage = `Successfully created exam with ID: "${exam.id}" but something went wrong while creating the Approval Workflow(s).`;
} }
} else { // if exam was updated, log the updates } else {
// if exam was updated, log the updates
const approvalWorkflows = await getApprovalWorkflowsByExamId(exam.id); const approvalWorkflows = await getApprovalWorkflowsByExamId(exam.id);
if (approvalWorkflows) { if (approvalWorkflows) {
const differences = generateExamDifferences(docSnap as Exam, exam as Exam); const differences = generateExamDifferences(docSnap as Exam, exam as Exam);
if (differences) { if (differences) {
approvalWorkflows.forEach((workflow) => { approvalWorkflows.forEach((workflow) => {
const currentStepIndex = workflow.steps.findIndex(step => !step.completed || step.rejected); const currentStepIndex = workflow.steps.findIndex((step) => !step.completed || step.rejected);
if (workflow.steps[currentStepIndex].examChanges === undefined) { if (workflow.steps[currentStepIndex].examChanges === undefined) {
workflow.steps[currentStepIndex].examChanges = [...differences]; workflow.steps[currentStepIndex].examChanges = [...differences];
} else { } else {
@@ -129,7 +143,7 @@ async function POST(req: NextApiRequest, res: NextApiResponse) {
} }
} }
} }
res.status(responseStatus).json({ res.status(responseStatus).json({
message: responseMessage, message: responseMessage,
}); });

View File

@@ -1,11 +1,13 @@
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction // 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 client from "@/lib/mongodb";
import {withIronSessionApiRoute} from "iron-session/next"; import { withIronSessionApiRoute } from "iron-session/next";
import {sessionOptions} from "@/lib/session"; import { sessionOptions } from "@/lib/session";
import {flatten} from "lodash"; import { flatten, map } from "lodash";
import {Exam} from "@/interfaces/exam"; import { AccessType, Exam } from "@/interfaces/exam";
import {MODULE_ARRAY} from "@/utils/moduleUtils"; import { MODULE_ARRAY } from "@/utils/moduleUtils";
import { requestUser } from "../../../utils/api";
import { mapBy } from "../../../utils";
const db = client.db(process.env.MONGODB_DB); const db = client.db(process.env.MONGODB_DB);
@@ -14,17 +16,37 @@ export default withIronSessionApiRoute(handler, sessionOptions);
async function handler(req: NextApiRequest, res: NextApiResponse) { async function handler(req: NextApiRequest, res: NextApiResponse) {
if (req.method === "GET") return await GET(req, res); 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) { async function GET(req: NextApiRequest, res: NextApiResponse) {
if (!req.session.user) { if (!req.session.user) {
res.status(401).json({ok: false}); res.status(401).json({ ok: false });
return; 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 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) => ({ return snapshot.map((doc) => ({
...doc, ...doc,

View File

@@ -58,7 +58,13 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res, params }
const allAssigneeIds: string[] = [ const allAssigneeIds: string[] = [
...new Set( ...new Set(
workflow.steps workflow.steps
.map(step => step.assignees) .map((step) => {
const assignees = step.assignees;
if (step.completedBy) {
assignees.push(step.completedBy);
}
return assignees;
})
.flat() .flat()
) )
]; ];
@@ -144,7 +150,7 @@ export default function Home({ user, initialWorkflow, id, workflowAssignees, wor
const handleApproveStep = () => { const handleApproveStep = () => {
const isLastStep = (selectedStepIndex + 1 === currentWorkflow.steps.length); const isLastStep = (selectedStepIndex + 1 === currentWorkflow.steps.length);
if (isLastStep) { if (isLastStep) {
if (!confirm(`Are you sure you want to approve the last step? Doing so will approve the exam.`)) return; if (!confirm(`Are you sure you want to approve the last step? Doing so will change the access type of the exam from confidential to private.`)) return;
} }
const updatedWorkflow: ApprovalWorkflow = { const updatedWorkflow: ApprovalWorkflow = {
@@ -186,7 +192,7 @@ export default function Home({ user, initialWorkflow, id, workflowAssignees, wor
const examId = currentWorkflow.examId; const examId = currentWorkflow.examId;
axios axios
.patch(`/api/exam/${examModule}/${examId}`, { isDiagnostic: false }) .patch(`/api/exam/${examModule}/${examId}`, { access: "private" })
.then(() => toast.success(`The exam was successfuly approved and this workflow has been completed.`)) .then(() => toast.success(`The exam was successfuly approved and this workflow has been completed.`))
.catch((reason) => { .catch((reason) => {
if (reason.response.status === 404) { if (reason.response.status === 404) {
@@ -551,7 +557,7 @@ export default function Home({ user, initialWorkflow, id, workflowAssignees, wor
<div className="p-3 border border-gray-300 rounded-xl bg-white bg-opacity-80 overflow-y-auto max-h-40"> <div className="p-3 border border-gray-300 rounded-xl bg-white bg-opacity-80 overflow-y-auto max-h-40">
{currentWorkflow.steps[selectedStepIndex].examChanges?.length ? ( {currentWorkflow.steps[selectedStepIndex].examChanges?.length ? (
currentWorkflow.steps[selectedStepIndex].examChanges!.map((change, index) => ( currentWorkflow.steps[selectedStepIndex].examChanges!.map((change, index) => (
<p key={index} className="text-sm text-gray-500 mb-2"> <p key={index} className="whitespace-pre-wrap text-sm text-gray-500 mb-2">
{change} {change}
</p> </p>
)) ))

View File

@@ -1,24 +1,22 @@
import Tip from "@/components/ApprovalWorkflows/Tip"; import Tip from "@/components/ApprovalWorkflows/Tip";
import Layout from "@/components/High/Layout";
import Button from "@/components/Low/Button"; import Button from "@/components/Low/Button";
import Input from "@/components/Low/Input"; import Input from "@/components/Low/Input";
import Select from "@/components/Low/Select"; import Select from "@/components/Low/Select";
import useApprovalWorkflows from "@/hooks/useApprovalWorkflows"; import useApprovalWorkflows from "@/hooks/useApprovalWorkflows";
import { useAllowedEntities, useAllowedEntitiesSomePermissions, useEntityPermission } from "@/hooks/useEntityPermissions";
import { Module, ModuleTypeLabels } from "@/interfaces"; import { Module, ModuleTypeLabels } from "@/interfaces";
import { ApprovalWorkflow, ApprovalWorkflowStatus, ApprovalWorkflowStatusLabel, StepTypeLabel } from "@/interfaces/approval.workflow"; import { ApprovalWorkflow, ApprovalWorkflowStatus, ApprovalWorkflowStatusLabel, StepTypeLabel } from "@/interfaces/approval.workflow";
import { Entity, EntityWithRoles } from "@/interfaces/entity"; import { EntityWithRoles } from "@/interfaces/entity";
import { User } from "@/interfaces/user"; import { User } from "@/interfaces/user";
import { sessionOptions } from "@/lib/session"; import { sessionOptions } from "@/lib/session";
import { mapBy, redirect, serialize } from "@/utils"; import { mapBy, redirect, serialize } from "@/utils";
import { requestUser } from "@/utils/api"; import { requestUser } from "@/utils/api";
import { getApprovalWorkflows } from "@/utils/approval.workflows.be"; import { getApprovalWorkflows } from "@/utils/approval.workflows.be";
import { getEntities, getEntitiesWithRoles } from "@/utils/entities.be"; import { getEntitiesWithRoles } from "@/utils/entities.be";
import { shouldRedirectHome } from "@/utils/navigation.disabled"; import { shouldRedirectHome } from "@/utils/navigation.disabled";
import { doesEntityAllow, findAllowedEntities } from "@/utils/permissions"; import { doesEntityAllow, findAllowedEntities } from "@/utils/permissions";
import { isAdmin } from "@/utils/users"; import { isAdmin } from "@/utils/users";
import { getSpecificUsers } from "@/utils/users.be"; import { getSpecificUsers } from "@/utils/users.be";
import { createColumnHelper, flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table"; import { createColumnHelper, flexRender, getCoreRowModel, useReactTable, getPaginationRowModel } from "@tanstack/react-table";
import axios from "axios"; import axios from "axios";
import clsx from "clsx"; import clsx from "clsx";
import { withIronSessionSsr } from "iron-session/next"; import { withIronSessionSsr } from "iron-session/next";
@@ -69,7 +67,11 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => {
if (shouldRedirectHome(user) || !["admin", "developer", "teacher", "corporate", "mastercorporate"].includes(user.type)) return redirect("/"); if (shouldRedirectHome(user) || !["admin", "developer", "teacher", "corporate", "mastercorporate"].includes(user.type)) return redirect("/");
const workflows = await getApprovalWorkflows("active-workflows"); const entityIDS = mapBy(user.entities, "id");
const entities = await getEntitiesWithRoles(isAdmin(user) ? undefined : entityIDS);
const allowedEntities = findAllowedEntities(user, entities, "view_workflows");
const workflows = await getApprovalWorkflows("active-workflows", allowedEntities.map(entity => entity.id));
const allAssigneeIds: string[] = [ const allAssigneeIds: string[] = [
...new Set( ...new Set(
@@ -81,10 +83,6 @@ export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => {
) )
]; ];
const entityIDS = mapBy(user.entities, "id");
const entities = await getEntitiesWithRoles(isAdmin(user) ? undefined : entityIDS);
const allowedEntities = findAllowedEntities(user, entities, "view_workflows");
return { return {
props: serialize({ props: serialize({
user, user,
@@ -103,7 +101,8 @@ interface Props {
} }
export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAssignees, userEntitiesWithLabel }: Props) { export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAssignees, userEntitiesWithLabel }: Props) {
const { workflows, reload } = useApprovalWorkflows(); const entitiesString = userEntitiesWithLabel.map(entity => entity.id).join(",");
const { workflows, reload } = useApprovalWorkflows(entitiesString);
const currentWorkflows = workflows || initialWorkflows; const currentWorkflows = workflows || initialWorkflows;
const [filteredWorkflows, setFilteredWorkflows] = useState<ApprovalWorkflow[]>([]); const [filteredWorkflows, setFilteredWorkflows] = useState<ApprovalWorkflow[]>([]);
@@ -191,7 +190,15 @@ export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAss
{info.getValue().map((module: Module, index: number) => ( {info.getValue().map((module: Module, index: number) => (
<span <span
key={index} key={index}
className="inline-block rounded-full px-3 py-1 text-sm font-medium bg-indigo-100 border border-indigo-300 text-indigo-900"> /* className="inline-block rounded-full px-3 py-1 text-sm font-medium bg-indigo-100 border border-indigo-300 text-indigo-900"> */
className={clsx("inline-block rounded-full px-3 py-1 text-sm font-medium text-white",
module === "speaking" ? "bg-ielts-speaking" :
module === "reading" ? "bg-ielts-reading" :
module === "writing" ? "bg-ielts-writing" :
module === "listening" ? "bg-ielts-listening" :
module === "level" ? "bg-ielts-level" :
"bg-slate-700"
)}>
{ModuleTypeLabels[module]} {ModuleTypeLabels[module]}
</span> </span>
))} ))}
@@ -296,10 +303,20 @@ export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAss
}), }),
]; ];
const [pagination, setPagination] = useState({
pageIndex: 0,
pageSize: 10,
});
const table = useReactTable({ const table = useReactTable({
data: filteredWorkflows, data: filteredWorkflows,
columns: columns, columns: columns,
state: {
pagination,
},
onPaginationChange: setPagination,
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
getPaginationRowModel: getPaginationRowModel(),
}); });
return ( return (
@@ -395,6 +412,43 @@ export default function ApprovalWorkflows({ user, initialWorkflows, workflowsAss
))} ))}
</tbody> </tbody>
</table> </table>
<div className="mt-2 flex flex-row gap-2 w-full justify-end items-center">
<button
onClick={() => table.setPageIndex(0)}
disabled={!table.getCanPreviousPage()}
className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light
bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
>
{"<<"}
</button>
<button
onClick={() => table.previousPage()}
disabled={!table.getCanPreviousPage()}
className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light
bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
>
{"<"}
</button>
<span className="px-4 text-sm font-medium">
Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount()}
</span>
<button
onClick={() => table.nextPage()}
disabled={!table.getCanNextPage()}
className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light
bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
>
{">"}
</button>
<button
onClick={() => table.setPageIndex(table.getPageCount() - 1)}
disabled={!table.getCanNextPage()}
className="px-3 py-2 rounded-md text-sm font-semibold text-mti-purple-ultradark border border-mti-purple-light
bg-white hover:bg-mti-purple-light hover:text-white transition-colors disabled:opacity-50 disabled:cursor-not-allowed"
>
{">>"}
</button>
</div>
</div> </div>
</> </>
); );

View File

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

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] 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 = () => { const removeParticipants = () => {
if (selectedUsers.length === 0) return; if (selectedUsers.length === 0) return;
if (!canRemoveParticipants) return; if (!canRemoveParticipants) return;
@@ -428,6 +443,25 @@ export default function Home({ user, group, users, entity }: Props) {
{capitalize(type)} {capitalize(type)}
</button> </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> </div>
</section> </section>

View File

@@ -1,269 +1,216 @@
/* eslint-disable @next/next/no-img-element */ /* eslint-disable @next/next/no-img-element */
import UserDisplayList from "@/components/UserDisplayList"; import UserDisplayList from "@/components/UserDisplayList";
import IconCard from "@/components/IconCard"; import IconCard from "@/components/IconCard";
import { useAllowedEntities } from "@/hooks/useEntityPermissions"; import {useAllowedEntities} from "@/hooks/useEntityPermissions";
import { EntityWithRoles } from "@/interfaces/entity"; import {EntityWithRoles} from "@/interfaces/entity";
import { Stat, StudentUser, Type, User } from "@/interfaces/user"; import {Stat, StudentUser, Type, User} from "@/interfaces/user";
import { sessionOptions } from "@/lib/session"; import {sessionOptions} from "@/lib/session";
import { filterBy, mapBy, redirect, serialize } from "@/utils"; import {filterBy, mapBy, redirect, serialize} from "@/utils";
import { requestUser } from "@/utils/api"; import {requestUser} from "@/utils/api";
import { countEntitiesAssignments } from "@/utils/assignments.be"; import {countEntitiesAssignments} from "@/utils/assignments.be";
import { getEntitiesWithRoles } from "@/utils/entities.be"; import {getEntitiesWithRoles} from "@/utils/entities.be";
import { countGroupsByEntities } from "@/utils/groups.be"; import {countGroupsByEntities} from "@/utils/groups.be";
import { import {checkAccess, groupAllowedEntitiesByPermissions} from "@/utils/permissions";
checkAccess, import {groupByExam} from "@/utils/stats";
groupAllowedEntitiesByPermissions, import {countAllowedUsers, getUsers} from "@/utils/users.be";
} from "@/utils/permissions"; import {clsx} from "clsx";
import { groupByExam } from "@/utils/stats"; import {withIronSessionSsr} from "iron-session/next";
import { countAllowedUsers, getUsers } from "@/utils/users.be";
import { clsx } from "clsx";
import { withIronSessionSsr } from "iron-session/next";
import moment from "moment"; import moment from "moment";
import Head from "next/head"; import Head from "next/head";
import { useRouter } from "next/router"; import {useRouter} from "next/router";
import { useMemo } from "react"; import {useMemo} from "react";
import { import {BsBank, BsClock, BsEnvelopePaper, BsPencilSquare, BsPeople, BsPeopleFill, BsPersonFill, BsPersonFillGear} from "react-icons/bs";
BsBank, import {ToastContainer} from "react-toastify";
BsClock, import {isAdmin} from "@/utils/users";
BsEnvelopePaper,
BsPencilSquare,
BsPeople,
BsPeopleFill,
BsPersonFill,
BsPersonFillGear,
} from "react-icons/bs";
import { ToastContainer } from "react-toastify";
import { isAdmin } from "@/utils/users";
interface Props { interface Props {
user: User; user: User;
students: StudentUser[]; students: StudentUser[];
latestStudents: User[]; latestStudents: User[];
latestTeachers: User[]; latestTeachers: User[];
userCounts: { [key in Type]: number }; userCounts: {[key in Type]: number};
entities: EntityWithRoles[]; entities: EntityWithRoles[];
assignmentsCount: number; assignmentsCount: number;
stats: Stat[]; stats: Stat[];
groupsCount: number; groupsCount: number;
} }
export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => { export const getServerSideProps = withIronSessionSsr(async ({req, res}) => {
const user = await requestUser(req, res); const user = await requestUser(req, res);
if (!user || !user.isVerified) return redirect("/login"); if (!user || !user.isVerified) return redirect("/login");
if (!checkAccess(user, ["admin", "developer", "mastercorporate"])) if (!checkAccess(user, ["admin", "developer", "mastercorporate"])) return redirect("/");
return redirect("/");
const entityIDS = mapBy(user.entities, "id") || []; const entityIDS = mapBy(user.entities, "id") || [];
const entities = await getEntitiesWithRoles( const entities = await getEntitiesWithRoles(isAdmin(user) ? undefined : entityIDS);
isAdmin(user) ? undefined : entityIDS const {["view_students"]: allowedStudentEntities, ["view_teachers"]: allowedTeacherEntities} = groupAllowedEntitiesByPermissions(user, entities, [
); "view_students",
const { "view_teachers",
["view_students"]: allowedStudentEntities, ]);
["view_teachers"]: allowedTeacherEntities,
} = groupAllowedEntitiesByPermissions(user, entities, [
"view_students",
"view_teachers",
]);
const allowedStudentEntitiesIDS = mapBy(allowedStudentEntities, "id"); const allowedStudentEntitiesIDS = mapBy(allowedStudentEntities, "id");
const entitiesIDS = mapBy(entities, "id") || []; const entitiesIDS = mapBy(entities, "id") || [];
const [ const [students, latestStudents, latestTeachers, userCounts, assignmentsCount, groupsCount] = await Promise.all([
students, getUsers(
latestStudents, {type: "student", "entities.id": {$in: allowedStudentEntitiesIDS}},
latestTeachers, 10,
userCounts, {averageLevel: -1},
assignmentsCount, {_id: 0, id: 1, name: 1, email: 1, profilePicture: 1},
groupsCount, ),
] = await Promise.all([ getUsers(
getUsers( {type: "student", "entities.id": {$in: allowedStudentEntitiesIDS}},
{ type: "student", "entities.id": { $in: allowedStudentEntitiesIDS } }, 10,
10, {registrationDate: -1},
{ averageLevel: -1 }, {_id: 0, id: 1, name: 1, email: 1, profilePicture: 1},
{ _id: 0, id: 1, name: 1, email: 1, profilePicture: 1 } ),
), getUsers(
getUsers( {
{ type: "student", "entities.id": { $in: allowedStudentEntitiesIDS } }, type: "teacher",
10, "entities.id": {$in: mapBy(allowedTeacherEntities, "id")},
{ registrationDate: -1 }, },
{ _id: 0, id: 1, name: 1, email: 1, profilePicture: 1 } 10,
), {registrationDate: -1},
getUsers( {_id: 0, id: 1, name: 1, email: 1, profilePicture: 1},
{ ),
type: "teacher", countAllowedUsers(user, entities),
"entities.id": { $in: mapBy(allowedTeacherEntities, "id") }, countEntitiesAssignments(entitiesIDS, {archived: {$ne: true}}),
}, countGroupsByEntities(entitiesIDS),
10, ]);
{ registrationDate: -1 },
{ _id: 0, id: 1, name: 1, email: 1, profilePicture: 1 }
),
countAllowedUsers(user, entities),
countEntitiesAssignments(entitiesIDS, { archived: { $ne: true } }),
countGroupsByEntities(entitiesIDS),
]);
return { return {
props: serialize({ props: serialize({
user, user,
students, students,
latestStudents, latestStudents,
latestTeachers, latestTeachers,
userCounts, userCounts,
entities, entities,
assignmentsCount, assignmentsCount,
groupsCount, groupsCount,
}), }),
}; };
}, sessionOptions); }, sessionOptions);
export default function Dashboard({ export default function Dashboard({
user, user,
students, students,
latestStudents, latestStudents,
latestTeachers, latestTeachers,
userCounts, userCounts,
entities, entities,
assignmentsCount, assignmentsCount,
stats = [], stats = [],
groupsCount, groupsCount,
}: Props) { }: Props) {
const totalCount = useMemo(() => userCounts.corporate + userCounts.mastercorporate + userCounts.student + userCounts.teacher, [userCounts]);
const totalCount = useMemo(
() =>
userCounts.corporate +
userCounts.mastercorporate +
userCounts.student +
userCounts.teacher,
[userCounts]
);
const totalLicenses = useMemo( const totalLicenses = useMemo(() => entities.reduce((acc, curr) => acc + parseInt(curr.licenses.toString()), 0), [entities]);
() =>
entities.reduce(
(acc, curr) => acc + parseInt(curr.licenses.toString()),
0
),
[entities]
);
const router = useRouter(); const router = useRouter();
const allowedEntityStatistics = useAllowedEntities( const allowedEntityStatistics = useAllowedEntities(user, entities, "view_entity_statistics");
user, const allowedStudentPerformance = useAllowedEntities(user, entities, "view_student_performance");
entities,
"view_entity_statistics"
);
const allowedStudentPerformance = useAllowedEntities(
user,
entities,
"view_student_performance"
);
return ( return (
<> <>
<Head> <Head>
<title>EnCoach</title> <title>EnCoach</title>
<meta <meta
name="description" name="description"
content="A training platform for the IELTS exam provided by the Muscat Training Institute and developed by eCrop." content="A training platform for the IELTS exam provided by the Muscat Training Institute and developed by eCrop."
/> />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
</Head> </Head>
<ToastContainer /> <ToastContainer />
<> <>
<section className="grid grid-cols-5 place-items-center -md:grid-cols-2 gap-4 text-center"> <section className="grid grid-cols-5 place-items-center -md:grid-cols-2 gap-4 text-center">
<IconCard <IconCard
onClick={() => router.push("/users?type=student")} onClick={() => router.push("/users?type=student")}
Icon={BsPersonFill} Icon={BsPersonFill}
label="Students" label="Students"
value={userCounts.student} value={userCounts.student}
color="purple" color="purple"
/> />
<IconCard <IconCard
onClick={() => router.push("/users?type=teacher")} onClick={() => router.push("/users?type=teacher")}
Icon={BsPencilSquare} Icon={BsPencilSquare}
label="Teachers" label="Teachers"
value={userCounts.teacher} value={userCounts.teacher}
color="purple" color="purple"
/> />
<IconCard <IconCard
onClick={() => router.push("/users?type=corporate")} onClick={() => router.push("/users?type=corporate")}
Icon={BsBank} Icon={BsBank}
label="Corporate Accounts" label="Corporate Accounts"
value={userCounts.corporate} value={userCounts.corporate}
color="purple" color="purple"
/> />
<IconCard <IconCard
Icon={BsPeople} Icon={BsBank}
onClick={() => router.push("/classrooms")} onClick={() => router.push("/users?type=mastercorporate")}
label="Classrooms" label="Master Corporates"
value={groupsCount} value={userCounts.mastercorporate}
color="purple" color="purple"
/> />
<IconCard <IconCard Icon={BsPeople} onClick={() => router.push("/classrooms")} label="Classrooms" value={groupsCount} color="purple" />
Icon={BsPeopleFill} <IconCard
onClick={() => router.push("/entities")} Icon={BsPeopleFill}
label="Entities" onClick={() => router.push("/entities")}
value={`${entities.length} - ${totalCount}/${totalLicenses}`} label="Entities"
color="purple" value={`${entities.length} - ${totalCount}/${totalLicenses}`}
/> color="purple"
{allowedStudentPerformance.length > 0 && ( />
<IconCard {allowedStudentPerformance.length > 0 && (
Icon={BsPersonFillGear} <IconCard
onClick={() => router.push("/users/performance")} Icon={BsPersonFillGear}
label="Student Performance" onClick={() => router.push("/users/performance")}
value={userCounts.student} label="Student Performance"
color="purple" value={userCounts.student}
/> color="purple"
)} />
{allowedEntityStatistics.length > 0 && ( )}
<IconCard {allowedEntityStatistics.length > 0 && (
Icon={BsPersonFillGear} <IconCard
onClick={() => router.push("/statistical")} Icon={BsPersonFillGear}
label="Entity Statistics" onClick={() => router.push("/statistical")}
value={allowedEntityStatistics.length} label="Entity Statistics"
color="purple" value={allowedEntityStatistics.length}
/> color="purple"
)} />
<IconCard )}
Icon={BsEnvelopePaper} <IconCard
onClick={() => router.push("/assignments")} Icon={BsEnvelopePaper}
label="Assignments" onClick={() => router.push("/assignments")}
value={assignmentsCount} label="Assignments"
className={clsx( value={assignmentsCount}
allowedEntityStatistics.length === 0 && "col-span-2" className={clsx(allowedEntityStatistics.length === 0 && "col-span-2")}
)} color="purple"
color="purple" />
/> <IconCard
<IconCard Icon={BsClock}
Icon={BsClock} label="Expiration Date"
label="Expiration Date" value={user.subscriptionExpirationDate ? moment(user.subscriptionExpirationDate).format("DD/MM/yyyy") : "Unlimited"}
value={ color="rose"
user.subscriptionExpirationDate />
? moment(user.subscriptionExpirationDate).format("DD/MM/yyyy") </section>
: "Unlimited"
}
color="rose"
/>
</section>
<section className="grid grid-cols-1 md:grid-cols-2 gap-4 w-full justify-between"> <section className="grid grid-cols-1 md:grid-cols-2 gap-4 w-full justify-between">
<UserDisplayList users={latestStudents} title="Latest Students" /> <UserDisplayList users={latestStudents} title="Latest Students" />
<UserDisplayList users={latestTeachers} title="Latest Teachers" /> <UserDisplayList users={latestTeachers} title="Latest Teachers" />
<UserDisplayList users={students} title="Highest level students" /> <UserDisplayList users={students} title="Highest level students" />
<UserDisplayList <UserDisplayList
users={students.sort( users={students.sort(
(a, b) => (a, b) =>
Object.keys(groupByExam(filterBy(stats, "user", b))).length - Object.keys(groupByExam(filterBy(stats, "user", b))).length -
Object.keys(groupByExam(filterBy(stats, "user", a))).length Object.keys(groupByExam(filterBy(stats, "user", a))).length,
)} )}
title="Highest exam count students" title="Highest exam count students"
/> />
</section> </section>
</> </>
</> </>
); );
} }

View File

@@ -63,6 +63,9 @@ const EXAM_MANAGEMENT: PermissionLayout[] = [
{label: "Generate Level", key: "generate_level"}, {label: "Generate Level", key: "generate_level"},
{label: "Delete Level", key: "delete_level"}, {label: "Delete Level", key: "delete_level"},
{label: "Set as Private/Public", key: "update_exam_privacy"}, {label: "Set as Private/Public", key: "update_exam_privacy"},
{label: "View Confidential Exams", key: "view_confidential_exams"},
{label: "Create Confidential Exams", key: "create_confidential_exams"},
{label: "Create Public Exams", key: "create_public_exams"},
{label: "View Statistics", key: "view_statistics"}, {label: "View Statistics", key: "view_statistics"},
]; ];

View File

@@ -1,268 +1,201 @@
/* eslint-disable @next/next/no-img-element */ /* eslint-disable @next/next/no-img-element */
import Head from "next/head"; import Head from "next/head";
import { withIronSessionSsr } from "iron-session/next"; import {withIronSessionSsr} from "iron-session/next";
import { sessionOptions } from "@/lib/session"; import {sessionOptions} from "@/lib/session";
import { ToastContainer } from "react-toastify"; import {ToastContainer} from "react-toastify";
import CodeGenerator from "./(admin)/CodeGenerator"; import CodeGenerator from "./(admin)/CodeGenerator";
import ExamLoader from "./(admin)/ExamLoader"; import ExamLoader from "./(admin)/ExamLoader";
import Lists from "./(admin)/Lists"; import Lists from "./(admin)/Lists";
import BatchCodeGenerator from "./(admin)/BatchCodeGenerator"; import BatchCodeGenerator from "./(admin)/BatchCodeGenerator";
import { shouldRedirectHome } from "@/utils/navigation.disabled"; import {shouldRedirectHome} from "@/utils/navigation.disabled";
import BatchCreateUser from "./(admin)/Lists/BatchCreateUser"; import BatchCreateUser from "./(admin)/Lists/BatchCreateUser";
import { checkAccess, getTypesOfUser } from "@/utils/permissions"; import {checkAccess, getTypesOfUser} from "@/utils/permissions";
import { useState } from "react"; import { useState} from "react";
import Modal from "@/components/Modal"; import Modal from "@/components/Modal";
import IconCard from "@/components/IconCard"; import IconCard from "@/components/IconCard";
import { import {BsCode, BsCodeSquare, BsGearFill, BsPeopleFill, BsPersonFill} from "react-icons/bs";
BsCode,
BsCodeSquare,
BsGearFill,
BsPeopleFill,
BsPersonFill,
} from "react-icons/bs";
import UserCreator from "./(admin)/UserCreator"; import UserCreator from "./(admin)/UserCreator";
import CorporateGradingSystem from "./(admin)/CorporateGradingSystem"; import CorporateGradingSystem from "./(admin)/CorporateGradingSystem";
import { CEFR_STEPS } from "@/resources/grading"; import {CEFR_STEPS} from "@/resources/grading";
import { User } from "@/interfaces/user"; import {User} from "@/interfaces/user";
import { getUserPermissions } from "@/utils/permissions.be"; import {getUserPermissions} from "@/utils/permissions.be";
import { PermissionType } from "@/interfaces/permissions"; import {PermissionType} from "@/interfaces/permissions";
import { getUsers } from "@/utils/users.be"; import {getUsers} from "@/utils/users.be";
import { getEntitiesWithRoles } from "@/utils/entities.be"; import {getEntitiesWithRoles} from "@/utils/entities.be";
import { mapBy, serialize, redirect } from "@/utils"; import {mapBy, serialize, redirect, filterBy} from "@/utils";
import { EntityWithRoles } from "@/interfaces/entity"; import {EntityWithRoles} from "@/interfaces/entity";
import { requestUser } from "@/utils/api"; import {requestUser} from "@/utils/api";
import { isAdmin } from "@/utils/users"; import {isAdmin} from "@/utils/users";
import { import {getGradingSystemByEntities, getGradingSystemByEntity} from "@/utils/grading.be";
getGradingSystemByEntities, import {Grading} from "@/interfaces";
getGradingSystemByEntity, import {useRouter} from "next/router";
} from "@/utils/grading.be"; import {useAllowedEntities} from "@/hooks/useEntityPermissions";
import { Grading } from "@/interfaces";
import { useRouter } from "next/router";
import { useAllowedEntities } from "@/hooks/useEntityPermissions";
export const getServerSideProps = withIronSessionSsr(async ({ req, res }) => { export const getServerSideProps = withIronSessionSsr(async ({req, res}) => {
const user = await requestUser(req, res); const user = await requestUser(req, res);
if (!user) return redirect("/login"); if (!user) return redirect("/login");
if ( if (shouldRedirectHome(user) || !checkAccess(user, ["admin", "developer", "corporate", "teacher", "mastercorporate"])) return redirect("/");
shouldRedirectHome(user) || const [permissions, entities, allUsers] = await Promise.all([
!checkAccess(user, [ getUserPermissions(user.id),
"admin", isAdmin(user) ? await getEntitiesWithRoles() : await getEntitiesWithRoles(mapBy(user.entities, "id")),
"developer", getUsers(),
"corporate", ]);
"teacher", const gradingSystems = await getGradingSystemByEntities(mapBy(entities, "id"));
"mastercorporate", const entitiesGrading = entities.map(
]) (e) =>
) gradingSystems.find((g) => g.entity === e.id) || {
return redirect("/"); entity: e.id,
const [permissions, entities, allUsers] = await Promise.all([ steps: CEFR_STEPS,
getUserPermissions(user.id), },
isAdmin(user) );
? await getEntitiesWithRoles()
: await getEntitiesWithRoles(mapBy(user.entities, "id")),
getUsers(),
]);
const gradingSystems = await getGradingSystemByEntities(
mapBy(entities, "id")
);
const entitiesGrading = entities.map(
(e) =>
gradingSystems.find((g) => g.entity === e.id) || {
entity: e.id,
steps: CEFR_STEPS,
}
);
return { return {
props: serialize({ props: serialize({
user, user,
permissions, permissions,
entities, entities,
allUsers, allUsers,
entitiesGrading, entitiesGrading,
}), }),
}; };
}, sessionOptions); }, sessionOptions);
interface Props { interface Props {
user: User; user: User;
permissions: PermissionType[]; permissions: PermissionType[];
entities: EntityWithRoles[]; entities: EntityWithRoles[];
allUsers: User[]; allUsers: User[];
entitiesGrading: Grading[]; entitiesGrading: Grading[];
} }
export default function Admin({ export default function Admin({user, entities, permissions, allUsers, entitiesGrading}: Props) {
user, const [modalOpen, setModalOpen] = useState<string>();
entities, const router = useRouter();
permissions,
allUsers,
entitiesGrading,
}: Props) {
const [modalOpen, setModalOpen] = useState<string>();
const router = useRouter();
const entitiesAllowCreateUser = useAllowedEntities( const entitiesAllowCreateUser = useAllowedEntities(user, entities, "create_user");
user, const entitiesAllowCreateUsers = useAllowedEntities(user, entities, "create_user_batch");
entities, const entitiesAllowCreateCode = useAllowedEntities(user, entities, "create_code");
"create_user" const entitiesAllowCreateCodes = useAllowedEntities(user, entities, "create_code_batch");
); const entitiesAllowEditGrading = useAllowedEntities(user, entities, "edit_grading_system");
const entitiesAllowCreateUsers = useAllowedEntities(
user,
entities,
"create_user_batch"
);
const entitiesAllowCreateCode = useAllowedEntities(
user,
entities,
"create_code"
);
const entitiesAllowCreateCodes = useAllowedEntities(
user,
entities,
"create_code_batch"
);
const entitiesAllowEditGrading = useAllowedEntities(
user,
entities,
"edit_grading_system"
);
return ( return (
<> <>
<Head> <Head>
<title>Settings Panel | EnCoach</title> <title>Settings Panel | EnCoach</title>
<meta <meta
name="description" name="description"
content="A training platform for the IELTS exam provided by the Muscat Training Institute and developed by eCrop." content="A training platform for the IELTS exam provided by the Muscat Training Institute and developed by eCrop."
/> />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
</Head> </Head>
<ToastContainer /> <ToastContainer />
<> <>
<Modal <Modal isOpen={modalOpen === "batchCreateUser"} onClose={() => setModalOpen(undefined)} maxWidth="max-w-[85%]">
isOpen={modalOpen === "batchCreateUser"} <BatchCreateUser
onClose={() => setModalOpen(undefined)} user={user}
maxWidth="max-w-[85%]" entities={entitiesAllowCreateUsers.filter(
> (e) =>
<BatchCreateUser e.licenses > 0 &&
user={user} e.licenses > allUsers.filter((u) => !isAdmin(u) && (u.entities || []).some((ent) => ent.id === e.id)).length,
entities={entitiesAllowCreateUser} )}
permissions={permissions} permissions={permissions}
onFinish={() => setModalOpen(undefined)} onFinish={() => setModalOpen(undefined)}
/> />
</Modal> </Modal>
<Modal <Modal isOpen={modalOpen === "batchCreateCode"} onClose={() => setModalOpen(undefined)}>
isOpen={modalOpen === "batchCreateCode"} <BatchCodeGenerator
onClose={() => setModalOpen(undefined)} entities={entitiesAllowCreateCodes}
> user={user}
<BatchCodeGenerator users={allUsers}
entities={entitiesAllowCreateCodes} permissions={permissions}
user={user} onFinish={() => setModalOpen(undefined)}
users={allUsers} />
permissions={permissions} </Modal>
onFinish={() => setModalOpen(undefined)} <Modal isOpen={modalOpen === "createCode"} onClose={() => setModalOpen(undefined)}>
/> <CodeGenerator
</Modal> entities={entitiesAllowCreateCode}
<Modal user={user}
isOpen={modalOpen === "createCode"} permissions={permissions}
onClose={() => setModalOpen(undefined)} onFinish={() => setModalOpen(undefined)}
> />
<CodeGenerator </Modal>
entities={entitiesAllowCreateCode} <Modal isOpen={modalOpen === "createUser"} onClose={() => setModalOpen(undefined)}>
user={user} <UserCreator
permissions={permissions} user={user}
onFinish={() => setModalOpen(undefined)} entities={entitiesAllowCreateUser.filter(
/> (e) =>
</Modal> e.licenses > 0 &&
<Modal e.licenses > allUsers.filter((u) => !isAdmin(u) && (u.entities || []).some((ent) => ent.id === e.id)).length,
isOpen={modalOpen === "createUser"} )}
onClose={() => setModalOpen(undefined)} users={allUsers}
> permissions={permissions}
<UserCreator onFinish={() => setModalOpen(undefined)}
user={user} />
entities={entitiesAllowCreateUsers} </Modal>
users={allUsers} <Modal isOpen={modalOpen === "gradingSystem"} onClose={() => setModalOpen(undefined)}>
permissions={permissions} <CorporateGradingSystem
onFinish={() => setModalOpen(undefined)} user={user}
/> entitiesGrading={entitiesGrading}
</Modal> entities={entitiesAllowEditGrading}
<Modal mutate={() => router.replace(router.asPath)}
isOpen={modalOpen === "gradingSystem"} />
onClose={() => setModalOpen(undefined)} </Modal>
>
<CorporateGradingSystem
user={user}
entitiesGrading={entitiesGrading}
entities={entitiesAllowEditGrading}
mutate={() => router.replace(router.asPath)}
/>
</Modal>
<section className="w-full grid grid-cols-2 -md:grid-cols-1 gap-8"> <section className="w-full grid grid-cols-2 -md:grid-cols-1 gap-8">
<ExamLoader /> <ExamLoader />
{checkAccess( {checkAccess(user, getTypesOfUser(["teacher"]), permissions, "viewCodes") && (
user, <div className="w-full grid grid-cols-2 gap-4">
getTypesOfUser(["teacher"]), <IconCard
permissions, Icon={BsCode}
"viewCodes" label="Generate Single Code"
) && ( color="purple"
<div className="w-full grid grid-cols-2 gap-4"> className="w-full h-full"
<IconCard onClick={() => setModalOpen("createCode")}
Icon={BsCode} disabled={entitiesAllowCreateCode.length === 0}
label="Generate Single Code" />
color="purple" <IconCard
className="w-full h-full" Icon={BsCodeSquare}
onClick={() => setModalOpen("createCode")} label="Generate Codes in Batch"
disabled={entitiesAllowCreateCode.length === 0} color="purple"
/> className="w-full h-full"
<IconCard onClick={() => setModalOpen("batchCreateCode")}
Icon={BsCodeSquare} disabled={entitiesAllowCreateCodes.length === 0}
label="Generate Codes in Batch" />
color="purple" <IconCard
className="w-full h-full" Icon={BsPersonFill}
onClick={() => setModalOpen("batchCreateCode")} label="Create Single User"
disabled={entitiesAllowCreateCodes.length === 0} color="purple"
/> className="w-full h-full"
<IconCard onClick={() => setModalOpen("createUser")}
Icon={BsPersonFill} disabled={entitiesAllowCreateUser.length === 0}
label="Create Single User" />
color="purple" <IconCard
className="w-full h-full" Icon={BsPeopleFill}
onClick={() => setModalOpen("createUser")} label="Create Users in Batch"
disabled={entitiesAllowCreateUser.length === 0} color="purple"
/> className="w-full h-full"
<IconCard onClick={() => setModalOpen("batchCreateUser")}
Icon={BsPeopleFill} disabled={entitiesAllowCreateUsers.length === 0}
label="Create Users in Batch" />
color="purple" {checkAccess(user, ["admin", "corporate", "developer", "mastercorporate"]) && (
className="w-full h-full" <IconCard
onClick={() => setModalOpen("batchCreateUser")} Icon={BsGearFill}
disabled={entitiesAllowCreateUsers.length === 0} label="Grading System"
/> color="purple"
{checkAccess(user, [ className="w-full h-full col-span-2"
"admin", onClick={() => setModalOpen("gradingSystem")}
"corporate", disabled={entitiesAllowEditGrading.length === 0}
"developer", />
"mastercorporate", )}
]) && ( </div>
<IconCard )}
Icon={BsGearFill} </section>
label="Grading System" <section className="w-full">
color="purple" <Lists user={user} entities={entities} permissions={permissions} />
className="w-full h-full col-span-2" </section>
onClick={() => setModalOpen("gradingSystem")} </>
disabled={entitiesAllowEditGrading.length === 0} </>
/> );
)}
</div>
)}
</section>
<section className="w-full">
<Lists user={user} entities={entities} permissions={permissions} />
</section>
</>
</>
);
} }

View File

@@ -71,7 +71,10 @@ export type RolePermission =
| "view_workflows" | "view_workflows"
| "configure_workflows" | "configure_workflows"
| "edit_workflow" | "edit_workflow"
| "delete_workflow"; | "delete_workflow"
| "view_confidential_exams"
| "create_confidential_exams"
| "create_public_exams";
export const DEFAULT_PERMISSIONS: RolePermission[] = [ export const DEFAULT_PERMISSIONS: RolePermission[] = [
"view_students", "view_students",
@@ -156,4 +159,6 @@ export const ADMIN_PERMISSIONS: RolePermission[] = [
"view_workflows", "view_workflows",
"edit_workflow", "edit_workflow",
"delete_workflow", "delete_workflow",
"create_confidential_exams",
"create_public_exams",
]; ];

View File

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

View File

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

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

View File

@@ -4,11 +4,18 @@ import { ObjectId } from "mongodb";
const db = client.db(process.env.MONGODB_DB); const db = client.db(process.env.MONGODB_DB);
export const getApprovalWorkflows = async (collection: string, ids?: string[]) => { export const getApprovalWorkflows = async (collection: string, entityIds?: string[], ids?: string[]) => {
return await db const filters: any = {};
.collection<ApprovalWorkflow>(collection)
.find(ids ? { _id: { $in: ids.map((id) => new ObjectId(id)) } } : {}) if (ids && ids.length > 0) {
.toArray(); filters.id = { $in: ids };
}
if (entityIds && entityIds.length > 0) {
filters.entityId = { $in: entityIds };
}
return await db.collection<ApprovalWorkflow>(collection).find(filters).toArray();
}; };
export const getApprovalWorkflow = async (collection: string, id: string) => { export const getApprovalWorkflow = async (collection: string, id: string) => {
@@ -37,9 +44,9 @@ export const getApprovalWorkflowByFormIntaker = async (entityId: string, formInt
export const getApprovalWorkflowsByExamId = async (examId: string) => { export const getApprovalWorkflowsByExamId = async (examId: string) => {
return await db return await db
.collection<ApprovalWorkflow>("active-workflows") .collection<ApprovalWorkflow>("active-workflows")
.find({ .find({
examId, examId,
status: { $in: ["pending"] } status: { $in: ["pending"] },
}) })
.toArray(); .toArray();
}; };

View File

@@ -1,7 +1,30 @@
import { Exam } from "@/interfaces/exam"; import { Exam } from "@/interfaces/exam";
import { diff, Diff } from "deep-diff"; import { diff, Diff } from "deep-diff";
const EXCLUDED_FIELDS = new Set(["_id", "id", "createdAt", "createdBy", "entities", "isDiagnostic", "private"]); const EXCLUDED_KEYS = new Set<string>(["_id", "id", "createdAt", "createdBy", "entities", "isDiagnostic", "private", "requiresApproval", "exerciseID", "questionID"]);
const PATH_LABELS: Record<string, string> = {
access: "Access Type",
parts: "Parts",
exercises: "Exercises",
userSolutions: "User Solutions",
words: "Words",
options: "Options",
prompt: "Prompt",
text: "Text",
audio: "Audio",
script: "Script",
difficulty: "Difficulty",
shuffle: "Shuffle",
solutions: "Solutions",
variant: "Variant",
prefix: "Prefix",
suffix: "Suffix",
topic: "Topic",
allowRepetition: "Allow Repetition",
maxWords: "Max Words",
minTimer: "Timer",
};
export function generateExamDifferences(oldExam: Exam, newExam: Exam): string[] { export function generateExamDifferences(oldExam: Exam, newExam: Exam): string[] {
const differences = diff(oldExam, newExam) || []; const differences = diff(oldExam, newExam) || [];
@@ -9,34 +32,23 @@ export function generateExamDifferences(oldExam: Exam, newExam: Exam): string[]
} }
function formatDifference(change: Diff<any, any>): string | undefined { function formatDifference(change: Diff<any, any>): string | undefined {
if (!change.path) { if (!change.path) return;
if (change.path.some((segment) => EXCLUDED_KEYS.has(segment))) {
return; return;
} }
if (change.path.some((segment) => EXCLUDED_FIELDS.has(segment))) { const pathString = pathToHumanReadable(change.path);
return;
}
// Convert path array to something human-readable
const pathString = change.path.join(" \u2192 "); // e.g. "parts → 0 → exercises → 1 → prompt"
switch (change.kind) { switch (change.kind) {
case "N": case "N": // New property/element
// A new property/element was added return `• Added ${pathString} with value: ${formatValue(change.rhs)}\n`;
return `\u{2022} Added \`${pathString}\` with value: ${formatValue(change.rhs)}`; case "D": // Deleted property/element
return `• Removed ${pathString} which had value: ${formatValue(change.lhs)}\n`;
case "D": case "E": // Edited property/element
// A property/element was deleted return `• Changed ${pathString} from ${formatValue(change.lhs)} to ${formatValue(change.rhs)}\n`;
return `\u{2022} Removed \`${pathString}\` which had value: ${formatValue(change.lhs)}`; case "A": // Array change
case "E":
// A property/element was edited
return `\u{2022} Changed \`${pathString}\` from ${formatValue(change.lhs)} to ${formatValue(change.rhs)}`;
case "A":
// An array change; change.item describes what happened at array index change.index
return formatArrayChange(change); return formatArrayChange(change);
default: default:
return; return;
} }
@@ -44,12 +56,12 @@ function formatDifference(change: Diff<any, any>): string | undefined {
function formatArrayChange(change: Diff<any, any>): string | undefined { function formatArrayChange(change: Diff<any, any>): string | undefined {
if (!change.path) return; if (!change.path) return;
if (change.path.some((segment) => EXCLUDED_FIELDS.has(segment))) {
if (change.path.some((segment) => EXCLUDED_KEYS.has(segment))) {
return; return;
} }
const pathString = change.path.join(" \u2192 ");
const pathString = pathToHumanReadable(change.path);
const arrayChange = (change as any).item; const arrayChange = (change as any).item;
const idx = (change as any).index; const idx = (change as any).index;
@@ -57,14 +69,13 @@ function formatArrayChange(change: Diff<any, any>): string | undefined {
switch (arrayChange.kind) { switch (arrayChange.kind) {
case "N": case "N":
return `\u{2022} Added an item at index [${idx}] in \`${pathString}\`: ${formatValue(arrayChange.rhs)}`; return ` Added an item at [#${idx + 1}] in ${pathString}: ${formatValue(arrayChange.rhs)}\n`;
case "D": case "D":
return `\u{2022} Removed an item at index [${idx}] in \`${pathString}\`: ${formatValue(arrayChange.lhs)}`; return ` Removed an item at [#${idx + 1}] in ${pathString}: ${formatValue(arrayChange.lhs)}\n`;
case "E": case "E":
return `\u{2022} Edited an item at index [${idx}] in \`${pathString}\` from ${formatValue(arrayChange.lhs)} to ${formatValue(arrayChange.rhs)}`; return ` Edited an item at [#${idx + 1}] in ${pathString} from ${formatValue(arrayChange.lhs)} to ${formatValue(arrayChange.rhs)}\n`;
case "A": case "A":
// Nested array changes could happen theoretically; handle or ignore similarly return `• Complex array change at [#${idx + 1}] in ${pathString}: ${JSON.stringify(arrayChange)}\n`;
return `\u{2022} Complex array change at index [${idx}] in \`${pathString}\`: ${JSON.stringify(arrayChange)}`;
default: default:
return; return;
} }
@@ -73,12 +84,64 @@ function formatArrayChange(change: Diff<any, any>): string | undefined {
function formatValue(value: any): string { function formatValue(value: any): string {
if (value === null) return "null"; if (value === null) return "null";
if (value === undefined) return "undefined"; if (value === undefined) return "undefined";
if (typeof value === "object") { if (typeof value === "object") {
try { try {
return JSON.stringify(value); const sanitized = removeExcludedKeysDeep(value, EXCLUDED_KEYS);
const renamed = renameKeysDeep(sanitized, PATH_LABELS);
return JSON.stringify(renamed, null, 2);
} catch { } catch {
return String(value); return String(value);
} }
} }
return JSON.stringify(value); return JSON.stringify(value);
} }
function removeExcludedKeysDeep(obj: any, excludedKeys: Set<string>): any {
if (Array.isArray(obj)) {
return obj.map((item) => removeExcludedKeysDeep(item, excludedKeys));
} else if (obj && typeof obj === "object") {
const newObj: any = {};
for (const key of Object.keys(obj)) {
if (excludedKeys.has(key)) {
// Skip this key entirely
continue;
}
newObj[key] = removeExcludedKeysDeep(obj[key], excludedKeys);
}
return newObj;
}
return obj;
}
function renameKeysDeep(obj: any, renameMap: Record<string, string>): any {
if (Array.isArray(obj)) {
return obj.map((item) => renameKeysDeep(item, renameMap));
} else if (obj && typeof obj === "object") {
const newObj: any = {};
for (const key of Object.keys(obj)) {
const newKey = renameMap[key] ?? key; // Use friendly label if available
newObj[newKey] = renameKeysDeep(obj[key], renameMap);
}
return newObj;
}
return obj;
}
/**
* Convert an array of path segments into a user-friendly string.
* e.g. ["parts", 0, "exercises", 1, "prompt"]
* → "Parts → [#1] → Exercises → [#2] → Prompt"
*/
function pathToHumanReadable(pathSegments: Array<string | number>): string {
return pathSegments
.map((seg) => {
if (typeof seg === "number") {
return `[#${seg + 1}]`;
}
return PATH_LABELS[seg] ?? seg;
})
.join(" → ");
}

View File

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

View File

@@ -23,7 +23,7 @@ export const sortByModuleName = (a: string, b: string) => {
}; };
export const countExercises = (exercises: Exercise[]) => { 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 === "multipleChoice") return e.questions.length;
if (e.type === "interactiveSpeaking") return e.prompts.length; if (e.type === "interactiveSpeaking") return e.prompts.length;
if (e.type === "fillBlanks") return e.solutions.length; if (e.type === "fillBlanks") return e.solutions.length;
@@ -40,37 +40,37 @@ export const countCurrentExercises = (
exercises: Exercise[], exercises: Exercise[],
exerciseIndex: number, exerciseIndex: number,
questionIndex?: number questionIndex?: number
) => { ) => {
return exercises.reduce((acc, exercise, index) => { return exercises.reduce((acc, exercise, index) => {
if (index > exerciseIndex) { if (index > exerciseIndex) {
return acc; return acc;
}
let count = 0;
if (exercise.type === "multipleChoice") {
if (index === exerciseIndex && questionIndex !== undefined) {
count = questionIndex + 1;
} else {
count = exercise.questions!.length;
} }
} else if (exercise.type === "interactiveSpeaking") {
count = exercise.prompts.length; let count = 0;
} else if (exercise.type === "fillBlanks") {
count = exercise.solutions.length; if (exercise.type === "multipleChoice") {
} else if (exercise.type === "writeBlanks") { if (index === exerciseIndex && questionIndex !== undefined) {
count = exercise.solutions.length; count = questionIndex + 1;
} else if (exercise.type === "matchSentences") { } else {
count = exercise.sentences.length; count = exercise.questions!.length;
} else if (exercise.type === "trueFalse") { }
count = exercise.questions.length; } else if (exercise.type === "interactiveSpeaking") {
} else { count = exercise.prompts.length;
count = 1; } else if (exercise.type === "fillBlanks") {
} count = exercise.solutions.length;
} else if (exercise.type === "writeBlanks") {
return acc + count; count = exercise.solutions.length;
} else if (exercise.type === "matchSentences") {
count = exercise.sentences.length;
} else if (exercise.type === "trueFalse") {
count = exercise.questions.length;
} else {
count = 1;
}
return acc + count;
}, 0); }, 0);
}; };
export const countFullExams = (stats: Stat[]) => { export const countFullExams = (stats: Stat[]) => {
const sessionExams = groupBySession(stats); const sessionExams = groupBySession(stats);

View File

@@ -2,7 +2,6 @@ import { EntityWithRoles, Role } from "@/interfaces/entity";
import { PermissionType } from "@/interfaces/permissions"; import { PermissionType } from "@/interfaces/permissions";
import { User, Type, userTypes } from "@/interfaces/user"; import { User, Type, userTypes } from "@/interfaces/user";
import { RolePermission } from "@/resources/entityPermissions"; import { RolePermission } from "@/resources/entityPermissions";
import axios from "axios";
import { findBy, mapBy } from "."; import { findBy, mapBy } from ".";
import { isAdmin } from "./users"; import { isAdmin } from "./users";
@@ -55,11 +54,11 @@ export function groupAllowedEntitiesByPermissions(
const userEntity = userEntityMap.get(entity.id); const userEntity = userEntityMap.get(entity.id);
const role = userEntity const role = userEntity
? roleCache.get(userEntity.role) ?? ? roleCache.get(userEntity.role) ??
(() => { (() => {
const foundRole = entity.roles.find(r => r.id === userEntity.role) || null; const foundRole = entity.roles.find(r => r.id === userEntity.role) || null;
roleCache.set(userEntity.role, foundRole); roleCache.set(userEntity.role, foundRole);
return foundRole; return foundRole;
})() })()
: null; : null;
permissions.forEach(permission => { permissions.forEach(permission => {
@@ -76,7 +75,7 @@ export function groupAllowedEntitiesByPermissions(
export function findAllowedEntities(user: User, entities: EntityWithRoles[], permission: RolePermission) { export function findAllowedEntities(user: User, entities: EntityWithRoles[], permission: RolePermission) {
if (["admin", "developer"].includes(user?.type)) return entities if (["admin", "developer"].includes(user?.type)) return entities
const allowedEntities = entities.filter((e) => doesEntityAllow(user, e, permission)) const allowedEntities = (entities ?? []).filter((e) => doesEntityAllow(user, e, permission))
return allowedEntities return allowedEntities
} }

View File

@@ -1,8 +1,9 @@
import {WithLabeledEntities} from "@/interfaces/entity"; import { WithLabeledEntities } from "@/interfaces/entity";
import {User} from "@/interfaces/user"; import { User } from "@/interfaces/user";
import {USER_TYPE_LABELS} from "@/resources/user"; import { USER_TYPE_LABELS } from "@/resources/user";
import {capitalize} from "lodash"; import { capitalize } from "lodash";
import moment from "moment"; import moment from "moment";
import ExcelJS from "exceljs";
export interface UserListRow { export interface UserListRow {
name: string; name: string;
@@ -17,6 +18,22 @@ export interface UserListRow {
gender: string; 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>[]) => { export const exportListToExcel = (rowUsers: WithLabeledEntities<User>[]) => {
const rows: UserListRow[] = rowUsers.map((user) => ({ const rows: UserListRow[] = rowUsers.map((user) => ({
name: user.name, name: user.name,
@@ -33,10 +50,31 @@ export const exportListToExcel = (rowUsers: WithLabeledEntities<User>[]) => {
gender: user.demographicInformation?.gender ? capitalize(user.demographicInformation.gender) : "N/A", gender: user.demographicInformation?.gender ? capitalize(user.demographicInformation.gender) : "N/A",
verified: user.isVerified?.toString() || "FALSE", verified: user.isVerified?.toString() || "FALSE",
})); }));
const header = "Name,Email,Type,Entities,Expiry Date,Country,Phone,Employment/Department,Gender,Verification"; const workbook = new ExcelJS.Workbook();
const rowsString = rows.map((x) => Object.values(x).join(",")).join("\n"); 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) => { export const getUserName = (user?: User) => {