From 4c7a2c585aaf6832dde4394b7a9d9b65a6b45f8e Mon Sep 17 00:00:00 2001
From: Delphine van Rossum <delphine.vanrossum@student.uclouvain.be>
Date: Sun, 22 Dec 2024 17:29:15 +0000
Subject: [PATCH] Resolve "survey questions: other languages known
 (multiselect?)"

---
 backend/app/models.py                       |  1 +
 backend/app/schemas.py                      |  2 ++
 frontend/src/lang/en.json                   |  2 ++
 frontend/src/lang/fr.json                   |  4 ++-
 frontend/src/lib/api/survey.ts              |  2 ++
 frontend/src/routes/tests/[id]/+page.svelte | 28 +++++++++++++++++----
 6 files changed, 33 insertions(+), 6 deletions(-)

diff --git a/backend/app/models.py b/backend/app/models.py
index 8222ec20..6f1621b1 100644
--- a/backend/app/models.py
+++ b/backend/app/models.py
@@ -269,6 +269,7 @@ class SurveyResponseInfo(Base):
     birthyear = Column(Integer)
     gender = Column(String)
     primary_language = Column(String)
+    other_language = Column(String)
     education = Column(String)
 
 
diff --git a/backend/app/schemas.py b/backend/app/schemas.py
index bc4a3c3d..d13fd2c6 100644
--- a/backend/app/schemas.py
+++ b/backend/app/schemas.py
@@ -307,6 +307,7 @@ class SurveyResponseInfoCreate(BaseModel):
     birthyear: int
     gender: str
     primary_language: str
+    other_language: str
     education: str
 
 
@@ -316,6 +317,7 @@ class SurveyResponseInfo(BaseModel):
     birthyear: int
     gender: str
     primary_language: str
+    other_language: str
     education: str
 
 
diff --git a/frontend/src/lang/en.json b/frontend/src/lang/en.json
index 42ade9d8..a9dbdc67 100644
--- a/frontend/src/lang/en.json
+++ b/frontend/src/lang/en.json
@@ -186,6 +186,8 @@
 			"Master": "Master's degree or above"
 		},
 		"example": "Example",
+		"otherLanguage": "Is there any other language you are relatively fluent in?",
+		"otherLanguageNote": "(If you are fluent in multiple other languages, beyond your target language and your first language, please select the one closest to your target language or that seems to help you the most in learning your target language.)",
 		"consent": {
 			"intro": "You are invited to participate in a scientific study to design, validate and apply vocabulary tests.",
 			"ok": "I agree to participate in the study as described above.",
diff --git a/frontend/src/lang/fr.json b/frontend/src/lang/fr.json
index 8a0b0973..5e42f62b 100644
--- a/frontend/src/lang/fr.json
+++ b/frontend/src/lang/fr.json
@@ -274,7 +274,9 @@
 			"Bachelor": "Bachelier",
 			"Master": "Master ou diplôme supérieur"
 		},
-		"example": "Exemple"
+		"example": "Exemple",
+		"otherLanguage": "Is there any other language you are relatively fluent in?",
+		"otherLanguageNote": "(If you are fluent in multiple other languages, beyond your target language and your first language, please select the one closest to your target language or that seems to help you the most in learning your target language.)"
 	},
 	"users": {
 		"nickname": "Nom",
diff --git a/frontend/src/lib/api/survey.ts b/frontend/src/lib/api/survey.ts
index 52b17a7f..def03af3 100644
--- a/frontend/src/lib/api/survey.ts
+++ b/frontend/src/lib/api/survey.ts
@@ -52,6 +52,7 @@ export async function sendSurveyResponseInfoAPI(
 	birthyear: number,
 	gender: string,
 	primary_language: string,
+	other_language: string,
 	education: string
 ) {
 	const response = await fetch(`/api/surveys/info/${survey_id}`, {
@@ -62,6 +63,7 @@ export async function sendSurveyResponseInfoAPI(
 			birthyear,
 			gender,
 			primary_language,
+			other_language,
 			education
 		})
 	});
diff --git a/frontend/src/routes/tests/[id]/+page.svelte b/frontend/src/routes/tests/[id]/+page.svelte
index 93095006..07d92950 100644
--- a/frontend/src/routes/tests/[id]/+page.svelte
+++ b/frontend/src/routes/tests/[id]/+page.svelte
@@ -42,13 +42,13 @@
 	let questionsRandomized = $derived(getSortedQuestions(currentGroup));
 	let currentQuestionId = $state(0);
 	let currentQuestion = $derived(questionsRandomized[currentQuestionId]);
-	let type = $derived(currentQuestion.question.split(':')[0]);
-	let value = $derived(currentQuestion.question.split(':').slice(1).join(':'));
+	let type = $derived(currentQuestion?.question.split(':')[0]);
+	let value = $derived(currentQuestion?.question.split(':').slice(1).join(':'));
 	let gaps = $derived(type === 'gap' ? gapParts(currentQuestion.question) : null);
 	let soundPlayer: HTMLAudioElement;
 	let displayQuestionOptions: string[] = $derived(
 		(() => {
-			let d = [...(currentQuestion.options ?? [])];
+			let d = [...(currentQuestion?.options ?? [])];
 			shuffle(d);
 			return d;
 		})()
@@ -194,7 +194,7 @@
 	async function selectAnswer(selection: string, option: string) {
 		endSurveyAnswers[selection] = option;
 		subStep += 1;
-		if (subStep == 4) {
+		if (subStep == 5) {
 			await sendSurveyResponseInfoAPI(
 				fetch,
 				survey.id,
@@ -202,6 +202,7 @@
 				endSurveyAnswers.birthYear,
 				endSurveyAnswers.gender,
 				endSurveyAnswers.primaryLanguage,
+				endSurveyAnswers.other_language,
 				endSurveyAnswers.education
 			);
 			step += 1;
@@ -406,6 +407,23 @@
 				></Dropdown>
 			</div>
 		{:else if subStep === 3}
+			<div class="mx-auto mt-16 text-center px-4">
+				<p class="text-center font-bold py-4 px-6 m-auto">{$t('surveys.otherLanguage')}</p>
+				<p class="mb-6 text-sm text-gray-600 text-center">{$t('surveys.otherLanguageNote')}</p>
+				<Dropdown
+					values={[
+						{ value: 'none', display: '/' },
+						...Object.entries(config.PRIMARY_LANGUAGE).map(([code, name]) => ({
+							value: code,
+							display: name
+						}))
+					]}
+					bind:option={selectedOption}
+					placeholder={$t('surveys.otherLanguage')}
+					funct={() => selectAnswer('other_language', selectedOption)}
+				></Dropdown>
+			</div>
+		{:else if subStep === 4}
 			<div class="mx-auto mt-16 text-center px-4">
 				<p class="text-center font-bold py-4 px-6 m-auto">{$t('surveys.education.title')}</p>
 				<Dropdown
@@ -426,7 +444,7 @@
 	{:else}
 		{(step += 1)}
 	{/if}
-{:else if step == 4}
+{:else if step === 4}
 	<div class="mx-auto mt-16 text-center">
 		<h1>{$t('surveys.complete')}</h1>
 		{#if finalScore !== null}
-- 
GitLab