fix some issues

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

@@ -271,6 +271,7 @@ export default function AddCourse() {
         unit_id: u.unit_id,
         title: u.title,
         description: u.description,
+        requirements: u.requirements ?? [],
         lessons: u.lessons.map((l) => ({
           lesson_id: l.lesson_id,
           title: l.title,

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

@@ -1,5 +1,5 @@
 import { useEffect, useState, useCallback } from "react";
-import { useNavigate, useParams } from "react-router-dom";
+import { useNavigate, useParams, useSearchParams } from "react-router-dom";
 import { useForm, useFieldArray, useWatch } from "react-hook-form";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -14,6 +14,7 @@ import { TIER_COLOR_OPTIONS } from "@/utils/tierColors";
 import { AssetPickerSheet } from "@/components/generic/AssetPickerSheet";
 import { PageMeta } from "@/contexts/MetadataContext";
 import CourseInstructorPicker from "@/modules/admin/components/courses/CourseInstructorPicker";
+import UnitsTable from "@/modules/admin/components/courses/UnitsTable";
 import CoursePrerequisiteBuilder from "@/modules/admin/components/courses/CoursePrerequisiteBuilder";
 import { useCategories } from "@/contexts/AdminCategoriesContext";
 import { useAuth } from "@/contexts/AuthContext";
@@ -61,6 +62,7 @@ const schema = z.object({
 
 const STEPS = [
   { label: "Basic Info",     description: "Title, level & objectives" },
+  { label: "Units",          description: "Roadmap for this course"   },
   { label: "Categories",     description: "Tags & instructors"         },
   { label: "Rewards",        description: "Badge & achievements"       },
   { label: "Requirements",   description: "Prerequisites & completion"  },
@@ -157,7 +159,12 @@ export default function EditCourse() {
   const { categories: allCategories, fetchCategories } = useCategories();
   const { user } = useAuth();
 
-  const [currentStep, setCurrentStep] = useState(0);
+  const [searchParams] = useSearchParams();
+  const initialStep = Math.min(
+    Math.max(Number(searchParams.get("step")) || 0, 0),
+    STEPS.length - 1,
+  );
+  const [currentStep, setCurrentStep] = useState(initialStep);
 
   // ─── Tier categories ──────────────────────────────────────────────────────
   const [tierCategories, setTierCategories] = useState([]);
@@ -751,8 +758,18 @@ export default function EditCourse() {
               </>
             )}
 
-            {/* ── Step 1: Categories & Instructors ── */}
+            {/* ── Step 1: Units ── */}
             {currentStep === 1 && (
+              <SectionCard
+                title="Units"
+                description="This course's roadmap. Units live independently in the shared Units Library — creating one here attaches it automatically, and attaching an existing one reuses it without copying."
+              >
+                <UnitsTable courseId={courseId} returnTo={`/admin/courses/${courseId}/edit?step=1`} />
+              </SectionCard>
+            )}
+
+            {/* ── Step 2: Categories & Instructors ── */}
+            {currentStep === 2 && (
               <>
                 <SectionCard title="Categories" description="Assign this course to one or more categories for browsing.">
                   {selectedCategoryIds.length > 0 && (
@@ -900,8 +917,8 @@ export default function EditCourse() {
               </>
             )}
 
-            {/* ── Step 2: Rewards ── */}
-            {currentStep === 2 && (
+            {/* ── Step 3: Rewards ── */}
+            {currentStep === 3 && (
               <SectionCard
                 title="Rewards"
                 description="Badge and achievements awarded to learners who complete this course."
@@ -1109,8 +1126,8 @@ export default function EditCourse() {
               </SectionCard>
             )}
 
-            {/* ── Step 3: Prerequisites & Completion Requirements ── */}
-            {currentStep === 3 && (
+            {/* ── Step 4: Prerequisites & Completion Requirements ── */}
+            {currentStep === 4 && (
               <>
                 <SectionCard
                   title="Prerequisites"
@@ -1153,8 +1170,8 @@ export default function EditCourse() {
               </>
             )}
 
-            {/* ── Step 4: Pricing ── */}
-            {currentStep === 4 && (
+            {/* ── Step 5: Pricing ── */}
+            {currentStep === 5 && (
               <SectionCard
                 title="Product Listing"
                 description="Allow learners to purchase this course individually via PayPal."

src/modules/admin/pages/courses/units/AddUnit.jsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { useNavigate, useParams } from "react-router-dom";
+import { useNavigate, useParams, useLocation } from "react-router-dom";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -35,10 +35,13 @@ function FieldError({ message }) {
 
 export default function AddUnit() {
   const navigate = useNavigate();
+  const location = useLocation();
   const { courseId } = useParams();
   const { createUnit, fetchCourse, course, loading, syncUnitRequirements } = useCourses();
   const { user } = useAuth();
 
+  const backTarget = location.state?.returnTo ?? `/admin/courses/${courseId}/units`;
+
   const [step, setStep] = useState(0);
   const [requirements, setRequirements] = useState([]);
 
@@ -72,7 +75,7 @@ export default function AddUnit() {
     }
 
     bypassOnce();
-    navigate(`/admin/courses/${courseId}/units`);
+    navigate(backTarget);
   };
 
   return (
@@ -86,13 +89,15 @@ export default function AddUnit() {
               type="button"
               variant="ghost"
               size="icon"
-              onClick={() => (step === 0 ? navigate(`/admin/courses/${courseId}/units`) : setStep(0))}
+              onClick={() => (step === 0 ? navigate(backTarget) : setStep(0))}
             >
               <ChevronLeft className="h-4 w-4" />
             </Button>
             <div>
               <h1 className="text-xl font-semibold">Create Unit</h1>
-              <p className="text-sm text-muted-foreground">Add a new unit to this course.</p>
+              <p className="text-sm text-muted-foreground">
+                Creates a new unit in the shared Units Library and attaches it to this course.
+              </p>
             </div>
           </div>
 
@@ -169,7 +174,7 @@ export default function AddUnit() {
             <Button
               type="button"
               variant="outline"
-              onClick={() => (step === 0 ? navigate(`/admin/courses/${courseId}/units`) : setStep(0))}
+              onClick={() => (step === 0 ? navigate(backTarget) : setStep(0))}
               disabled={loading}
             >
               <ChevronLeft className="h-4 w-4 mr-1" />