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-100/30 bg-danger-50/10">
      <CardContent className="flex flex-col items-center gap-3 py-8">
        <div className="flex size-12 items-center justify-center rounded-full bg-danger-500/10 text-danger-400">
          <AlertTriangle size={24} />
        </div>
        <p className="text-small text-default-500">{message}</p>
        {onRetry && (
          <button className="flex items-center gap-1 text-tiny text-primary-400 hover:text-primary-300 transition-colors" onClick={onRetry}>
            <RefreshCw size={12} /> Erneut versuchen
          </button>
        )}
      </CardContent>
    </Card>
  );
}
