"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterCard from '@/components/sections/footer/FooterCard';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import ProductCatalog from '@/components/ecommerce/productCatalog/ProductCatalog';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
        contentWidth="mediumSmall"
        sizing="medium"
        background="aurora"
        cardStyle="soft-shadow"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Shop",
          id: "/shop",
        },
        {
          name: "Checkout",
          id: "/checkout",
        },
        {
          name: "Delivery",
          id: "/delivery",
        },
      ]}
      brandName="LEX"
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        {
          id: "1",
          brand: "Lex",
          name: "Classic Black Suit",
          price: "£89",
          rating: 4.8,
          reviewCount: "120",
          imageSrc: "asset://prod-1",
        },
        {
          id: "2",
          brand: "Lex",
          name: "White Essential Tee",
          price: "£12",
          rating: 4.5,
          reviewCount: "89",
          imageSrc: "asset://prod-2",
        },
        {
          id: "3",
          brand: "Lex",
          name: "Zip-Up Fleece Hoodie",
          price: "£48",
          rating: 4.6,
          reviewCount: "56",
          imageSrc: "asset://prod-3",
        },
        {
          id: "4",
          brand: "Lex",
          name: "Slim Fit Chinos",
          price: "£45",
          rating: 4.4,
          reviewCount: "43",
          imageSrc: "asset://prod-4",
        },
        {
          id: "5",
          brand: "Lex",
          name: "White Leather Trainers",
          price: "£75",
          rating: 4.7,
          reviewCount: "78",
          imageSrc: "asset://prod-5",
        },
        {
          id: "6",
          brand: "Lex",
          name: "Gym Performance Shorts",
          price: "£25",
          rating: 4.3,
          reviewCount: "32",
          imageSrc: "asset://prod-6",
        },
      ]}
      title="Fresh Drops"
      description="Explore all our premium pieces. Every item under £100."
    />
  </div>

  <div id="ecommerce" data-section="ecommerce">
      <ProductCatalog
      layout="page"
      products={[
        {
          id: "1",
          name: "Classic Black Suit",
          price: "£89",
          rating: 4.8,
          imageSrc: "http://img.b2bpic.net/free-photo/black-friday-assortment-black-background_23-2148665574.jpg",
        },
        {
          id: "2",
          name: "White Essential Tee",
          price: "£12",
          rating: 4.5,
          imageSrc: "http://img.b2bpic.net/free-photo/buy-shopping-shopaholic-purchase-icon_53876-21336.jpg",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoText="LEX STYLISH CLOTHS"
      copyrightText="© 2025 Lex Stylish Cloths. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
