Update src/app/page.tsx

src/app/page.tsx

@@ -8,10 +8,16 @@ import FooterSimple from '@/components/sections/footer/FooterSimple';
 import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
 import MediaAbout from '@/components/sections/about/MediaAbout';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
+import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
+import { useState } from 'react';
 
 export default function LandingPage() {
+  const [search, setSearch] = useState("");
+  const [selectedCategory, setSelectedCategory] = useState("Tous");
+
+  const categories = ["Tous", "Balayage", "INOA", "Coloration", "Patine", "Coupe & Brushing", "Soins", "Hommes", "Étudiants", "Juniors", "Coloration + Balayage", "Wedding Day"];
+
   return (
     <ThemeProvider
         defaultButtonVariant="text-shift"
@@ -67,27 +73,19 @@ export default function LandingPage() {
   </div>
 
   <div id="tarifs" data-section="tarifs">
-      <PricingCardEight
-      animationType="slide-up"
-      textboxLayout="split"
-      useInvertedBackground={false}
-      plans={[
-        {
-          id: "balayage",          badge: "Expertise",          price: "dès 55,40 €",          subtitle: "Balayage sur mesure",          features: ["Forfaits complets", "Cheveux courts à longs", "Technique lumineuse"],
-          buttons: [{ text: "En savoir plus", href: "#contact" }],
-        },
-        {
-          id: "color",          badge: "Coloration",          price: "dès 49,00 €",          subtitle: "INOA & Coloration",          features: ["Sans ammoniaque", "Brillance intense", "Couverture parfaite"],
-          buttons: [{ text: "En savoir plus", href: "#contact" }],
-        },
-        {
-          id: "coupe",          badge: "Coupe",          price: "dès 33,10 €",          subtitle: "Coupe & Brushing",          features: ["Style moderne", "Lissage ou Wavy", "Sur-mesure"],
-          buttons: [{ text: "En savoir plus", href: "#contact" }],
-        },
-      ]}
-      title="Nos Prestations"
-      description="Une gamme complète de soins experts pour sublimer votre chevelure."
-    />
+      <ProductCatalog
+        layout="section"
+        title="Nos Prestations"
+        description="Consultez notre carte de soins. Note : certaines prestations complexes nécessitent un appel au 06 29 18 02 21."
+        searchValue={search}
+        onSearchChange={setSearch}
+        filters={[{
+            label: "Catégorie",            options: categories,
+            selected: selectedCategory,
+            onChange: setSelectedCategory
+        }]}
+        products={[]}
+      />
   </div>
 
   <div id="galerie" data-section="galerie">
@@ -179,4 +177,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}