"use client"; import Image from "next/image"; import Link from "next/link"; import { Car } from "@/lib/data"; import { Fuel, Users, Gauge, Star } from "lucide-react"; interface CarCardProps { car: Car; priority?: boolean; } const WHATSAPP_NUMBER = "212651621512"; export default function CarCard({ car, priority = false }: CarCardProps) { const waMsg = encodeURIComponent( `Bonjour Setocar! 🚗\n\nJe suis intéressé(e) par la location de: *${car.name}*\n💰 Prix: ${car.pricePerDay} MAD/jour\n\nPouvez-vous me confirmer la disponibilité?\n\nMerci!` ); return (
{/* Badge */} {car.badge && (
{car.badge}
)} {/* Category chip */}
{car.categoryLabel}
{/* Car Image */}
{`${car.name}
{/* Content */}
{/* Rating */}
{Array.from({ length: 5 }, (_, i) => ( ))} {car.rating} ({car.reviews} avis)
{/* Name */}

{car.name}

{/* Specs */}
} label={car.fuel} /> } label={car.transmission === "automatic" ? "Auto" : "Manuel"} /> } label={`${car.seats} pl.`} />
{/* Price + CTA */}
{car.pricePerDay} MAD/jour
{ (e.currentTarget as HTMLElement).style.borderColor = "#e85c1a"; (e.currentTarget as HTMLElement).style.color = "#e85c1a"; }} onMouseLeave={(e) => { (e.currentTarget as HTMLElement).style.borderColor = "#2a3050"; (e.currentTarget as HTMLElement).style.color = "rgba(255,255,255,0.7)"; }} > Détails Réserver
); } function SpecItem({ icon, label }: { icon: React.ReactNode; label: string }) { return (
{icon} {label}
); }