import { AlertCircle, RefreshCw } from "lucide-react";
import { Button } from "@/components/ui/button";
import { getUserFacingErrorMessage } from "@/utils/errorHandlers";

export function PlannerPageState({ loading, error, onRetry }: {
  loading: boolean;
  error: string | null;
  onRetry: () => void;
}) {
  if (loading) return <div className="page-shell"><div className="surface-card animate-pulse p-8">Chargement…</div></div>;
  if (!error) return null;
  return <div className="page-shell"><div className="surface-card mx-auto max-w-xl p-8 text-center" role="alert">
    <AlertCircle className="mx-auto mb-3 text-destructive" />
    <h1 className="text-xl font-semibold">Impossible de charger cette page</h1>
    <p className="my-3 text-muted-foreground">{getUserFacingErrorMessage(error)}</p>
    <Button onClick={onRetry}><RefreshCw className="mr-2 h-4 w-4" />Réessayer</Button>
  </div></div>;
}