From 4e8a4acaae35fb0c682ad62d8b6cae0f64a54490 Mon Sep 17 00:00:00 2001
From: juanpabloacosta <acosta.jp@icloud.com>
Date: Thu, 30 Nov 2023 07:21:52 -0500
Subject: [PATCH] Wrote lesson page (currently only one type of question).

---
 frontend/src/pages/Lesson.tsx | 47 +++++++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 frontend/src/pages/Lesson.tsx

diff --git a/frontend/src/pages/Lesson.tsx b/frontend/src/pages/Lesson.tsx
new file mode 100644
index 0000000..d830698
--- /dev/null
+++ b/frontend/src/pages/Lesson.tsx
@@ -0,0 +1,47 @@
+import { useLocation, useNavigate } from 'react-router-dom';
+import { Icon } from '@iconify/react';
+import { useState } from 'react';
+import WrittenQuestionExercise from "../components/WrittenQuestionExercise"
+
+export default function Course() {
+    const location = useLocation();
+    const navigate = useNavigate();
+    const { questions } = location.state;
+    const [currQuestion, setCurrQuestion] = useState(0);
+
+    const renderLessonContent = () => {
+      const {question, wordBank, expected, type, exercise} = questions[currQuestion];
+        switch (type) {
+          case 'written':
+            switch (exercise) {
+              case 'questions':
+                return <WrittenQuestionExercise question={question} wordBank={wordBank} expected={expected} chapter={"Travel"} language={"Japanese"} setCurrQuestion={setCurrQuestion}/>;
+            //   case 'vocabulary':
+            //     return <WrittenVocabularyLesson />;
+              default:
+                return null;
+            }
+        //   case 'verbal-listening':
+        //     switch (exercise) {
+        //       case 'questions':
+        //         return <VerbalQuestionsLesson />;
+        //       case 'pronunciation':
+        //         return <VerbalPronunciationLesson />;
+        //       default:
+        //         return null;
+        //     }
+        //   default:
+        //     return null;
+        }
+      };
+    
+    return (
+        <div className="v-layout p-10">
+            <Icon icon="mdi:arrow-left" className="back-button" onClick={() => navigate(-1)} />
+            <h1 className="text-center">Course Page</h1>
+            <div className="flex flex-col flex-1 mb-8 items-center">
+                {renderLessonContent()}
+            </div>
+        </div>
+    )
+}
\ No newline at end of file