import { Skeleton } from "@/components/ui/skeleton";

export default function ImportBadgesLoading() {
	return (
		<div className="space-y-6">
			<div>
				<Skeleton className="h-9 w-48" />
				<Skeleton className="h-5 w-72 mt-2" />
			</div>
			<div className="rounded-lg border bg-card p-6 space-y-4">
				{Array.from({ length: 6 }, (_, i) => i).map((n) => (
					<div key={`skeleton-field-${n}`} className="space-y-2">
						<Skeleton className="h-4 w-24" />
						<Skeleton className="h-10 w-full" />
					</div>
				))}
				<Skeleton className="h-10 w-24 mt-4" />
			</div>
		</div>
	);
}