39 lines
1.5 KiB
JavaScript
39 lines
1.5 KiB
JavaScript
import { Skeleton } from "@/components/ui/skeleton"
|
|
|
|
const SoldOutModalSkeleton = () => {
|
|
return (
|
|
<>
|
|
<div className='mt-4 flex flex-col gap-6'>
|
|
<div className='rounded-md p-2 bg-muted flex items-center gap-4'>
|
|
<Skeleton className='h-20 w-20 rounded-md' />
|
|
<div className='w-full'>
|
|
<Skeleton className='h-5 w-3/5 mb-2' />
|
|
<Skeleton className='h-7 w-2/5' />
|
|
</div>
|
|
</div>
|
|
<Skeleton className='h-5 w-4/5' />
|
|
|
|
{/* Buyers list skeletons */}
|
|
{[1, 2, 3].map((item) => (
|
|
<div key={item} className='flex justify-between'>
|
|
<div className='flex gap-4 items-center'>
|
|
<Skeleton className='h-12 w-12 rounded-full' />
|
|
<Skeleton className='h-4 w-24' />
|
|
</div>
|
|
<Skeleton className='h-4 w-4 rounded-full' />
|
|
</div>
|
|
))}
|
|
|
|
<div className='pt-6 pb-1 border-t flex items-center justify-between'>
|
|
<div className='flex items-center gap-2'>
|
|
<Skeleton className='h-4 w-4' />
|
|
<Skeleton className='h-4 w-1/3' />
|
|
</div>
|
|
<Skeleton className='h-10 w-1/4 rounded-md' />
|
|
</div>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default SoldOutModalSkeleton
|