import Skeleton from 'react-loading-skeleton';
type Props = {
    count?: number; 
};

const BookListSkeleton = ({ count = 10 }: Props) => {
    return (
        <div className="grid md:grid-cols-2 xl:grid-cols-2 gap-6">
            {Array.from({ length: count }).map((_, i) => (
                <div key={i} className="flex gap-4">
                    <Skeleton height={120} width={80} />
                    <div className="flex flex-col gap-2 flex-1">
                        <Skeleton height={16} width="60%" />
                        <Skeleton height={14} width="40%" />
                        <Skeleton count={2} height={12} />
                        <Skeleton height={12} width="50%" />
                    </div>
                </div>
            ))}
        </div>
    );
};

export default BookListSkeleton;