"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';

export default function ProductsPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="mediumLarge"
        sizing="medium"
        background="noiseDiagonalGradient"
        cardStyle="glass-elevated"
        primaryButtonStyle="shadow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarStyleCentered
            navItems={[
              { name: "Shop", id: "/products" },
              { name: "About", id: "/#about" },
              { name: "Gallery", id: "/#gallery" },
              { name: "Contact", id: "/#contact" },
            ]}
            brandName="FKD WRLD"
          />
        </div>

        <div id="products" data-section="products">
          <ProductCardFour
            animationType="slide-up"
            textboxLayout="split"
            gridVariant="four-items-2x2-equal-grid"
            useInvertedBackground={false}
            products={[
              { id: "p1", name: "Midnight Hoodie", price: "$120", variant: "Black", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DdH2GKm4m8obxevOjsTwuKi0Vj/uploaded-1778606030934-9yr93z9m.png" },
              { id: "p2", name: "Concrete Hoodie", price: "$120", variant: "Grey", imageSrc: "http://img.b2bpic.net/free-photo/view-woman-wearing-stylish-fedora-hat_23-2150711559.jpg?_wi=2" },
              { id: "p3", name: "Shadow Hoodie", price: "$135", variant: "Charcoal", imageSrc: "http://img.b2bpic.net/free-photo/young-lady-oversized-hoodie-pants-holding-hands-head-looking-annoyed-front-view_176474-58539.jpg?_wi=2" },
              { id: "p4", name: "Graphic Icon", price: "$145", variant: "Black", imageSrc: "http://img.b2bpic.net/free-vector/black-white-instagram-stories_79603-759.jpg?_wi=2" }
            ]}
            title="All Collections"
            description="Explore our full range of premium streetwear essentials."
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterBaseCard
            logoText="FKD WRLD"
            columns={[
              { title: "Links", items: [{ label: "Shop", href: "/products" }, { label: "About", href: "/#about" }] },
              { title: "Social", items: [{ label: "Instagram", href: "https://instagram.com" }, { label: "TikTok", href: "https://tiktok.com" }] }
            ]}
            copyrightText="© 2025 | FKD WRLD"
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}