import { Calendar } from "lucide-react";
import { Card } from "@/components/ui/card";
import AmenitiesManager from "@/components/association/AmenitiesManager";
import { useHomeowner } from "@/contexts/HomeownerContext";

export default function ClientCalendarPage() {
  const { association, loading } = useHomeowner();

  if (loading) {
    return <div className="flex justify-center py-12"><div className="h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent" /></div>;
  }

  return (
    <div className="space-y-6">
      <div>
        <h1 className="text-3xl font-bold text-foreground">Calendar & Intake Forms</h1>
        <p className="text-muted-foreground mt-1">Build rental intake forms, meeting request forms, fees, and booking availability.</p>
      </div>
      {association?.id ? (
        <AmenitiesManager associationId={association.id} />
      ) : (
        <Card className="p-12 text-center text-muted-foreground bg-muted/50">
          <Calendar className="h-8 w-8 mx-auto mb-3 text-muted-foreground/50" />
          <p>No association is linked to this portal yet.</p>
        </Card>
      )}
    </div>
  );
}
