28 lines
885 B
JavaScript
28 lines
885 B
JavaScript
import Link from "next/link";
|
|
import { getStatusClass } from "@/components/petUtils";
|
|
|
|
export default function PetCard({petId, petName, petSpecies, petStatus, imageUrl}) {
|
|
return (
|
|
<Link href={`/adopt/${petId}`} className="pet-card">
|
|
<div className="pet-card-image-wrapper">
|
|
<img
|
|
src={imageUrl || "/images/pet-placeholder.png"}
|
|
alt={petName}
|
|
className="pet-card-image"
|
|
onError={(e) => {
|
|
e.currentTarget.onerror = null;
|
|
e.currentTarget.src = "/images/pet-placeholder.png";
|
|
}}
|
|
/>
|
|
</div>
|
|
<div className="pet-card-body">
|
|
<h3 className="pet-card-name">{petName}</h3>
|
|
<p className="pet-card-species">{petSpecies}</p>
|
|
<span className={`pet-card-status ${getStatusClass(petStatus)}`}>
|
|
{petStatus}
|
|
</span>
|
|
</div>
|
|
</Link>
|
|
);
|
|
}
|