diff --git a/src/pages/content-management/AddPracticeFlow.tsx b/src/pages/content-management/AddPracticeFlow.tsx index 360d16d..ec93378 100644 --- a/src/pages/content-management/AddPracticeFlow.tsx +++ b/src/pages/content-management/AddPracticeFlow.tsx @@ -23,6 +23,17 @@ export function AddPracticeFlow() { const backTo = searchParams.get("backTo"); const courseId = searchParams.get("courseId"); const moduleId = searchParams.get("moduleId"); + const lessonId = searchParams.get("lessonId"); + const lessonTitleRaw = searchParams.get("lessonTitle"); + const lessonTitleDisplay = (() => { + const raw = lessonTitleRaw?.trim(); + if (!raw) return null; + try { + return decodeURIComponent(raw); + } catch { + return raw; + } + })(); const isModuleContext = backTo === "module"; const isCourseContext = backTo === "modules"; @@ -251,6 +262,23 @@ export function AddPracticeFlow() {

Create a new immersive practice session for students.

+ {lessonId ? ( +
+

Practice for this lesson

+

+ This session will be associated with lesson{" "} + #{lessonId} + {lessonTitleDisplay ? ( + <> + {" "} + — {lessonTitleDisplay} + + ) : null} + . The module-level flow still uses the same steps; use this context when naming and + configuring the practice. +

+
+ ) : null}
diff --git a/src/pages/content-management/ModuleDetailPage.tsx b/src/pages/content-management/ModuleDetailPage.tsx index 2a69eb1..f486226 100644 --- a/src/pages/content-management/ModuleDetailPage.tsx +++ b/src/pages/content-management/ModuleDetailPage.tsx @@ -398,6 +398,11 @@ export function ModuleDetailPage() { thumbnailGradient={LESSON_THUMB_GRADIENTS[i % LESSON_THUMB_GRADIENTS.length]} onEdit={() => openEditLesson(lesson)} onDelete={() => setDeletingLesson(lesson)} + onAddPractice={() => + navigate( + `/new-content/learn-english/${level}/courses/add-practice?backTo=module&courseId=${courseId}&moduleId=${moduleId}&lessonId=${lesson.id}&lessonTitle=${encodeURIComponent(lesson.title)}`, + ) + } /> ))}
diff --git a/src/pages/content-management/components/VideoCard.tsx b/src/pages/content-management/components/VideoCard.tsx index 4e799c9..cbeba6e 100644 --- a/src/pages/content-management/components/VideoCard.tsx +++ b/src/pages/content-management/components/VideoCard.tsx @@ -1,5 +1,5 @@ import { useEffect, useMemo, useState } from "react"; -import { MoreVertical, Edit2, Play, Pencil, Trash2 } from "lucide-react"; +import { MoreVertical, Edit2, Play, Pencil, Trash2, Calendar } from "lucide-react"; import { Button } from "../../../components/ui/button"; import { Dialog, @@ -38,6 +38,8 @@ interface VideoCardProps { hoverModuleActions?: boolean; onEdit?: () => void; onDelete?: () => void; + /** When set (e.g. on module lesson cards), shows an "Add practice" control scoped to this lesson. */ + onAddPractice?: () => void; onPublish?: () => void; } @@ -51,6 +53,7 @@ export function VideoCard({ onEdit, onDelete, onPublish, + onAddPractice, hoverModuleActions = false, }: VideoCardProps) { const [thumbFailed, setThumbFailed] = useState(false); @@ -342,6 +345,21 @@ export function VideoCard({ {title} + {hoverModuleActions && onAddPractice ? ( + + ) : null} + {/* Actions (footer) — not used for API lesson cards with hover tools */} {!hoverModuleActions ? (