List answers to question in modal

src/components/Course/components/Lesson/Exercise/MarkExerciseModal.svelte

@@ -1,7 +1,15 @@
 <script>
-  import Modal from '../../../../Modal/index.svelte';
+  import Modal from "../../../../Modal/index.svelte";
+  import Preview from "./Preview.svelte";
+  import { questionnaire } from "./store";
+  import { questionnaireMetaData } from "./store/answers";
   export let open;
   export let onClose;
+  export let submissionId;
+
+  // get submission data by submissionId;
+
+  $: console.log("questionnaireMetaData", $questionnaireMetaData);
 </script>
 
 <Modal
@@ -10,44 +18,8 @@
   {onClose}
   width="w-3/5"
 >
-  <p class="p-2 mb-2">
-    Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus debitis
-    quos porro doloremque amet alias modi ducimus delectus cum dolor sunt
-    laborum provident, deserunt magni facilis non nobis illum ipsum. Lorem ipsum
-    dolor sit amet, consectetur adipisicing elit. Deleniti rem aliquid, saepe
-    fuga reiciendis ullam officiis soluta cum, vitae aut eum expedita cumque
-    perspiciatis pariatur necessitatibus, praesentium ea laudantium ut?
-  </p>
-  <p class="p-2 mb-2">
-    Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus debitis
-    quos porro doloremque amet alias modi ducimus delectus cum dolor sunt
-    laborum provident, deserunt magni facilis non nobis illum ipsum. Lorem ipsum
-    dolor sit amet, consectetur adipisicing elit. Deleniti rem aliquid, saepe
-    fuga reiciendis ullam officiis soluta cum, vitae aut eum expedita cumque
-    perspiciatis pariatur necessitatibus, praesentium ea laudantium ut?
-  </p>
-  <p class="p-2 mb-2">
-    Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus debitis
-    quos porro doloremque amet alias modi ducimus delectus cum dolor sunt
-    laborum provident, deserunt magni facilis non nobis illum ipsum. Lorem ipsum
-    dolor sit amet, consectetur adipisicing elit. Deleniti rem aliquid, saepe
-    fuga reiciendis ullam officiis soluta cum, vitae aut eum expedita cumque
-    perspiciatis pariatur necessitatibus, praesentium ea laudantium ut?
-  </p>
-  <p class="p-2 mb-2">
-    Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus debitis
-    quos porro doloremque amet alias modi ducimus delectus cum dolor sunt
-    laborum provident, deserunt magni facilis non nobis illum ipsum. Lorem ipsum
-    dolor sit amet, consectetur adipisicing elit. Deleniti rem aliquid, saepe
-    fuga reiciendis ullam officiis soluta cum, vitae aut eum expedita cumque
-    perspiciatis pariatur necessitatibus, praesentium ea laudantium ut?
-  </p>
-  <p class="p-2 mb-2">
-    Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus debitis
-    quos porro doloremque amet alias modi ducimus delectus cum dolor sunt
-    laborum provident, deserunt magni facilis non nobis illum ipsum. Lorem ipsum
-    dolor sit amet, consectetur adipisicing elit. Deleniti rem aliquid, saepe
-    fuga reiciendis ullam officiis soluta cum, vitae aut eum expedita cumque
-    perspiciatis pariatur necessitatibus, praesentium ea laudantium ut?
-  </p>
+  <Preview
+    questions={$questionnaire.questions}
+    questionnaireMetaData={$questionnaireMetaData}
+  />
 </Modal>

src/components/Course/components/Lesson/Exercise/ViewMode.svelte

@@ -87,8 +87,6 @@
   $: $questionnaireMetaData.progressValue = getProgressValue(
     $questionnaireMetaData.currentQuestionIndex
   );
-
-  $: console.log('$questionnaire', $questionnaire);
 </script>
 
 {#if !preview && $questionnaire.questions.length && !$questionnaireMetaData.isFinished}

src/components/Course/components/Lesson/Materials/EditMode.svelte

@@ -22,7 +22,6 @@
   let currentTab = tabs[0].value;
 
   function onChange(tabValue) {
-    console.log(`$lesson`, $lesson);
     return () => {
       currentTab = tabValue;
     };

src/components/CourseContainer/index.svelte

@@ -11,7 +11,7 @@
 
   function setStoreWithData() {
     lessons.set(courseData.lessons);
-    console.log(`courseData`, courseData);
+
     if (courseData.lesson) {
       lesson.set(courseData.lesson);
     }

src/routes/courses/[id]/allexercises.svelte

@@ -172,15 +172,13 @@
   }
 
   function handleModalClose() {
-    console.log('closing', page.path);
-
     goto($page.path);
   }
 
   $: openExercise = !!$page.query.submissionId;
 </script>
 
-<MarkExerciseModal bind:open={openExercise} onClose={handleModalClose} />
+<MarkExerciseModal bind:open={openExercise} onClose={handleModalClose} submissionId={$page.query.submissionId}/>
 
 <CourseContainer {courseData}>
   <PageNav title="All Exercises" />

src/routes/courses/[id]/lessons/[...lessonParams]/index.svelte

@@ -7,7 +7,6 @@
       `api/course?id=${courseId}&lessonId=${lessonId}&exerciseId=${exerciseId}`
     );
     const data = await res.json();
-    console.log(`data`, data);
 
     if (res.status === 200) {
       return {

src/routes/courses/[id]/lessons/index.svelte

@@ -1,6 +1,5 @@
 <script context="module">
   export async function preload({ params }) {
-    console.log("params", params);
     let [courseId, courseNavItem, lessonId] = params.id;
     const res = await this.fetch(`api/course?id=${courseId}`);
     const data = await res.json();