import { Card, CardContent, Skeleton } from '@heroui/react';

type Props = {
  lines?: number;
};

export function LoadingSkeleton({ lines = 3 }: Props) {
  return (
    <div className="flex flex-col gap-3">
      {Array.from({ length: lines }).map((_, i) => (
        <Card key={i}>
          <CardContent className="gap-2 p-5">
            <Skeleton className="h-4 w-3/4 rounded-lg" />
            {i < 2 && <Skeleton className="mt-3 h-3 w-1/2 rounded-lg" />}
          </CardContent>
        </Card>
      ))}
    </div>
  );
}