паспорт товара

front/src/features/catalog/ProductCard.tsx

@@ -1,14 +1,20 @@
 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}>
+    <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>