import { Skeleton } from '@/components/atoms'

function SkeletonIcon() {
	return <Skeleton className='size-8' />
}

function SkeletonConnects() {
	return <Skeleton className='h-5 w-8' />
}

function SkeletonProfile() {
	return (
		<div className='flex items-center gap-1.5'>
			<Skeleton circle className='size-8' />
			<div className='flex flex-col gap-0.5'>
				<Skeleton size={'sm'} className='h-3.5 w-30' />
				<Skeleton size={'sm'} className='h-3.5 w-20' />
			</div>
		</div>
	)
}

function SkeletonDate() {
	return <Skeleton className='h-5 w-32' />
}

export { SkeletonConnects, SkeletonDate, SkeletonIcon, SkeletonProfile }
