-
Notifications
You must be signed in to change notification settings - Fork 0
/
allCourses.tsx
46 lines (38 loc) · 1.5 KB
/
allCourses.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
import { useContext } from "react";
import CourseParameters from "@/components/Course/CourseParameters";
import NoCoursesFoundMessage from "@/components/Course/NoCoursesFoundMessage";
import { CourseContext } from "@/components/CourseContextProvider";
import Shimmer from "../components/Shimmer/Shimmer";
function AllCourses() {
const{courseState}=useContext(CourseContext)
return (
<div className=" bg-black p-2">
<p className="text-2xl text-orange-600 font-bold pt-5 flex justify-center w-full">
All Courses
</p>
<p className="hidden md:flex justify-center font-medium p-2 text-slate-300">
Welcome to our extensive collection of courses. Discover a world of
knowledge and opportunities to learn and grow.
</p>
<div className="h-[1200px] flex flex-wrap justify-center gap-10 overflow-auto mt-5">
{courseState.isLoading ? (
<div>
<Shimmer />
<Shimmer />
</div>
) : (
courseState.allCourses && courseState.allCourses.length > 0 ? (
<CourseParameters courses={courseState.allCourses} type='all'/>
) : (
<NoCoursesFoundMessage type='all'/>
)
)}
</div>
<p className="text-gray-400 mb-4 flex justify-center">
Don't hesitate to reach out if you have any questions or need guidance
in choosing the right course for you.
</p>
</div>
)
}
export default AllCourses;