import { Box, Skeleton } from '@mui/material'

export function MatchCenterSkeleton({ count = 4 }: { count?: number }) {
  return (
    <>
      {Array.from({ length: count }).map((_, i) => (
        <Box key={i} sx={{ p: 1.5, borderBottom: '1px solid #f1f5f9' }}>
          <Skeleton variant="text" width="60%" sx={{ fontSize: '1rem', mb: 0.5 }} />
          <Skeleton variant="text" width="40%" sx={{ fontSize: '0.75rem' }} />
          <Skeleton variant="rounded" width={50} height={18} sx={{ mt: 0.5 }} />
        </Box>
      ))}
    </>
  )
}
