L'importation d'image fonctionne. Il manque à faire fonctionner la modifiction et le delete avec.

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

@@ -1,13 +1,7 @@
 import { Card } from "react-bootstrap";
+import { useState, useEffect } from "react";
+
 
-// public enum States { 
-//     Available,
-//     BackOrder,
-//     Unavailable,
-//     Clearance,
-//     Promotion,
-//     Discontinued
-// }
 function renderStatus(statusCode) {
     if (statusCode !== undefined) {
 
@@ -62,7 +56,7 @@ function renderPrice(price, newPrice, status) {
     if (price !== undefined) {
 
 
-        if (status != 3 && status != 4) {
+        if (status !== 3 && status !== 4) {
             return (
                 <Card.Text className="item-price-container">
                     <span className="item-price">
@@ -87,12 +81,25 @@ function renderPrice(price, newPrice, status) {
 
 }
 
-const Item = ({ imageUrl, name, price, newPrice, status }) => {
+const Item = ({ productId, name, price, newPrice, status }) => {
+
+    const [imageSrc, setImageSrc] = useState("/images/default_thumbnail.jpg");
+
+    useEffect(() => {
+        fetch(`https://localhost:7292/api/Image?id=${productId}&thumbnail=true`)
+            .then(response => response.blob())
+            .then(blob => {
+                const imageUrl = URL.createObjectURL(blob);
+                setImageSrc(imageUrl);
+            })
+    }, []);
+
+
     if (name !== undefined) {
         return (
 
             <Card className="item">
-                <Card.Img className="item-img" variant="top" src={`/images/${imageUrl}_thumbnail.jpg`} />
+                <Card.Img className="item-img" variant="top" src={imageSrc} />
                 <Card.Body className="item-info">
                     <div className="item-name-container">
                         <Card.Title className="item-name">