26 lines
758 B
TypeScript
26 lines
758 B
TypeScript
type Product = {
|
|
id: string;
|
|
name: string;
|
|
image_url: string;
|
|
brand: { name: string };
|
|
description?: string;
|
|
price?: number;
|
|
vendor?: string;
|
|
};
|
|
|
|
export function ProductCard({ product }: { product: Product }) {
|
|
return (
|
|
<div className="border rounded-xl p-4 shadow hover:shadow-md transition">
|
|
<img
|
|
src={product.image_url}
|
|
alt={product.name}
|
|
className="w-full h-40 object-contain mb-4"
|
|
/>
|
|
<h3 className="text-lg font-semibold">{product.name}</h3>
|
|
<p className="text-sm text-gray-500">{product.brand?.name}</p>
|
|
{product.price && (
|
|
<p className="text-md font-bold mt-2">${product.price.toFixed(2)}</p>
|
|
)}
|
|
</div>
|
|
);
|
|
} |