import Link from "next/link";
import type { PublicProperty } from "@/lib/core/contracts";

function formatPrice(property: PublicProperty) {
  if (property.price.kind === "on-request") {
    return "Price on request";
  }

  const formatted = new Intl.NumberFormat("en-AE", {
    style: "currency",
    currency: property.price.currency,
    maximumFractionDigits: 0,
  }).format(property.price.amount);

  return property.price.kind === "from" ? `From ${formatted}` : formatted;
}

export function PropertyCard({ property }: { property: PublicProperty }) {
  return (
    <article className="property-card">
      <div className="property-card__meta">
        <span>{property.transaction === "buy" ? "Buy" : "Off Plan"}</span>
        <span>{property.area}</span>
      </div>
      <h3>{property.title}</h3>
      <p>{property.summary}</p>
      <p className="property-card__price">{formatPrice(property)}</p>
      <div className="property-card__facts">
        <span>{property.bedrooms} beds</span>
        <span>{property.propertyType}</span>
        <span>{property.publicStatus}</span>
      </div>
      <Link className="text-link" href={`/properties/${property.slug}`}>
        View property <span aria-hidden="true">→</span>
      </Link>
    </article>
  );
}