Faut fixer les appels d'api

GrossesMitaines/grosses-mitaines-ui/src/components/InvoiceItem.js

@@ -1,4 +1,7 @@
-const InvoiceItem = ({ invoice }) => {
+import { faTimes } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+const InvoiceItem = ({ invoice, onCancel }) => {
 
     const productTotal = (p) => {
         return (p.quantity * (p.product.status == 3 || p.product.status == 4 ? p.product.promoPrice : p.product.price))
@@ -79,7 +82,6 @@ const InvoiceItem = ({ invoice }) => {
         }
     }
 
-
     return (
 
         <div className="invoice-item-container">
@@ -101,7 +103,11 @@ const InvoiceItem = ({ invoice }) => {
                 </div>
             </div>
             <div className="invoice-item-products">
-                <h4>Produits</h4>
+                <div className="invoice-product-delete">
+                    <h4 className='simple-item-title' >Produits</h4>
+                    <h1 className='simple-item-buttons'><FontAwesomeIcon icon={faTimes} className='btn-effacer-morceau' style={{ color: "red", cursor: 'pointer', margin: 'auto'}}
+                        onClick={() => onCancel(invoice.id)} /></h1>
+                </div>
                 <ul className="invoice-item-product-list">
                     {invoice.products.map((p) => (
                         <li key={p.id}>{p.quantity} x {p.product.title} <br /> <b>{productTotal(p).toFixed(2)} $ CA</b></li>