fixed some bugs: filter, detail

src/pages/ProductDetail/index.jsx

@@ -63,6 +63,18 @@ const ProductPage = ({
     favoriteProducts.some((fav) => fav.product?.id === product?.id),
   );
 
+  const [isDescExpanded, setIsDescExpanded] = useState(false);
+  const [showReadMore, setShowReadMore] = useState(false);
+  const descRef = React.useRef(null);
+  const productInfoRef = React.useRef(null);
+
+  useEffect(() => {
+    if (!product?.description) return;
+
+    const plainText = product.description.replace(/<[^>]*>/g, "").trim();
+    setShowReadMore(plainText.length > 300);
+  }, [product?.description]);
+
   const { getCartItem } = useCart();
 
   const [addToCart] = useAddToCartMutation();
@@ -319,7 +331,7 @@ const ProductPage = ({
         </div>
 
         {/* KOLON 2: İsim + Meta + Description */}
-        <div className={styles.productInfo}>
+        <div className={styles.productInfo} ref={productInfoRef}>
           {/* Meta tablo */}
           <div className={styles.productMeta}>
             <h1 className={styles.productTitle}>{product.name}</h1>
@@ -374,9 +386,28 @@ const ProductPage = ({
                 </p>
               </div>
               <div
-                className={styles.productDescription}
+                ref={descRef}
+                className={`${styles.productDescription} ${
+                  !isDescExpanded ? styles.productDescriptionCollapsed : ""
+                }`}
                 dangerouslySetInnerHTML={{ __html: product.description }}
               />
+              {showReadMore && !isDescExpanded && (
+                <button
+                  className={styles.readMoreBtn}
+                  onClick={() => setIsDescExpanded(true)}
+                >
+                  {t("product.readMore")}
+                </button>
+              )}
+              {showReadMore && isDescExpanded && (
+                <button
+                  className={styles.readMoreBtn}
+                  onClick={() => setIsDescExpanded(false)}
+                >
+                  {t("product.readLess")}
+                </button>
+              )}
             </div>
           )}
         </div>