SearchBar presque fonctionnelle, Featured qui va fetcher dans la bd

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

@@ -1,33 +1,24 @@
 import React from "react";
 import { useEffect } from "react";
+import { useState } from "react";
 import ResearchBar from "../components/ResearchBar";
-import FeatuerdList from "../components/FeaturedList";
+import FeaturedList from "../components/FeaturedList";
 
 const Home = () => {
-
-    const products = [
-        {
-            "title": "Ceinture flèchée",
-            "description": "Pour faire votre propre bonhomme de 1837, comme dans le bon vieux temps.",
-            "price": "85,86",
-            "imageUrl": "/images/ceintureflechee.jpg"
-        },
-        {
-            "title": "Pantoufles du Canadien en Phentex",
-            "description": "Parce que ça sent la coupe!",
-            "price": "15,64",
-            "imageUrl": "/images/pantouflesCH.jpg"
-        },
-        {
-            "title": "Jean-Luc Mongrain",
-            "description": "On ne lui ferait pas mal, en tout cas!!",
-            "price": "1453,12",
-            "imageUrl": "/images/jeanlucmongrain.jpg"
-        }
-    ];
+    const [products, setProducts] = useState([]);
+    const [loaded, setLoad] = useState(false);
 
     useEffect(() => {
         document.title = 'Maison';
+        async function FetchPromo() {
+            const response = await fetch(`https://localhost:7292/api/Inventory?filterState=isPromoted&all=true`);
+            const products = await response.json();
+            setProducts([...products])
+        }
+        if (loaded === false) {
+            FetchPromo();
+            setLoad(true);
+        }
     });
 
     return (
@@ -40,7 +31,7 @@ const Home = () => {
                 <br/>
                 <h2 className="home-description">Des produits bien commodes faits par des aînées d'expérience.</h2>
             </div>
-            <FeatuerdList
+            <FeaturedList
                 products={products}
             />
         </>