diff --git a/src/pages/content-management/ContentManagementLayout.tsx b/src/pages/content-management/ContentManagementLayout.tsx index 5e7dfa0..6b58302 100644 --- a/src/pages/content-management/ContentManagementLayout.tsx +++ b/src/pages/content-management/ContentManagementLayout.tsx @@ -6,7 +6,6 @@ const tabs = [ { label: "Courses", to: "/content/courses" }, { label: "Human Language", to: "/content/human-language" }, { label: "Flows", to: "/content/flows" }, - { label: "Speaking", to: "/content/speaking" }, { label: "Practice", to: "/content/practices" }, { label: "Questions", to: "/content/questions" }, ] diff --git a/src/pages/content-management/HumanLanguagePage.tsx b/src/pages/content-management/HumanLanguagePage.tsx index f5d911a..03a4b98 100644 --- a/src/pages/content-management/HumanLanguagePage.tsx +++ b/src/pages/content-management/HumanLanguagePage.tsx @@ -5,17 +5,17 @@ import { Card, CardContent, CardHeader, CardTitle } from "../../components/ui/ca import { Button } from "../../components/ui/button" import { SpinnerIcon } from "../../components/ui/spinner-icon" import { getCourseCategories, getCoursesByCategory, getHumanLanguageLessonsByCourse } from "../../api/courses.api" -import type { Course, CourseCategory, HumanLanguageLesson } from "../../types/course.types" +import type { Course, HumanLanguageLesson } from "../../types/course.types" const CEFR_LEVELS = ["A1", "A2", "A3", "B1", "B2", "B3", "C1", "C2", "C3"] as const type CefrLevel = (typeof CEFR_LEVELS)[number] export function HumanLanguagePage() { const [loading, setLoading] = useState(false) - const [categories, setCategories] = useState([]) const [courses, setCourses] = useState([]) const [selectedCategoryId, setSelectedCategoryId] = useState(null) const [selectedCourseId, setSelectedCourseId] = useState(null) + const [selectedLessonId, setSelectedLessonId] = useState("ALL") const [selectedLevel, setSelectedLevel] = useState("ALL") const [collapsedLevels, setCollapsedLevels] = useState([]) const [lessonsByLevel, setLessonsByLevel] = useState>( @@ -28,7 +28,6 @@ export function HumanLanguagePage() { try { const res = await getCourseCategories() const items = res.data?.data?.categories ?? [] - setCategories(items) const humanLanguageCategory = items.find((c) => c.name.toLowerCase().includes("human language")) ?? items.find((c) => c.name.toLowerCase().includes("language")) ?? @@ -50,6 +49,7 @@ export function HumanLanguagePage() { const items = res.data?.data?.courses ?? [] setCourses(items) setSelectedCourseId(items[0]?.id ?? null) + setSelectedLessonId("ALL") } finally { setLoading(false) } @@ -85,6 +85,18 @@ export function HumanLanguagePage() { () => (selectedLevel === "ALL" ? CEFR_LEVELS : [selectedLevel]).map((level) => ({ level, rows: lessonsByLevel[level] })), [lessonsByLevel, selectedLevel], ) + const lessonOptions = useMemo(() => { + const seen = new Set() + const options: { id: number; title: string }[] = [] + for (const rows of Object.values(lessonsByLevel)) { + for (const lesson of rows) { + if (seen.has(lesson.id)) continue + seen.add(lesson.id) + options.push({ id: lesson.id, title: lesson.title }) + } + } + return options.sort((a, b) => a.title.localeCompare(b.title)) + }, [lessonsByLevel]) const toggleLevel = (level: CefrLevel) => { setCollapsedLevels((prev) => (prev.includes(level) ? prev.filter((l) => l !== level) : [...prev, level])) @@ -112,21 +124,7 @@ export function HumanLanguagePage() {
- - -
-
- + + setSelectedLessonId(e.target.value === "ALL" ? "ALL" : Number(e.target.value)) + } + > + + {lessonOptions.map((lesson) => ( + + ))} + +