Add src/app/products/page.tsx

2026-06-12 16:54:55 +00:00
parent 8512314d66
commit 800176b9cd
1 changed files with 121 additions and 0 deletions
--- a/src/app/products/page.tsx
+++ b/src/app/products/page.tsx
@@ -0,0 +1,121 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import FooterBase from '@/components/sections/footer/FooterBase';
+
+export default function ProductsPage() {
+  const navItems = [
+    { name: "Accueil", id: "/" },
+    { name: "Avantages", id: "/#advantages" },
+    { name: "Marques", id: "/#brands" },
+    { name: "Produits", id: "/products" },
+    { name: "Nouveautés", id: "/#new-arrivals" },
+    { name: "Contact", id: "/#contact-cta" },
+  ];
+
+  const navbarProps = {
+    navItems: navItems,
+    logoSrc: "http://img.b2bpic.net/free-vector/flat-design-repair-shop-badges-design_23-2149616631.jpg",    logoAlt: "STREET SAP PARTS WEST Logo",    brandName: "STREET SAP PARTS WEST",    bottomLeftText: "L'Expert Pièces Détachées Ouest Algérien",    bottomRightText: "streetsapparts.west@gmail.com",    button: {
+      text: "📲 WhatsApp",      href: "https://wa.me/213542548985"
+    }
+  };
+
+  const footerColumns = [
+    {
+      title: "Navigation",      items: [
+        { label: "Accueil", href: "/" },
+        { label: "Avantages", href: "/#advantages" },
+        { label: "Marques", href: "/#brands" },
+        { label: "Produits", href: "/products" },
+        { label: "Nouveautés", href: "/#new-arrivals" },
+      ],
+    },
+    {
+      title: "Contact",      items: [
+        { label: "WhatsApp: +213542548985", href: "https://wa.me/213542548985" },
+        { label: "Email: streetsapparts.west@gmail.com", href: "mailto:streetsapparts.west@gmail.com" },
+        { label: "Location: Oran, Algérie", href: "#" },
+        { label: "Demander un Devis", href: "/#contact-cta" },
+      ],
+    },
+    {
+      title: "Réseaux Sociaux",      items: [
+        { label: "TikTok", href: "#" },
+        { label: "Facebook", href: "#" },
+        { label: "Facebook Marketplace", href: "#" },
+      ],
+    },
+  ];
+
+  const footerProps = {
+    columns: footerColumns,
+    logoSrc: "http://img.b2bpic.net/free-vector/automotive-industry-logo_24908-57008.jpg",    logoAlt: "STREET SAP PARTS WEST Logo",    logoText: "STREET SAP PARTS WEST",    copyrightText: "© 2024 STREET SAP PARTS WEST. Tous droits réservés."
+  };
+
+  const productCategories = [
+    {
+      id: "engine-parts",      name: "Pièces Moteur",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/car-engine_1373-182.jpg",      imageAlt: "Pièces moteur"
+    },
+    {
+      id: "suspension-parts",      name: "Suspension",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/car-shock-absorber-new-spare-parts-white_23-2148256333.jpg",      imageAlt: "Pièces de suspension"
+    },
+    {
+      id: "brake-system",      name: "Système de Freinage",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/car-braking-system_23-2148496417.jpg",      imageAlt: "Système de freinage"
+    },
+    {
+      id: "filters",      name: "Filtres",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/car-oil-filters-motor-oil-can-isolated-white_93675-128251.jpg",      imageAlt: "Filtres"
+    },
+    {
+      id: "cooling-system",      name: "Système de Refroidissement",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/car-radiator_23-2148496409.jpg",      imageAlt: "Système de refroidissement"
+    },
+    {
+      id: "electrical-components",      name: "Composants Électriques",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/spark-plugs-battery-car-parts_23-2148496429.jpg",      imageAlt: "Composants électriques"
+    },
+    {
+      id: "transmission-parts",      name: "Transmission",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/car-gear-assembly_23-2148496422.jpg",      imageAlt: "Pièces de transmission"
+    },
+    {
+      id: "body-parts",      name: "Pièces de Carrosserie",      price: "Voir les produits",      imageSrc: "http://img.b2bpic.net/free-photo/body-repair-car_23-2148810757.jpg",      imageAlt: "Pièces de carrosserie"
+    },
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="hover-bubble"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="pill"
+      contentWidth="mediumSmall"
+      sizing="mediumSizeLargeTitles"
+      background="none"
+      cardStyle="layered-gradient"
+      primaryButtonStyle="double-inset"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleFullscreen {...navbarProps} />
+        </div>
+
+        <div id="products-categories-page" data-section="products-categories-page">
+          <ProductCardOne
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="four-items-2x2-equal-grid"
+            useInvertedBackground={true}
+            products={productCategories}
+            title="Explorez Nos Catégories de Produits"
+            description="Découvrez nos gammes complètes de pièces détachées automobiles par catégorie."
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterBase {...footerProps} />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}