44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import Text from "./lib_components/text";
|
|
|
|
interface ErrorStateProps {
|
|
message?: string;
|
|
onRetry?: () => void;
|
|
}
|
|
|
|
export const ErrorState = ({ message, onRetry }: ErrorStateProps) => {
|
|
return (
|
|
<div className="col-span-full flex flex-col items-center justify-center py-20 px-4">
|
|
<div className="w-24 h-24 mb-6 rounded-full bg-red-100 flex items-center justify-center">
|
|
<svg
|
|
className="w-12 h-12 text-red-500"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M12 9v2m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<h3 className="text-2xl font-bold text-[#0c1239] mb-2">
|
|
<Text txt="errorTitle" />
|
|
</h3>
|
|
{message && (
|
|
<p className="text-gray-500 text-center max-w-md mb-4">{message}</p>
|
|
)}
|
|
{onRetry && (
|
|
<button
|
|
onClick={onRetry}
|
|
className="bg-secondary p-3 px-6 rounded-lg border-2 border-secondary text-white
|
|
hover:cursor-pointer hover:bg-white hover:text-secondary transition-all"
|
|
>
|
|
<Text txt="retry" />
|
|
</button>
|
|
)}
|
|
</div>
|
|
);
|
|
};
|