From 7675923b9cf5a6e2a2b65452b0b48a51b83df0e6 Mon Sep 17 00:00:00 2001
From: Elijah Kelly <kellyel@stanford.edu>
Date: Tue, 12 Mar 2024 15:48:24 -0700
Subject: [PATCH] Add SRE-ES and Letter-ES to routes and add props

---
 src/App.vue                         |  2 ++
 src/components/tasks/TaskLetter.vue |  8 +++++++-
 src/components/tasks/TaskSRE.vue    |  8 +++++++-
 src/router/index.js                 | 16 ++++++++++++++++
 4 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index d7dbaec12..4cea589b2 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -43,8 +43,10 @@ const navbarBlacklist = ref([
   'SWR',
   'SWR-ES',
   'SRE',
+  'SRE-ES',
   'PA',
   'Letter',
+  'Letter-ES',
   'Vocab',
   'Multichoice',
   'Morphology',
diff --git a/src/components/tasks/TaskLetter.vue b/src/components/tasks/TaskLetter.vue
index e5316a1b0..ff2e5328b 100644
--- a/src/components/tasks/TaskLetter.vue
+++ b/src/components/tasks/TaskLetter.vue
@@ -16,7 +16,12 @@ import { useGameStore } from '@/store/game';
 import _get from 'lodash/get';
 import { fetchDocById } from '@/helpers/query/utils';
 
-const taskId = 'letter';
+const props = defineProps({
+  taskId: { type: String, required: true, default: 'letter' },
+  language: { type: String, required: true, default: 'en' },
+});
+
+const taskId = props.taskId;
 const router = useRouter();
 const gameStarted = ref(false);
 const authStore = useAuthStore();
@@ -75,6 +80,7 @@ async function startTask() {
     grade: _get(userData.value, 'studentData.grade'),
     birthMonth: userDateObj.getMonth() + 1,
     birthYear: userDateObj.getFullYear(),
+    language: props.language,
   };
 
   const gameParams = { ...appKit._taskInfo.variantParams };
diff --git a/src/components/tasks/TaskSRE.vue b/src/components/tasks/TaskSRE.vue
index 2e920a019..eed82a288 100644
--- a/src/components/tasks/TaskSRE.vue
+++ b/src/components/tasks/TaskSRE.vue
@@ -16,7 +16,12 @@ import { useGameStore } from '@/store/game';
 import _get from 'lodash/get';
 import { fetchDocById } from '@/helpers/query/utils';
 
-const taskId = 'sre';
+const props = defineProps({
+  taskId: { type: String, required: true, default: 'sre' },
+  language: { type: String, required: true, default: 'en' },
+});
+
+const taskId = props.taskId;
 const router = useRouter();
 const gameStarted = ref(false);
 const authStore = useAuthStore();
@@ -75,6 +80,7 @@ async function startTask() {
     grade: _get(userData.value, 'studentData.grade'),
     birthMonth: userDateObj.getMonth() + 1,
     birthYear: userDateObj.getFullYear(),
+    language: props.language,
   };
 
   const gameParams = { ...appKit._taskInfo.variantParams };
diff --git a/src/router/index.js b/src/router/index.js
index be14bd224..ee80b34b4 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -59,14 +59,30 @@ const routes = [
     path: '/game/sre',
     name: 'SRE',
     component: () => import('../components/tasks/TaskSRE.vue'),
+    props: { taskId: 'sre', language: 'en' },
     meta: { pageTitle: 'SRE' },
   },
+  {
+    path: '/game/sre-es',
+    name: 'SRE-ES',
+    component: () => import('../components/tasks/TaskSRE.vue'),
+    props: { taskId: 'sre-es', language: 'es' },
+    meta: { pageTitle: 'SRE-ES' },
+  },
   {
     path: '/game/letter',
     name: 'Letter',
     component: () => import('../components/tasks/TaskLetter.vue'),
+    props: { taskId: 'letter', language: 'en' },
     meta: { pageTitle: 'Letter' },
   },
+  {
+    path: '/game/letter-es',
+    name: 'Letter-ES',
+    component: () => import('../components/tasks/TaskLetter.vue'),
+    props: { taskId: 'letter-es', language: 'es' },
+    meta: { pageTitle: 'Letter-ES' },
+  },
   {
     path: '/game/multichoice',
     name: 'Multichoice',