import React from "react";
import { RefreshCw, TriangleAlert } from "lucide-react";
import { Alert, AlertTitle, AlertDescription } from "@/components/ui/alert";
import { Button } from "@/components/ui/button";

/**
 * ExplorerError
 *
 * Generic error state with retry action.
 * All copy is German (user-facing).
 *
 * @param {{
 *   title: string,
 *   description: string,
 *   onRetry: () => void
 * }} props
 */
export default function ExplorerError({ title, description, onRetry }) {
	return (
		<div className="space-y-3">
			<Alert variant="destructive">
				<TriangleAlert className="h-4 w-4" />
				<AlertTitle>{title}</AlertTitle>
				<AlertDescription>{description}</AlertDescription>
			</Alert>

			<Button type="button" variant="outline" onClick={onRetry}>
				<RefreshCw className="h-4 w-4" />
				Erneut versuchen
			</Button>
		</div>
	);
}