Blanks Exercises were removing the blanks on the editor and text but not on solutions, added submit and preview to writing and reading

src/components/ExamEditor/SettingsEditor/writing.tsx

@@ -11,13 +11,17 @@ import useExamEditorStore from "@/stores/examEditor";
 import { useRouter } from "next/router";
 import { usePersistentExamStore } from "@/stores/examStore";
 import openDetachedTab from "@/utils/popout";
-import { WritingExercise } from "@/interfaces/exam";
+import { WritingExam, WritingExercise } from "@/interfaces/exam";
 import { v4 } from "uuid";
+import axios from "axios";
+import { playSound } from "@/utils/sound";
+import { toast } from "react-toastify";
 
 const WritingSettings: React.FC = () => {
     const router = useRouter();
-    const [preview, setPreview] = useState({canPreview: false, openTab: () => {}});
-    const { currentModule } = useExamEditorStore();
+    const [canPreviewOrSubmit, setCanPreviewOrSubmit] = useState(false);
+
+    const { currentModule, title } = useExamEditorStore();
     const {
         minTimer,
         difficulty,
@@ -26,7 +30,7 @@ const WritingSettings: React.FC = () => {
         focusedSection,
     } = useExamEditorStore((store) => store.modules["writing"]);
 
-    const states = sections.flatMap((s)=> s.state) as WritingExercise[];
+    const states = sections.flatMap((s) => s.state) as WritingExercise[];
 
     const {
         setExam,
@@ -73,34 +77,73 @@ const WritingSettings: React.FC = () => {
     }, [updateLocalAndScheduleGlobal]);
 
     useEffect(() => {
-        const openTab = () => {
-            setExam({
-                isDiagnostic: false,
-                minTimer,
-                module: "writing",
-                exercises: states.filter((s) => s.prompt && s.prompt !== ""),
-                id: v4(),
-                variant: undefined,
-                difficulty,
-                private: isPrivate,
-            });
-            setExerciseIndex(0);
-            openDetachedTab("popout?type=Exam&module=writing", router)
-        }
-        setPreview({
-            canPreview: states.some((s) => s.prompt && s.prompt !== ""),
-            openTab
-        })
+        setCanPreviewOrSubmit(states.some((s) => s.prompt !== ""))
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [states.some((s) => s.prompt !== "")])
 
+    const openTab = () => {
+        setExam({
+            exercises: sections.map((s) => {
+                const exercise = s.state as WritingExercise;
+                return {
+                    ...exercise,
+                    intro: s.settings.currentIntro,
+                    category: s.settings.category
+                };
+            }),
+            minTimer,
+            module: "writing",
+            id: title,
+            isDiagnostic: false,
+            variant: undefined,
+            difficulty,
+            private: isPrivate,
+        });
+        setExerciseIndex(0);
+        openDetachedTab("popout?type=Exam&module=writing", router)
+    }
+
+    const submitWriting = () => {
+        const exam: WritingExam = {
+            exercises: sections.map((s) => {
+                const exercise = s.state as WritingExercise;
+                return {
+                    ...exercise,
+                    intro: localSettings.currentIntro,
+                    category: localSettings.category
+                };
+            }),
+            minTimer,
+            module: "writing",
+            id: title,
+            isDiagnostic: false,
+            variant: undefined,
+            difficulty,
+            private: isPrivate,
+        };
+
+        axios
+            .post(`/api/exam/reading`, exam)
+            .then((result) => {
+                playSound("sent");
+                toast.success(`Submitted Exam ID: ${result.data.id}`);
+            })
+            .catch((error) => {
+                console.log(error);
+                toast.error(error.response.data.error || "Something went wrong while submitting, please try again later.");
+            })
+    }
+
     return (
         <SettingsEditor
             sectionLabel={`Task ${focusedSection}`}
             sectionId={focusedSection}
             module="writing"
             introPresets={[defaultPresets[focusedSection - 1]]}
-            preview={preview.openTab}
-            canPreview={preview.canPreview}
+            preview={openTab}
+            canPreview={canPreviewOrSubmit}
+            canSubmit={canPreviewOrSubmit}
+            submitModule={submitWriting}
         >
             <Dropdown
                 title="Generate Instructions"