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

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

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

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

export default PublicCourses;
