chore: build

frontend-prep/src/pages/User/ProductDetail.tsx

@@ -106,10 +106,17 @@ function ProductDetail() {
                                     quantity: number;
                                     price: number;
                                     active_price?: boolean;
+                                    promo_price?: number;
+                                    promo_percent?: number;
                                 }) => ({
                                     quantity: parseFloat(String(p.quantity)),
                                     price: parseFloat(String(p.price)),
                                     active_price: p.active_price,
+                                    promo_price:
+                                        p.promo_price != null
+                                            ? parseFloat(String(p.promo_price))
+                                            : undefined,
+                                    promo_percent: p.promo_percent,
                                 }),
                             ) || [],
                 };
@@ -118,8 +125,9 @@ function ProductDetail() {
 
                 // initialise le prix par défaut (float)
                 if (fixedProduct.prices.length > 0) {
-                    setSelectedGrams(fixedProduct.prices[0].quantity);
-                    setSelectedPrice(fixedProduct.prices[0].price);
+                    const first = fixedProduct.prices[0];
+                    setSelectedGrams(first.quantity);
+                    setSelectedPrice(first.promo_price ?? first.price);
                 }
 
                 // Couleur de la catégorie depuis la DB
@@ -152,7 +160,11 @@ function ProductDetail() {
         );
 
         if (priceOption) {
-            setSelectedPrice(parseFloat(String(priceOption.price)));
+            setSelectedPrice(
+                priceOption.promo_price != null
+                    ? parseFloat(String(priceOption.promo_price))
+                    : parseFloat(String(priceOption.price)),
+            );
         }
     };
 
@@ -301,13 +313,29 @@ function ProductDetail() {
                     <div className="product-info-section">
                         <h1 className="product-detail-name">{product.name}</h1>
 
-                        {selectedPrice > 0 && (
-                            <p className="product-detail-price">
-                                {selectedPrice.toFixed(2)} €{" "}
-                                {selectedGrams &&
-                                    `pour ${selectedGrams}${product.unit || "g"}`}
-                            </p>
-                        )}
+                        {selectedPrice > 0 && (() => {
+                            const selectedTier = product.prices?.find(
+                                (p) => p.quantity === selectedGrams,
+                            );
+                            const hasPromo =
+                                selectedTier?.promo_price != null &&
+                                selectedTier.promo_price < selectedTier.price;
+                            return (
+                                <p className="product-detail-price">
+                                    {hasPromo && (
+                                        <span style={{ textDecoration: "line-through", opacity: 0.6, marginRight: 8 }}>
+                                            {selectedTier!.price.toFixed(2)} €
+                                        </span>
+                                    )}
+                                    <span style={hasPromo ? { color: "#22c55e" } : undefined}>
+                                        {selectedPrice.toFixed(2)} €
+                                    </span>{" "}
+                                    {selectedGrams &&
+                                        `pour ${selectedGrams}${product.unit || "g"}`}
+                                    {hasPromo && ` (-${selectedTier!.promo_percent}%)`}
+                                </p>
+                            );
+                        })()}
 
                         <div className="product-description">
                             <h3>Description</h3>
@@ -345,7 +373,9 @@ function ProductDetail() {
                                                 >
                                                     {p.quantity}
                                                     {product.unit || "g"} -{" "}
-                                                    {p.price.toFixed(2)} €
+                                                    {p.promo_price != null && p.promo_price < p.price
+                                                        ? `${p.promo_price.toFixed(2)} € (au lieu de ${p.price.toFixed(2)} €, -${p.promo_percent}%)`
+                                                        : `${p.price.toFixed(2)} €`}
                                                 </option>
                                             ))}
                                     </select>