diff --git a/src/app/pages/page-accueil/page-accueil.component.html b/src/app/pages/page-accueil/page-accueil.component.html
index 50b9406..3180319 100644
--- a/src/app/pages/page-accueil/page-accueil.component.html
+++ b/src/app/pages/page-accueil/page-accueil.component.html
@@ -1,14 +1,14 @@
 <div class="d-flex align-items-stretch">
-    <app-filter-side-bar [listCategories]="listCategoriesFilter"></app-filter-side-bar>
+    <app-filter-side-bar [listCategories]="listCategoriesFilter" (stateNumber)=onRatingFilter($event)></app-filter-side-bar>
 
     <div class="custom-main container p-3">
-        <input class="form-control" 
+        <input class="form-control"
             type="text"
             placeholder="Recherche ta belle plante"
             aria-label="Input Recherche ta belle plante">
 
         <div class="py-3">
-            Trier par : 
+            Trier par :
             <button class="btn btn-outline-success btn-sm me-2">Prix</button>
             <button class="btn btn-outline-success btn-sm me-2">Ordre Alpha</button>
             <button class="btn btn-outline-success btn-sm me-2">Avis</button>
@@ -16,7 +16,7 @@
 
         <div class="row">
             <div class="col" *ngFor="let product of listData">
-                <app-card-plante [plant]="product" 
+                <app-card-plante [plant]="product"
                             (clickLike)="onEventLike()">
                 </app-card-plante>
             </div>
diff --git a/src/app/pages/page-accueil/page-accueil.component.ts b/src/app/pages/page-accueil/page-accueil.component.ts
index 6f8429a..3060bbd 100644
--- a/src/app/pages/page-accueil/page-accueil.component.ts
+++ b/src/app/pages/page-accueil/page-accueil.component.ts
@@ -9,18 +9,20 @@ import * as _ from 'underscore';
 })
 export class PageAccueilComponent implements OnInit {
   public listData: any[];
+  public listRate: any[];
   public listCategoriesFilter: string[];
 
   constructor(private plantouneService: PlantouneService) {
     this.listData = [];
+    this.listRate = [];
     this.listCategoriesFilter = [];
    }
 
    /**
-    * equivalent de la ligne du dessus 
-    * 
+    * equivalent de la ligne du dessus
+    *
     * plantouneService;
-    * 
+    *
     * constructor(plantouneService: PlantouneService) {
     *   this.plantouneService = plantouneService;
     * }
@@ -39,10 +41,10 @@ export class PageAccueilComponent implements OnInit {
          */
         const listAllCategories = listPlant.map(product => product.product_breadcrumb_label);
         console.log(listAllCategories);
-        
-        const listUniqCategories = _.uniq(listAllCategories) 
+
+        const listUniqCategories = _.uniq(listAllCategories)
         console.log(listUniqCategories);
-        
+
 
         /**
          * Technique native JS pour recupérer les catégories uniques de nos plantes
@@ -54,6 +56,7 @@ export class PageAccueilComponent implements OnInit {
         this.listCategoriesFilter = listUniqJsCategories;
         this.listData = listPlant;
         this.listData.length = 9;
+        console.log(this.listData);
       }
     )
   }
@@ -62,4 +65,15 @@ export class PageAccueilComponent implements OnInit {
     this.plantouneService.plantLiked$.next('')
   }
 
+  onRatingFilter(stateNumber: number): void {
+    console.log(stateNumber);
+    this.listData.forEach(product => {
+      if(product.product_rating >= stateNumber) {
+        this.listRate.push(product);
+      }
+    });
+    this.listData = this.listRate;
+    console.log(this.listData);
+  }
+
 }