diff --git a/db.json b/db.json
index c33d67b..48bd32d 100644
--- a/db.json
+++ b/db.json
@@ -6061,4 +6061,4 @@
       "id": 2
     }
   ]
-}
\ No newline at end of file
+}
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 b9d6b88..b1658ff 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
@@ -1,13 +1,13 @@
 <div class="custom-side-bar flex-shrink-0 bg-white border-end">
-    <div class="p-3">
-        <span class="fs-5 fw-semibold">Filtres</span>
-    </div>
-    <ul class="list-unstyled ps-0 border-top">
-        <div class="p-3">
-            <p class="mb-1 fs-5 fw-semibold">Catégories</p>
-            <div *ngFor="let category of listCategories; let indexCat = index" class="form-check">
+  <div class="p-3">
+      <span class="fs-5 fw-semibold">Filtres</span>
+  </div>
+  <ul class="list-unstyled ps-0 border-top">
+      <div class="p-3">
+          <p class="mb-1 fs-5 fw-semibold">Catégories</p>
+          <div *ngFor="let category of listCategories; let indexCat = index" class="form-check">
 
-                <input class="form-check-input" type="checkbox" value="testcategory" id="checkBoxCategory{{indexCat}}">
+              <input class="form-check-input" type="checkbox" value="testcategory" id="checkBoxCategory{{indexCat}}">
 
                 <label class="form-check-label" for="checkBoxCategory{{indexCat}}">
                     {{ category }}
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 d3bb300..2af42fb 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
@@ -31,5 +31,4 @@ export class FilterSideBarComponent implements OnInit {
     console.log(typeof(rangeArray[0]));
     this.rangeNumber.emit(rangeArray);
   }
-
 }
diff --git a/src/app/pages/page-accueil/page-accueil.component.html b/src/app/pages/page-accueil/page-accueil.component.html
index ce25eb3..9d50c66 100644
--- a/src/app/pages/page-accueil/page-accueil.component.html
+++ b/src/app/pages/page-accueil/page-accueil.component.html
@@ -1,26 +1,25 @@
 <div class="d-flex align-items-stretch">
     <app-filter-side-bar [listCategories]="listCategoriesFilter" (stateNumber)="onRatingFilter($event)" (rangeNumber)="onPriceFilter($event)"></app-filter-side-bar>
+  <div class="custom-main container p-3">
+      <input class="form-control"
+          type="text"
+          placeholder="Recherche ta belle plante"
+          aria-label="Input Recherche ta belle plante">
 
-    <div class="custom-main container p-3">
-        <input class="form-control" 
-            type="text"
-            placeholder="Recherche ta belle plante"
-            aria-label="Input Recherche ta belle plante">
+      <div class="py-3">
+          Trier par :
+          <button class="btn btn-outline-success btn-sm me-2" (click)="onPriceTri()">Prix</button>
+          <button class="btn btn-outline-success btn-sm me-2"(click)="onAlphaTri()">Ordre Alpha</button>
+          <button class="btn btn-outline-success btn-sm me-2" (click)="onRatingTri()">Avis</button>
+      </div>
 
-        <div class="py-3">
-            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>
-        </div>
-
-        <div class="row">
-            <div class="col" *ngFor="let product of listData">
-                <app-card-plante [plant]="product" 
-                            (clickLike)="onEventLike()">
-                </app-card-plante>
-            </div>
-        </div>
-    </div>
+      <div class="row">
+          <div class="col" *ngFor="let product of listData">
+              <app-card-plante [plant]="product"
+                          (clickLike)="onEventLike()">
+              </app-card-plante>
+          </div>
+      </div>
+  </div>
 </div>
 
diff --git a/src/app/pages/page-accueil/page-accueil.component.ts b/src/app/pages/page-accueil/page-accueil.component.ts
index 7a20d38..a867be2 100644
--- a/src/app/pages/page-accueil/page-accueil.component.ts
+++ b/src/app/pages/page-accueil/page-accueil.component.ts
@@ -2,6 +2,9 @@ import { Component, OnInit } from '@angular/core';
 import { PlantouneService } from 'src/app/services/plantoune.service';
 import * as _ from 'underscore';
 
