"use client";

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

export default function GalleryPage() {
  return (
    <ThemeProvider>
      <ReactLenis root>
        <NavbarStyleCentered navItems={[{ name: "Home", id: "/" }, { name: "Gallery", id: "/gallery" }, { name: "Book", id: "/booking" }]} brandName="Madhur Radio" />
        <div className="pt-32 pb-20">
          <ProductCardThree
            title="Our Portfolio"
            description="View our past work and setups."
            gridVariant="three-columns-all-equal-width"
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            products={[
              { id: "1", name: "Wedding DJ", price: "", imageSrc: "http://img.b2bpic.net/free-photo/world-theatre-day-celebration_23-2151185526.jpg" },
              { id: "2", name: "Lighting Setup", price: "", imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658386.jpg" }
            ]}
          />
        </div>
        <FooterBaseReveal logoText="Madhur Radio" columns={[]} />
      </ReactLenis>
    </ThemeProvider>
  );
}