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
+
+

+
+
Well done! You completed this module!
+
+
+ Experience Gained: +100XP
+
+
+
+
+}
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 ;
+ }
const chapter = 'Ordering food';
const question: Question = questions[currQuestion];
switch (question.type)