diff --git a/src/app/components/filter-side-bar/filter-side-bar.component.html b/src/app/components/filter-side-bar/filter-side-bar.component.html
index b09d95f..9423810 100644
--- a/src/app/components/filter-side-bar/filter-side-bar.component.html
+++ b/src/app/components/filter-side-bar/filter-side-bar.component.html
@@ -36,7 +36,7 @@
             <p class="mb-1 fs-5 fw-semibold">Avis</p>
             
             <div class="flex-column justify-content-start">
-                <app-avis-bar></app-avis-bar>
+                <app-avis-bar (stateNumber)="onStateNumberChange($event)"></app-avis-bar>
                 <button class="btn btn-success me-2" (click)="onSendRating()">Valider</button>
             </div>
         </div>
diff --git a/src/app/components/filter-side-bar/filter-side-bar.component.ts b/src/app/components/filter-side-bar/filter-side-bar.component.ts
index c493c5e..e6aa792 100644
--- a/src/app/components/filter-side-bar/filter-side-bar.component.ts
+++ b/src/app/components/filter-side-bar/filter-side-bar.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 
 @Component({
   selector: 'app-filter-side-bar',
@@ -7,6 +7,8 @@ import { Component, Input, OnInit } from '@angular/core';
 })
 export class FilterSideBarComponent implements OnInit {
   @Input() listCategories: string[];
+  @Output() stateNumber = new EventEmitter();
+  filterStateNumber: number = 0;
   
   constructor() { 
     this.listCategories = [];
@@ -15,8 +17,12 @@ export class FilterSideBarComponent implements OnInit {
   ngOnInit(): void {
   }
 
+  onStateNumberChange(stateNumber: number): void {
+    this.filterStateNumber = stateNumber;
+  }
+
   onSendRating():void {
-    console.log("coucou");
+    this.stateNumber.emit(this.filterStateNumber);
   }
 
 }
diff --git a/src/app/pages/page-accueil/page-accueil.component.html b/src/app/pages/page-accueil/page-accueil.component.html
index 50b9406..20de017 100644
--- a/src/app/pages/page-accueil/page-accueil.component.html
+++ b/src/app/pages/page-accueil/page-accueil.component.html
@@ -1,5 +1,5 @@
 <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" 
diff --git a/src/app/pages/page-accueil/page-accueil.component.ts b/src/app/pages/page-accueil/page-accueil.component.ts
index 6f8429a..49a9f06 100644
--- a/src/app/pages/page-accueil/page-accueil.component.ts
+++ b/src/app/pages/page-accueil/page-accueil.component.ts
@@ -9,10 +9,12 @@ 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 = [];
    }
 
@@ -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);
+  }
+
 }