28 lines
783 B
TypeScript
28 lines
783 B
TypeScript
import { AlertCircle, RefreshCw } from "lucide-react";
|
|||
|
|
|
||
|
|
import { Button } from "@/components/ui/button";
|
||
|
|
|
||
|
|
interface ErrorStateProps {
|
||
|
|
message: string;
|
||
|
|
onRetry?: () => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Consistent error state for data-fetching pages.
|
||
|
|
* Shows the error message with an optional retry button.
|
||
|
|
*/
|
||
|
|
export function ErrorState({ message, onRetry }: ErrorStateProps) {
|
||
|
|
return (
|
||
|
|
<div className="flex flex-col items-center justify-center py-20 text-center">
|
||
|
|
<AlertCircle className="size-10 text-destructive mb-3" />
|
||
|
|
<p className="text-sm text-muted-foreground mb-4 max-w-sm">{message}</p>
|
||
|
|
{onRetry && (
|
||
|
|
<Button variant="outline" onClick={onRetry}>
|
||
|
|
<RefreshCw className="size-4 mr-2" />
|
||
|
|
Retry
|
||
|
|
</Button>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|