import { Card, CardContent } from '@heroui/react';
import { AlertTriangle, RefreshCw } from 'lucide-react';

type Props = {
  message?: string;
  onRetry?: () => void;
};

export function ErrorState({ message = 'Ein Fehler ist aufgetreten', onRetry }: Props) {
  return (
    <Card className="border border-danger-soft bg-danger-soft/40">
      <CardContent className="flex flex-col items-center gap-3 py-8">
        <div className="flex size-12 items-center justify-center rounded-full bg-danger-soft text-danger">
          <AlertTriangle size={24} />
        </div>
        <p className="text-sm text-muted">{message}</p>
        {onRetry && (
          <button className="flex items-center gap-1 text-xs text-accent hover:opacity-80 transition-opacity" onClick={onRetry}>
            <RefreshCw size={12} /> Erneut versuchen
          </button>
        )}
      </CardContent>
    </Card>
  );
}