import React from 'react';
import { Box, LoadingPlaceholder } from '@nova-hf/ui';

type ListLoaderProps = {
  rows?: number;
  rowHeight?: 8 | 10 | 12 | 14 | 16;
};

export const ListLoader = ({ rows = 3, rowHeight = 12 }: ListLoaderProps) => {
  return (
    <Box display="flex" flexDirection="column" gap={3}>
      {Array(rows)
        .fill(0)
        .map((i, index) => {
          return <LoadingPlaceholder key={index} height={rowHeight} width="100%" />;
        })}
    </Box>
  );
};