import { useState } from "react";
import CoursesVideoPlayer from "@/components/CoursesVideoPlayer";
import CourseList from "@/components/CourseList";
import StageProgress from "@/components/StageProgress";
import { mockData } from "@/data/mockData";
import "./index.css";

const LivePage = () => {
  const [selectedCourse, setSelectedCourse] = useState(null);

  const handleCourseClick = (course) => {
    setSelectedCourse(course);
  };

  return (
    <div className="live-page">
      <StageProgress />
      <div className="live-page-content">
        <CoursesVideoPlayer selectedCourse={selectedCourse} teacherData={mockData.teacherData} unitPosters={mockData.unitPosters} />
        <CourseList onCourseClick={handleCourseClick} />
      </div>
    </div>
  );
};

export default LivePage;
