From 82460da4e575efc0ad542cf9a47116eab46e0046 Mon Sep 17 00:00:00 2001
From: juanpabloacosta <acosta.jp@icloud.com>
Date: Sat, 2 Dec 2023 06:36:11 -0500
Subject: [PATCH 1/3] Fixed re-rendering of question components and context to
 vocabulary question.

---
 frontend/src/components/WrittenVocabularyExercise.tsx |  1 +
 frontend/src/pages/Lesson.tsx                         | 10 +++++-----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/WrittenVocabularyExercise.tsx b/frontend/src/components/WrittenVocabularyExercise.tsx
index c9f5515..1e2efee 100644
--- a/frontend/src/components/WrittenVocabularyExercise.tsx
+++ b/frontend/src/components/WrittenVocabularyExercise.tsx
@@ -20,6 +20,7 @@ export default function WrittenQuestionExercise({q, onSubmit}: WrittenVocabulary
 
     return (
         <div className='v-layout space-y-8 items-center w-full'>
+            <h1>Vocabulary: Do you know this word?</h1>
             <div className='round box h-min no-shadow relative min-h-[60px] flex items-center justify-center mx-5'>
                 {q.question}
             </div>
diff --git a/frontend/src/pages/Lesson.tsx b/frontend/src/pages/Lesson.tsx
index 78fe5f3..c9f6cf3 100644
--- a/frontend/src/pages/Lesson.tsx
+++ b/frontend/src/pages/Lesson.tsx
@@ -36,15 +36,15 @@ export default function Lesson()
     switch (question.type)
     {
       case 'written-question':
-        return <WrittenQuestionExercise q={question} chapter={chapter} onSubmit={onSubmit}/>;
+        return <WrittenQuestionExercise key={currQuestion} q={question} chapter={chapter} onSubmit={onSubmit}/>;
       case 'written-vocabulary':
-        return <WrittenVocabularyExercise q={question} onSubmit={onSubmit}/>;
+        return <WrittenVocabularyExercise key={currQuestion} q={question} onSubmit={onSubmit}/>;
       case 'verbal-question':
-        return <VerbalQuestionsExercise q={question} chapter={chapter} onSubmit={onSubmit}/>;
+        return <VerbalQuestionsExercise key={currQuestion} q={question} chapter={chapter} onSubmit={onSubmit}/>;
       case 'verbal-pronunciation':
-        return <VerbalPronunciationExercise q={question} chapter={chapter} onSubmit={onSubmit}/>;
+        return <VerbalPronunciationExercise key={currQuestion} q={question} chapter={chapter} onSubmit={onSubmit}/>;
       case 'video':
-        return <VideoExercise q={question} chapter={chapter} onSubmit={onSubmit}/>;
+        return <VideoExercise key={currQuestion} q={question} chapter={chapter} onSubmit={onSubmit}/>;
       default:
         return null;
     }

From 9f65f9e9350476aa26e1b2436b5225fb9fdf746c Mon Sep 17 00:00:00 2001
From: juanpabloacosta <acosta.jp@icloud.com>
Date: Sat, 2 Dec 2023 06:55:43 -0500
Subject: [PATCH 2/3] Added lesson complete page after completing a module.

---
 frontend/src/components/LessonComplete.tsx | 26 ++++++++++++++++++++++
 frontend/src/pages/Lesson.tsx              |  8 ++++---
 2 files changed, 31 insertions(+), 3 deletions(-)
 create mode 100644 frontend/src/components/LessonComplete.tsx

diff --git a/frontend/src/components/LessonComplete.tsx b/frontend/src/components/LessonComplete.tsx
new file mode 100644
index 0000000..cccffbf
--- /dev/null
+++ b/frontend/src/components/LessonComplete.tsx
@@ -0,0 +1,26 @@
+import DuoSplash from "../assets/img/duo-splash.png";
+import { useNavigate } from "react-router-dom";
+
+interface LessonCompleteProps {
+    home: string;
+  }
+
+export default function LessonComplete({ home } : LessonCompleteProps)
+{
+  const navigate = useNavigate();
+
+  return <div className="flex flex-col justify-center">
+    <div className="flex flex-col p-5 gap-5 items-center">
+      <img src={DuoSplash} alt="Duolingo Logo"></img>
+
+      <h1>Well done! You completed this module!</h1>
+
+      <p className="white">
+        Experience Gained: +100XP
+      </p>
+      <button className="green" onClick={() => navigate(home)}>
+        Continue
+      </button>
+    </div>
+  </div>
+}
diff --git a/frontend/src/pages/Lesson.tsx b/frontend/src/pages/Lesson.tsx
index c9f6cf3..6a67beb 100644
--- a/frontend/src/pages/Lesson.tsx
+++ b/frontend/src/pages/Lesson.tsx
@@ -5,6 +5,7 @@ import WrittenVocabularyExercise from "../components/WrittenVocabularyExercise"
 import VerbalQuestionsExercise from "../components/VerbalQuestionsExercise"
 import Progress from '../components/Progress';
 import VerbalPronunciationExercise from '../components/VerbalPronunciationExercise';
+import LessonComplete from '../components/LessonComplete';
 import {_Question, chapters_jp, Question} from "../logic/CourseData";
 import VideoExercise from "../components/VideoExercise";
 
@@ -24,13 +25,14 @@ export default function Lesson()
 
   const onSubmit = () =>
   {
-    if (currQuestion < questions.length - 1)
-      setCurrQuestion(currQuestion + 1);
-    else navigate(home);
+    setCurrQuestion(currQuestion + 1);
   }
 
   const renderQuestion = (currIndex: number) =>
   {
+    if (currIndex >= questions.length) {
+      return <LessonComplete home={home}/>;
+    }
     const chapter = 'Ordering food';
     const question: Question = questions[currQuestion];
     switch (question.type)

From 61fa2495e4e20fd5300e0ed0a70f5a4ae6c213c9 Mon Sep 17 00:00:00 2001
From: juanpabloacosta <acosta.jp@icloud.com>
Date: Sat, 2 Dec 2023 06:58:13 -0500
Subject: [PATCH 3/3] Generalized completion message.

---
 frontend/src/components/LessonComplete.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/LessonComplete.tsx b/frontend/src/components/LessonComplete.tsx
index cccffbf..e7d55f3 100644
--- a/frontend/src/components/LessonComplete.tsx
+++ b/frontend/src/components/LessonComplete.tsx
@@ -13,7 +13,7 @@ export default function LessonComplete({ home } : LessonCompleteProps)
     <div className="flex flex-col p-5 gap-5 items-center">
       <img src={DuoSplash} alt="Duolingo Logo"></img>
 
-      <h1>Well done! You completed this module!</h1>
+      <h1>Well done!</h1>
 
       <p className="white">
         Experience Gained: +100XP