import CommonContainer from "@/components/elements/CommonContainer"
import { Card, CardContent } from "@/components/ui/card"
import { Progress } from "@/components/ui/progress"
import { CourseData } from "@/helpers/apiSchema/course.schema"

const CourseProgress :React.FC<{courseData : Record<string,any>}> = ({courseData}) => {
  return(
    <CommonContainer className="!px-0">
      <Card>
          <CardContent className="py-6">
              <h3 className="text-lg font-semibold mb-4">Your Progress</h3>
              <Progress value={(((courseData?.selfEnrollment?.maxPage) / courseData?.totalPages) * 100)} className="mb-2 " />
              <p className="text-sm text-gray-500 text-center">
                  {((courseData?.selfEnrollment?.maxPage) / courseData?.totalPages) * 100 }% Complete
              </p>
          </CardContent>
      </Card>
    </CommonContainer>
  )
}

export default CourseProgress