aff

apps/web/src/components/models/course/detail/CoursePreview/coursePreviewAllmsg.tsx

@@ -1,33 +1,21 @@
-import { useEffect } from "react";
+import { useContext, useEffect } from "react";
 import { CoursePreviewMsg } from "@web/src/app/main/course/preview/type.ts";
 import { Button, Tabs, Image, Skeleton } from "antd";
 import type { TabsProps } from "antd";
 import { PlayCircleOutlined } from "@ant-design/icons";
-export function CoursePreviewAllmsg({
-	previewMsg,
-	items,
-	isLoading,
-}: {
-	previewMsg?: CoursePreviewMsg;
-	items: TabsProps["items"];
-	isLoading: boolean;
-}) {
-	useEffect(() => {
-		console.log(previewMsg);
-	});
+import { CourseDetailContext } from "../CourseDetailContext";
+export function CoursePreview() {
 	const TapOnChange = (key: string) => {
 		console.log(key);
 	};
+	const { course, isLoading, lecture, lectureIsLoading, selectedLectureId } =
+		useContext(CourseDetailContext);
 	return (
 		<div className="min-h-screen max-w-7xl mx-auto px-6 lg:px-8">
 			<div className="overflow-auto flex justify-around align-items-center w-full mx-auto my-8">
 				<div className="relative w-[600px] h-[340px] m-4 overflow-hidden flex justify-center items-center">
 					<Image
-						src={
-							previewMsg.isLoading
-								? "error"
-								: previewMsg.videoPreview
-						}
+						src={isLoading ? "error" : course?.meta?.thumbnail}
 						alt="example"
 						preview={false}
 						className="w-full h-full object-cover z-0"
@@ -43,13 +31,13 @@ export function CoursePreviewAllmsg({
 					) : (
 						<>
 							<span className="text-3xl font-bold  my-3 ">
-								{previewMsg.Title}
+								{course.title}
 							</span>
 							<span className="text-xl font-semibold my-3 text-gray-700">
-								{previewMsg.SubTitle}
+								{course.subTitle}
 							</span>
 							<span className="text-lg font-light my-3 text-gray-500 text-clip">
-								{previewMsg.Description}
+								{course.Description}
 							</span>
 						</>
 					)}