feat: Implement course discovery page with browsing, filtering, and detail view, powered by a new useCourse composable.

Frontend-Learner/composables/useCourse.ts

@@ -88,9 +88,34 @@ export const useCourse = () => {
         }
     }
 
+    const enrollCourse = async (courseId: number) => {
+        try {
+            const data = await $fetch<{ code: number; message: string; data: any }>(`${API_BASE_URL}/students/courses/${courseId}/enroll`, {
+                method: 'POST',
+                headers: token.value ? {
+                    Authorization: `Bearer ${token.value}`
+                } : {}
+            })
+
+            return {
+                success: true,
+                data: data.data,
+                message: data.message
+            }
+        } catch (err: any) {
+            console.error('Enroll course failed:', err)
+            return {
+                success: false,
+                error: err.data?.message || err.message || 'Error enrolling in course',
+                code: err.data?.code
+            }
+        }
+    }
+
     return {
         fetchCourses,
-        fetchCourseById
+        fetchCourseById,
+        enrollCourse
     }
 }