my-library/src/pages/Orders.jsx

@@ -1,11 +1,13 @@
 import { useState } from 'react';
 import { createOrder } from '../api/orders';
+import { getBookById } from '../api/books';
 
 export default function Orders() {
   const [customerId, setCustomerId] = useState('');
   const [paymentMethod, setPaymentMethod] = useState('CREDIT_CARD');
   const [address, setAddress] = useState({ street: '', city: '', postalCode: '', country: '' });
   const [lines, setLines] = useState([{ bookId: '', quantity: 1 }]);
+  const [promoCode, setPromoCode] = useState('');
   const [message, setMessage] = useState(null);
   const [submitting, setSubmitting] = useState(false);
 
@@ -21,6 +23,10 @@ export default function Orders() {
     setLines((prev) => [...prev, { bookId: '', quantity: 1 }]);
   }
   function removeLine(index) {
+    const [promoValid, setPromoValid] = useState(true);
+    const [estimate, setEstimate] = useState(null);
+    const [estimating, setEstimating] = useState(false);
+    const [estimateError, setEstimateError] = useState(null);
     setLines((prev) => prev.filter((_, i) => i !== index));
   }
 
@@ -37,6 +43,7 @@ export default function Orders() {
         bookId: Number(line.bookId),
         quantity: Number(line.quantity),
       })),
+      ...(promoCode ? { promoCode } : {}),
     };
 
     createOrder(payload)
@@ -63,6 +70,51 @@ export default function Orders() {
               onChange={(e) => handleLineChange(index, 'bookId', e.target.value)} required />
             <input type="number" placeholder="Quantité" value={line.quantity}
               onChange={(e) => handleLineChange(index, 'quantity', e.target.value)} required />
+    function validatePromo(code) {
+      if (!code) return true;
+      // simple format: PROMO10 => 10% , PROMO5 => 5%
+      return /^PROMO\d{1,2}$/.test(code);
+    }
+
+    async function handleEstimate() {
+      setEstimating(true);
+      setEstimate(null);
+      setEstimateError(null);
+      try {
+        const ids = lines.map((l) => Number(l.bookId)).filter((n) => !Number.isNaN(n) && n > 0);
+        if (ids.length === 0) {
+          setEstimateError('Aucun ISBN valide');
+          return;
+        }
+        const unique = Array.from(new Set(ids));
+        const responses = await Promise.all(unique.map((id) => getBookById(id).then((r) => r.data)));
+        const priceMap = new Map();
+        unique.forEach((id, idx) => priceMap.set(id, responses[idx].prix ?? responses[idx].price ?? 0));
+
+        let total = 0;
+        for (const l of lines) {
+          const id = Number(l.bookId);
+          const qty = Number(l.quantity) || 0;
+          total += (priceMap.get(id) || 0) * qty;
+        }
+
+        let discounted = total;
+        if (promoCode) {
+          const m = promoCode.match(/^PROMO(\d{1,2})$/);
+          if (m) {
+            const pct = Math.max(0, Math.min(100, Number(m[1])));
+            discounted = total * (1 - pct / 100);
+          }
+        }
+
+        setEstimate({ total, discounted });
+      } catch (err) {
+        setEstimateError('Erreur lors de l\'estimation');
+        console.error(err);
+      } finally {
+        setEstimating(false);
+      }
+    }
             {lines.length > 1 && (
               <button type="button" onClick={() => removeLine(index)}>Retirer</button>
             )}
@@ -77,10 +129,27 @@ export default function Orders() {
         <input name="country" placeholder="Pays" value={address.country} onChange={handleAddressChange} required />
 
         <h2>Paiement</h2>
+        <label>Code promo
+          <input value={promoCode} onChange={(e) => { setPromoCode(e.target.value); setPromoValid(validatePromo(e.target.value)); }} placeholder="Code promo (optionnel)" />
+        </label>
+        {!promoValid && <div style={{ color: 'red' }}>Format de code promo invalide (ex: PROMO10)</div>}
         <select value={paymentMethod} onChange={(e) => setPaymentMethod(e.target.value)}>
           <option value="CREDIT_CARD">Carte bancaire</option>
         </select>
 
+        <div style={{ marginTop: 8 }}>
+          <button type="button" onClick={handleEstimate} disabled={estimating}>
+            {estimating ? 'Estimation…' : 'Estimer le total'}
+          </button>
+          {estimateError && <div style={{ color: 'red' }}>{estimateError}</div>}
+          {estimate && (
+            <div>
+              <div>Total estimé : {estimate.total.toFixed(2)} €</div>
+              <div>Après promo : {estimate.discounted.toFixed(2)} €</div>
+            </div>
+          )}
+        </div>
+
         <button type="submit" disabled={submitting}>
           {submitting ? 'Envoi…' : 'Valider la commande'}
         </button>