training_data/apps/web/src/components/models/course/card/CourseCard.tsx

import { CourseDto } from '@nice/common';
import { Card } from '@web/src/components/presentation/container/Card';
import { CourseHeader } from './CourseHeader';
import { CourseStats } from './CourseStats';

interface CourseCardProps {
    course: CourseDto;
    onClick?: () => void;
}

export const CourseCard = ({ course, onClick }: CourseCardProps) => {
    return (
        <Card onClick={onClick} className="w-full max-w-sm">
            <CourseHeader
                title={course.title}
                subTitle={course.subTitle}
                thumbnail={course.thumbnail}
                level={course.level}
                numberOfStudents={course.numberOfStudents}
                publishedAt={course.publishedAt}
            />
            <CourseStats
                averageRating={course.averageRating}
                numberOfReviews={course.numberOfReviews}
                completionRate={course.completionRate}
                totalDuration={course.totalDuration}
            />
        </Card>
    );
};