import { Loader2 } from "lucide-react"
import { cn } from "@/lib/utils"

export interface LoadingSpinnerProps extends React.HTMLAttributes<SVGElement> { }

export function LoadingSpinner({ className, ...props }: LoadingSpinnerProps) {
    return (
        <Loader2
            className={cn("h-4 w-4 animate-spin text-primary", className)}
            {...props}
        />
    )
}

export function LoadingScreen({ text = "Loading..." }: { text?: string }) {
    return (
        <div className="flex h-screen w-full flex-col items-center justify-center gap-3 bg-background/50 backdrop-blur-sm">
            <LoadingSpinner className="h-10 w-10" />
            <p className="text-sm font-medium text-muted-foreground animate-pulse">
                {text}
            </p>
        </div>
    )
}