Course admin panel added

frontend/app/courses/[courseId]/lesson/[lessonId]/page.tsx

@@ -6,20 +6,20 @@ import { Loader2 } from "lucide-react"
 import { useAuth } from "@/context/auth-context"
 import { useRouter } from "next/navigation"
 import { toast } from "react-hot-toast"
-import { useState, useEffect } from "react"
+import { useState, useEffect, use } from "react" // ✅ Added 'use' import
 import type { Course } from "@/lib/types"
-import api from "@/lib/api" // Corrected import: default import
+import api from "@/lib/api"
 
 interface CourseDetailPageProps {
-  params: {
+  params: Promise<{ // ✅ Changed to Promise
     courseId: string
     lessonId: string
-  }
+  }>
 }
 
 export default function CourseDetailPage({ params }: CourseDetailPageProps) {
-  const { courseId, lessonId } = params
-  const { user, firebaseUser, isLoadingAuth } = useAuth() // Allow firebaseUser
+  const { courseId, lessonId } = use(params) // ✅ Unwrap params using React.use()
+  const { user, firebaseUser, isLoadingAuth } = useAuth()
   const router = useRouter()
   const [course, setCourse] = useState<Course | null>(null)
   const [isLoadingCourse, setIsLoadingCourse] = useState(true)
@@ -27,7 +27,6 @@ export default function CourseDetailPage({ params }: CourseDetailPageProps) {
 
   useEffect(() => {
     if (!isLoadingAuth && !user && !firebaseUser) {
-      // Allow either MetaMask or Firebase user
       toast.error("Please login to view courses.")
       router.push("/")
       return
@@ -37,7 +36,6 @@ export default function CourseDetailPage({ params }: CourseDetailPageProps) {
       setIsLoadingCourse(true)
       setError(null)
       try {
-        // --- ORIGINAL API CALL (UNCOMMENT WHEN BACKEND IS READY) ---
         const response = await api.get<Course>(`/api/courses/${courseId}`)
         setCourse(response.data)
       } catch (err: any) {
@@ -50,7 +48,6 @@ export default function CourseDetailPage({ params }: CourseDetailPageProps) {
     }
 
     if (user || firebaseUser) {
-      // Only fetch if either user type is logged in
       fetchCourse()
     }
   }, [user, firebaseUser, isLoadingAuth, router, courseId])
@@ -82,7 +79,11 @@ export default function CourseDetailPage({ params }: CourseDetailPageProps) {
 
   return (
     <div className="flex flex-col md:flex-row min-h-[calc(100vh-64px)]">
-      <CourseSidebar courseId={course.id} modules={course.modules} activeLessonId={lessonId} />
+      <CourseSidebar 
+        courseId={course.id} 
+        modules={course.modules} 
+        activeLessonId={lessonId} 
+      />
       <div className="flex-1 p-4 md:p-8 overflow-y-auto">
         <LessonViewer courseId={course.id} lessonId={lessonId} />
       </div>