import { cn } from "@/lib/utils";
import { Loader2, AlertCircle, CloudUpload, CloudCheck } from "lucide-react";

export default function ImageStaus({ status, className }: { status: string | null, className?: string }) {
    const base = cn("absolute bottom-1 left-1 w-6 h-6 p-1 rounded-full bg-white/80 dark:bg-black/80 backdrop-blur shadow", className);

    switch (status) {
        case "uploading":
            return <Loader2 className={`${base} animate-spin text-blue-600`} />;
        case "uploaded":
            return <CloudCheck className={`${base} text-green-600`} />;
        case "failed":
            return <AlertCircle className={`${base} text-red-600`} />;
        case "local":
            return <CloudUpload className={`${base} text-yellow-500`} />;
        default:
            return null;
    }
};
