25 lines
620 B
TypeScript
25 lines
620 B
TypeScript
import React from "react";
|
|
import type { Product } from "../../types/product";
|
|
import styles from "./Catalog.module.css";
|
|
import { useNavigate } from "react-router-dom";
|
|
|
|
interface Props {
|
|
product: Product;
|
|
}
|
|
|
|
const ProductCard: React.FC<Props> = ({ product }) => {
|
|
const navigate = useNavigate();
|
|
|
|
return (
|
|
<div
|
|
className={styles.card}
|
|
onClick={() => navigate(`/product/${product.id}`)}
|
|
>
|
|
<img src={product.image} alt={product.name} />
|
|
<p className={styles.name}>{product.name}</p>
|
|
<button className={styles.plus}>+</button>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ProductCard; |