+
+
+
 @Component({
   selector: 'app-page-accueil',
   templateUrl: './page-accueil.component.html',
@@ -13,21 +16,30 @@ export class PageAccueilComponent implements OnInit {
   public listDataFilter: any[];
   public listCategoriesFilter: string[];
 
-  public indexFilter: number;
+  public rangeNumber: number[];
+  public stateNumber: number;
+
+  public isPricingFilterActive: boolean;
+  public isRatingFilterActive: boolean;
 
   constructor(private plantouneService: PlantouneService) {
     this.listData = [];
     this.listDataGlobal = [];
     this.listDataFilter = [];
     this.listCategoriesFilter = [];
-    this.indexFilter = 0;
+
+    this.rangeNumber = [];
+    this.stateNumber = 0;
+
+    this.isPricingFilterActive = false;
+    this.isRatingFilterActive = false;
    }
 
    /**
-    * equivalent de la ligne du dessus 
-    * 
+    * equivalent de la ligne du dessus
+    *
     * plantouneService;
-    * 
+    *
     * constructor(plantouneService: PlantouneService) {
     *   this.plantouneService = plantouneService;
     * }
@@ -48,11 +60,12 @@ export class PageAccueilComponent implements OnInit {
          * Technique avec Underscore JS pour recupérer les catégories uniques de nos plantes
          */
         const listAllCategories = listPlant.map(product => product.product_breadcrumb_label);
-        console.log(listAllCategories);
-        
-        const listUniqCategories = _.uniq(listAllCategories) 
-        console.log(listUniqCategories);
-        
+        // console.log(listAllCategories);
+
+        const listUniqCategories = _.uniq(listAllCategories)
+        // console.log(listUniqCategories);
+
+
 
         /**
          * Technique native JS pour recupérer les catégories uniques de nos plantes
@@ -64,6 +77,7 @@ export class PageAccueilComponent implements OnInit {
         this.listCategoriesFilter = listUniqJsCategories;
         this.listData = listPlant;
         this.listData.length = 9;
+
         console.log(this.listData);
       }
     )
@@ -74,57 +88,54 @@ export class PageAccueilComponent implements OnInit {
   }
 
   onRatingFilter(stateNumber: number): void {
-    let listRate: any[] = [];
-    if(this.indexFilter == 0) {
-      this.indexFilter++;
-      this.listDataGlobal.forEach(product => {
-        if(product.product_rating >= stateNumber) {
-          listRate.push(product);
-        }
-      });
-    } else {
-      this.listData.forEach(product => {
-        if(product.product_rating >= stateNumber) {
-          listRate.push(product);
-        }
-      });
-    }
+    this.stateNumber = stateNumber;
+    this.isRatingFilterActive = true;
     
-    this.onApplyFilters(listRate);
+    this.onApplyFilters();
   }
 
   onPriceFilter(rangeNumber: number[]) {
-    console.log(rangeNumber);
-    let listRangedProduct: any[] = [];
-    if(this.indexFilter == 0) {
-      this.indexFilter++;
+    this.rangeNumber = [...rangeNumber];
+    this.isPricingFilterActive = true;
+    
+    this.onApplyFilters();
+  }
+
+  onApplyFilters(): void {
+
+    if(this.isPricingFilterActive) {
+      let listDataFinal: any = [];
       this.listDataGlobal.forEach(product => {
-        if(parseFloat(product.product_unitprice_ati) >= rangeNumber[0] && parseFloat(product.product_unitprice_ati) <= rangeNumber[1]) {
-          listRangedProduct.push(product);
+        if(parseFloat(product.product_unitprice_ati) >= this.rangeNumber[0] && parseFloat(product.product_unitprice_ati) <= this.rangeNumber[1]) {
+          listDataFinal.push(product);
         }
       });
-    } else {
-      this.listData.forEach(product => {
-        if(parseFloat(product.product_unitprice_ati) >= rangeNumber[0] && parseFloat(product.product_unitprice_ati) <= rangeNumber[1]) {
-          listRangedProduct.push(product);
+      this.listData = [...listDataFinal];
+    }
+
+    if(this.isRatingFilterActive) {
+      let listDataFinal: any = [];
+      this.listDataGlobal.forEach(product => {
+        if(product.product_rating >= this.stateNumber) {
+          listDataFinal.push(product);
         }
       });
+      this.listData = [...listDataFinal];
+    }
+
+    if(this.isPricingFilterActive && this.isRatingFilterActive) {
+      let listDataFinal: any = [];
+      this.listDataGlobal.forEach(product => {
+        if(parseFloat(product.product_unitprice_ati) >= this.rangeNumber[0] 
+        && parseFloat(product.product_unitprice_ati) <= this.rangeNumber[1]
+        && product.product_rating >= this.stateNumber) {
+          listDataFinal.push(product);
+        }
+      });
+      this.listData = [...listDataFinal];
+      console.log(this.listData);
     }
     
-    this.onApplyFilters(listRangedProduct);
+    if(this.listData.length >= 9) this.listData.length = 9;
   }
-
-  onApplyFilters(DataFilter: any[]): void {
-    /*if(this.indexFilter == 0) {
-      this.listData = [...DataFilter];
-      this.indexFilter++;
-    } else {
-      this.listDataFilter = [...this.listData];
-    }*/
-
-    this.listData = [...DataFilter];
-    
-    //if(this.listData.length >= 9) this.listData.length = 9;
-  }
-
 }