Spaces:
Build error
Build error
File size: 1,369 Bytes
75fefa7 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 |
"use client";
import React from "react";
import { cn } from "@/utils/cn";
import { CoreFlame } from "@/components/shared/effects/flame";
interface LoadingStateProps {
message?: string;
showFlame?: boolean;
size?: "sm" | "md" | "lg";
className?: string;
}
export function LoadingState({
message = "Loading...",
showFlame = true,
size = "md",
className,
}: LoadingStateProps) {
const sizeClasses = {
sm: "min-h-[200px]",
md: "min-h-[300px]",
lg: "min-h-[400px]",
};
const spinnerSizes = {
sm: "w-6 h-6",
md: "w-8 h-8",
lg: "w-10 h-10",
};
return (
<div
className={cn(
"relative flex flex-col items-center justify-center",
sizeClasses[size],
className,
)}
>
{/* Subtle pulsing flame */}
{showFlame && (
<div className="absolute inset-0">
<CoreFlame className="opacity-10 animate-pulse" />
</div>
)}
<div className="relative z-10 space-y-4">
{/* Spinner */}
<div
className={cn(
"mx-auto rounded-full border-2 border-black-alpha-20 border-t-heat-100 animate-spin",
spinnerSizes[size],
)}
/>
{/* Message */}
{message && (
<p className="text-body-medium text-black-alpha-64">{message}</p>
)}
</div>
</div>
);
}
|