From e382a09ae854495f951b1baea3ee593bdc645316 Mon Sep 17 00:00:00 2001 From: Tiago Ribeiro Date: Tue, 13 Feb 2024 00:42:09 +0000 Subject: [PATCH 1/4] Added the key "topic" to Writing, Speaking and Interactive Speaking exercises --- src/interfaces/exam.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/interfaces/exam.ts b/src/interfaces/exam.ts index af431f65..57a86a9b 100644 --- a/src/interfaces/exam.ts +++ b/src/interfaces/exam.ts @@ -148,6 +148,7 @@ export interface WritingExercise { solution: string; evaluation?: CommonEvaluation; }[]; + topic?: string; } export interface SpeakingExercise { @@ -162,6 +163,7 @@ export interface SpeakingExercise { solution: string; evaluation?: SpeakingEvaluation; }[]; + topic?: string; } export interface InteractiveSpeakingExercise { @@ -175,6 +177,7 @@ export interface InteractiveSpeakingExercise { solution: {questionIndex: number; question: string; answer: string}[]; evaluation?: InteractiveSpeakingEvaluation; }[]; + topic?: string; } export interface FillBlanksExercise { From c0c9d22864f73952e7a9562aecc84d9270ebafc3 Mon Sep 17 00:00:00 2001 From: Tiago Ribeiro Date: Tue, 13 Feb 2024 11:39:19 +0000 Subject: [PATCH 2/4] Added the ability for a user to select their preferred topics --- src/components/Medium/TopicModal.tsx | 70 ++++++++++++++++++++++++++++ src/interfaces/user.ts | 2 + src/pages/profile.tsx | 57 ++++++++++++++++------ src/resources/topics.ts | 55 ++++++++++++++++++++++ 4 files changed, 171 insertions(+), 13 deletions(-) create mode 100644 src/components/Medium/TopicModal.tsx create mode 100644 src/resources/topics.ts diff --git a/src/components/Medium/TopicModal.tsx b/src/components/Medium/TopicModal.tsx new file mode 100644 index 00000000..3c31c2a2 --- /dev/null +++ b/src/components/Medium/TopicModal.tsx @@ -0,0 +1,70 @@ +import topics from "@/resources/topics"; +import {useState} from "react"; +import {BsArrowLeft, BsArrowRight} from "react-icons/bs"; +import Button from "../Low/Button"; +import Modal from "../Modal"; + +interface Props { + isOpen: boolean; + initialTopics: string[]; + onClose: VoidFunction; + selectTopics: (topics: string[]) => void; +} + +export default function TopicModal({isOpen, initialTopics, onClose, selectTopics}: Props) { + const [selectedTopics, setSelectedTopics] = useState([...initialTopics]); + + return ( + +
+
+
+ Available Topics +
+ {topics + .filter((x) => !selectedTopics.includes(x)) + .map((x) => ( +
+ {x} + +
+ ))} +
+
+
+ Preferred Topics ({selectedTopics.length || "All"}) +
+ {selectedTopics.map((x) => ( +
+ + {x} +
+ ))} +
+
+
+
+ + +
+
+ + ); +} diff --git a/src/interfaces/user.ts b/src/interfaces/user.ts index c5dc5ad3..bb1ae8ae 100644 --- a/src/interfaces/user.ts +++ b/src/interfaces/user.ts @@ -24,6 +24,7 @@ export interface StudentUser extends BasicUser { type: "student"; preferredGender?: InstructorGender; demographicInformation?: DemographicInformation; + preferredTopics?: string[]; } export interface TeacherUser extends BasicUser { @@ -52,6 +53,7 @@ export interface DeveloperUser extends BasicUser { type: "developer"; preferredGender?: InstructorGender; demographicInformation?: DemographicInformation; + preferredTopics?: string[]; } export interface CorporateInformation { diff --git a/src/pages/profile.tsx b/src/pages/profile.tsx index dac35526..e94d4026 100644 --- a/src/pages/profile.tsx +++ b/src/pages/profile.tsx @@ -16,7 +16,7 @@ import {CorporateUser, EmploymentStatus, EMPLOYMENT_STATUS, Gender, User} from " import CountrySelect from "@/components/Low/CountrySelect"; import {shouldRedirectHome} from "@/utils/navigation.disabled"; import moment from "moment"; -import {BsCamera} from "react-icons/bs"; +import {BsCamera, BsQuestionCircleFill} from "react-icons/bs"; import {USER_TYPE_LABELS} from "@/resources/user"; import useGroups from "@/hooks/useGroups"; import useUsers from "@/hooks/useUsers"; @@ -31,6 +31,8 @@ import ModuleLevelSelector from "@/components/Medium/ModuleLevelSelector"; import Select from "@/components/Low/Select"; import {InstructorGender} from "@/interfaces/exam"; import {capitalize} from "lodash"; +import TopicModal from "@/components/Medium/TopicModal"; +import {v4} from "uuid"; export const getServerSideProps = withIronSessionSsr(({req, res}) => { const user = req.session.user; @@ -90,6 +92,9 @@ function UserProfile({user, mutateUser}: Props) { const [preferredGender, setPreferredGender] = useState( user.type === "student" || user.type === "developer" ? user.preferredGender || "varied" : undefined, ); + const [preferredTopics, setPreferredTopics] = useState( + user.type === "student" || user.type === "developer" ? user.preferredTopics : undefined, + ); const [position, setPosition] = useState(user.type === "corporate" ? user.demographicInformation?.position : undefined); const [corporateInformation, setCorporateInformation] = useState(user.type === "corporate" ? user.corporateInformation : undefined); @@ -99,6 +104,8 @@ function UserProfile({user, mutateUser}: Props) { ); const [timezone, setTimezone] = useState(user.demographicInformation?.timezone || moment.tz.guess()); + const [isPreferredTopicsOpen, setIsPreferredTopicsOpen] = useState(false); + const {groups} = useGroups(); const {users} = useUsers(); @@ -156,6 +163,7 @@ function UserProfile({user, mutateUser}: Props) { profilePicture, desiredLevels, preferredGender, + preferredTopics, demographicInformation: { phone, country, @@ -350,18 +358,41 @@ function UserProfile({user, mutateUser}: Props) { {preferredGender && ["developer", "student"].includes(user.type) && ( <> -
- - (value ? setPreferredGender(value.value as InstructorGender) : null)} + options={[ + {value: "male", label: "Male"}, + {value: "female", label: "Female"}, + {value: "varied", label: "Varied"}, + ]} + /> +
+
+ + +
+ + + setIsPreferredTopicsOpen(false)} + selectTopics={setPreferredTopics} + initialTopics={preferredTopics || []} + /> )} diff --git a/src/resources/topics.ts b/src/resources/topics.ts new file mode 100644 index 00000000..424dbbbf --- /dev/null +++ b/src/resources/topics.ts @@ -0,0 +1,55 @@ +const topics = [ + "Education", + "Technology", + "Environment", + "Health and Fitness", + "Globalization", + "Engineering", + "Work and Careers", + "Travel and Tourism", + "Culture and Traditions", + "Social Issues", + "Arts and Entertainment", + "Climate Change", + "Social Media", + "Sustainable Development", + "Health Care", + "Immigration", + "Artificial Intelligence", + "Consumerism", + "Online Shopping", + "Energy", + "Oil and Gas", + "Poverty and Inequality", + "Cultural Diversity", + "Democracy and Governance", + "Mental Health", + "Ethics and Morality", + "Population Growth", + "Science and Innovation", + "Poverty Alleviation", + "Cybersecurity and Privacy", + "Human Rights", + "Social Justice", + "Food and Agriculture", + "Cyberbullying and Online Safety", + "Linguistic Diversity", + "Urbanization", + "Artificial Intelligence in Education", + "Youth Empowerment", + "Disaster Management", + "Mental Health Stigma", + "Internet Censorship", + "Sustainable Fashion", + "Indigenous Rights", + "Water Scarcity", + "Social Entrepreneurship", + "Privacy in the Digital Age", + "Sustainable Transportation", + "Gender Equality", + "Automation and Job Displacement", + "Digital Divide", + "Education Inequality", +]; + +export default topics; From 6a38b7a32e4249941d6c83d658734062474d5122 Mon Sep 17 00:00:00 2001 From: Tiago Ribeiro Date: Tue, 13 Feb 2024 16:04:46 +0000 Subject: [PATCH 3/4] Updated the exam selection to get exams related to the user's topic preference --- src/interfaces/exam.ts | 4 ++-- src/utils/exams.be.ts | 39 +++++++++++++++++++++++++++++++-------- 2 files changed, 33 insertions(+), 10 deletions(-) diff --git a/src/interfaces/exam.ts b/src/interfaces/exam.ts index 57a86a9b..775655d1 100644 --- a/src/interfaces/exam.ts +++ b/src/interfaces/exam.ts @@ -69,7 +69,7 @@ export interface UserSolution { export interface WritingExam { module: "writing"; id: string; - exercises: Exercise[]; + exercises: WritingExercise[]; minTimer: number; isDiagnostic: boolean; variant?: Variant; @@ -84,7 +84,7 @@ interface WordCounter { export interface SpeakingExam { id: string; module: "speaking"; - exercises: Exercise[]; + exercises: (SpeakingExercise | InteractiveSpeakingExercise)[]; minTimer: number; isDiagnostic: boolean; variant?: Variant; diff --git a/src/utils/exams.be.ts b/src/utils/exams.be.ts index 01b67116..be8d1837 100644 --- a/src/utils/exams.be.ts +++ b/src/utils/exams.be.ts @@ -1,7 +1,7 @@ import {collection, getDocs, query, where, setDoc, doc, Firestore, getDoc} from "firebase/firestore"; import {shuffle} from "lodash"; -import {Difficulty, Exam, InstructorGender, Variant} from "@/interfaces/exam"; -import {Stat, User} from "@/interfaces/user"; +import {Difficulty, Exam, InstructorGender, SpeakingExam, Variant, WritingExam} from "@/interfaces/exam"; +import {DeveloperUser, Stat, StudentUser, User} from "@/interfaces/user"; import {Module} from "@/interfaces"; export const getExams = async ( @@ -28,9 +28,10 @@ export const getExams = async ( })), ) as Exam[]; - const variantExams: Exam[] = filterByVariant(allExams, variant); - const genderedExams: Exam[] = filterByInstructorGender(variantExams, instructorGender); - const difficultyExams: Exam[] = await filterByDifficulty(db, genderedExams, module, userId); + let exams: Exam[] = filterByVariant(allExams, variant); + exams = filterByInstructorGender(exams, instructorGender); + exams = await filterByDifficulty(db, exams, module, userId); + exams = await filterByPreference(db, exams, module, userId); if (avoidRepeated === "true") { const statsQ = query(collection(db, "stats"), where("user", "==", userId)); @@ -40,12 +41,12 @@ export const getExams = async ( id: doc.id, ...doc.data(), })) as unknown as Stat[]; - const filteredExams = difficultyExams.filter((x) => !stats.map((s) => s.exam).includes(x.id)); + const filteredExams = exams.filter((x) => !stats.map((s) => s.exam).includes(x.id)); - return filteredExams.length > 0 ? filteredExams : difficultyExams; + return filteredExams.length > 0 ? filteredExams : exams; } - return difficultyExams; + return exams; }; const filterByInstructorGender = (exams: Exam[], instructorGender?: InstructorGender) => { @@ -70,3 +71,25 @@ const filterByDifficulty = async (db: Firestore, exams: Exam[], module: Module, const filteredExams = exams.filter((exam) => exam.difficulty === difficulty); return filteredExams.length === 0 ? exams : filteredExams; }; + +const filterByPreference = async (db: Firestore, exams: Exam[], module: Module, userID?: string) => { + if (!["speaking", "writing"].includes(module)) return exams; + + if (!userID) return exams; + const userRef = await getDoc(doc(db, "users", userID)); + if (!userRef.exists()) return exams; + + const user = {...userRef.data(), id: userRef.id} as StudentUser | DeveloperUser; + if (!["developer", "student"].includes(user.type)) return exams; + if (!user.preferredTopics || user.preferredTopics.length === 0) return exams; + + const userTopics = user.preferredTopics; + const topicalExams = exams.filter((e) => { + const exam = e as WritingExam | SpeakingExam; + const topics = exam.exercises.map((x) => x.topic).filter((x) => !!x) as string[]; + + return topics.some((topic) => userTopics.map((x) => x.toLowerCase()).includes(topic.toLowerCase())); + }); + + return topicalExams.length > 0 ? shuffle(topicalExams) : exams; +}; From 30cb2f460c472701a53ca4ca7637358b215759a8 Mon Sep 17 00:00:00 2001 From: Tiago Ribeiro Date: Tue, 13 Feb 2024 16:05:13 +0000 Subject: [PATCH 4/4] Changed the label on the Save button --- src/components/Medium/TopicModal.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Medium/TopicModal.tsx b/src/components/Medium/TopicModal.tsx index 3c31c2a2..ab0bcd17 100644 --- a/src/components/Medium/TopicModal.tsx +++ b/src/components/Medium/TopicModal.tsx @@ -61,7 +61,7 @@ export default function TopicModal({isOpen, initialTopics, onClose, selectTopics selectTopics(selectedTopics); onClose(); }}> - Save + Select