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

GrossesMitaines/grosses-mitaines-ui/src/pages/Inventaire.js

@@ -20,14 +20,24 @@ const Inventaire = () => {
     }, []);
 
     const handleAddItem = async (morceau) => {
+
+        console.log(morceau);
+
+        let formData = new FormData();
+        Object.keys(morceau).map((k) => {
+            formData.set(k,morceau[k]);
+        });
+
+        console.log(formData);
+
         const response = await fetch(`https://localhost:7292/api/Product`, {
             method: 'POST',
             credentials: 'include',
+            mode: 'cors',
             headers: {
-                'Accept': 'application/json',
-                'Content-Type': 'application/json'
+                'accept': 'application/json',
             },
-            body: JSON.stringify(morceau)
+            body: formData
         })
 
         const newMorceau = await response.json();
@@ -38,7 +48,7 @@ const Inventaire = () => {
             console.log("Ajout de l'item avec succès: \r\n" + newMorceau);
         }
         else
-            console.log("Erreur de creation " + morceau);
+            console.log("Erreur de creation " + morceau.title);
     };
 
     const handleDeleteItem = async (id) => {

GrossesMitaines/grosses-mitaines-ui/src/pages/MorceauDetail.js

@@ -7,6 +7,7 @@ const MorceauDetail = () => {
     const { id } = useParams();
     const [item, setItem] = useState({});
     const [isLoading, setIsLoading] = useState(false);
+    const [imageSrc, setImageSrc] = useState("/images/default_thumbnail.jpg");
 
     useEffect(() => {
         document.title = 'Morceaux';
@@ -16,10 +17,25 @@ const MorceauDetail = () => {
             const json = await response.json();
             setItem(json);
         }
+
+        
         fetchData();
+
+        fetch(`https://localhost:7292/api/Image?id=${id}`)
+        .then(response => response.blob())
+        .then(blob => {
+            const imageUrl = URL.createObjectURL(blob);
+            setImageSrc(imageUrl);
+        })
+
         setIsLoading(false);
     });
 
+
+    useEffect(() => {
+       
+    }, []);
+
     function renderPrice(price, newPrice, status) {
         if (price !== undefined) {
             if (status !== 3 && status !== 4) {
@@ -99,7 +115,7 @@ const MorceauDetail = () => {
 
             <div className="detail-container">
                 <div className="detail-container-left">
-                    <img className="detail-image" alt="" src={`/images/${item.imageName}.jpg`} />
+                    <img className="detail-image" alt="" src={imageSrc} />
                     <p className="detail-description">{item.description}</p>
                 </div>
                 <div className="detail-container-right">