edit course

Signed-off-by: Kenneth Obsequio <k80308392@gmail.com>

src/modules/admin/pages/courses/EditCourse.jsx

@@ -394,8 +394,7 @@ export default function EditCourse() {
   };
 
   // ─── Form submit (step 0 → step 1) ───────────────────────────────────────
-  const onSubmit = async (values) => {
-    if (isDirty) {
+  const saveBasicInfo = async (values) => {
     const payload = {
       ...values,
       objectives: values.objectives?.map((o, i) => ({
@@ -407,12 +406,48 @@ export default function EditCourse() {
       course_code: values.course_code || null,
       updatedBy: user?.user_id ?? null,
     };
-      const result = await updateCourse(courseId, payload);
+    return updateCourse(courseId, payload);
+  };
+
+  const onSubmit = async (values) => {
+    if (isDirty) {
+      const result = await saveBasicInfo(values);
       if (!result) return;
     }
     setCurrentStep(1);
   };
 
+  // ─── Done — persists any unsaved section before leaving the wizard ───────
+  //
+  // Each section (Categories, Instructors, Badge, Achievements, Product) has
+  // its own "Save X" button and dirty flag, so it's easy to edit a section,
+  // skip its save button, and hit "Done" — which previously just navigated
+  // away and silently discarded that section's changes. Flush every dirty
+  // section here instead of trusting the user caught every save button.
+  const [doneLoading, setDoneLoading] = useState(false);
+  const handleDone = async () => {
+    setDoneLoading(true);
+    try {
+      if (isDirty) {
+        let valid = true;
+        await handleSubmit(
+          async (values) => { valid = !!(await saveBasicInfo(values)); },
+          () => { valid = false; setCurrentStep(0); },
+        )();
+        if (!valid) return;
+      }
+      if (categoriesDirty)   await handleSaveCategories();
+      if (instructorsDirty)  await handleSaveInstructors();
+      if (badgeDirty)        await handleSaveBadge();
+      if (achievementsDirty) await handleSaveAchievements();
+      if (productDirty && productForm.price) await handleSaveProduct();
+
+      navigate(`/admin/courses/${courseId}/view`);
+    } finally {
+      setDoneLoading(false);
+    }
+  };
+
   return (
     <div className="flex flex-col min-h-screen bg-muted/60">
       <PageMeta title={course ? `Edit: ${course.title} - STARR` : undefined} />
@@ -1074,9 +1109,10 @@ export default function EditCourse() {
                 <Button
                   type="button"
                   variant="outline"
-                  onClick={() => navigate(`/admin/courses/${courseId}/view`)}
+                  disabled={doneLoading}
+                  onClick={handleDone}
                 >
-                  <Check className="h-4 w-4 mr-2" />
+                  {doneLoading ? <Spinner className="h-4 w-4 mr-2" /> : <Check className="h-4 w-4 mr-2" />}
                   Done
                 </Button>
               </div>