"use client";

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

export default function CoursesCatalogPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="bounce-effect"
        defaultTextAnimation="background-highlight"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="largeSmallSizeLargeTitles"
        background="blurBottom"
        cardStyle="layered-gradient"
        primaryButtonStyle="flat"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarLayoutFloatingOverlay
            brandName="GourmetAgency"
            navItems={[
              { name: "Home", id: "/" },
              { name: "Courses", id: "/courses" },
              { name: "About", id: "/#about" },
              { name: "Contact", id: "/#contact" }
            ]}
          />
        </div>

        <div id="catalog" data-section="catalog" className="pt-32">
          <ProductCardFour
            title="Our Course Catalog"
            description="Expertly crafted courses for culinary professionals."
            useInvertedBackground={false}
            animationType="slide-up"
            gridVariant="four-items-2x2-equal-grid"
            products={[
              { id: "c1", name: "Advanced Culinary Techniques", price: "$299", variant: "Masterclass", imageSrc: "http://img.b2bpic.net/free-photo/chef-preparing-dish_23-2148734604.jpg" },
              { id: "c2", name: "Restaurant Strategy Mastery", price: "$399", variant: "Business", imageSrc: "http://img.b2bpic.net/free-photo/professional-architectural-designer-configures-floor-plan-dual-monitors_482257-120253.jpg" },
              { id: "c3", name: "Digital Menu Engineering", price: "$199", variant: "Digital", imageSrc: "http://img.b2bpic.net/free-photo/close-up-utensil-around-digital-tablet-beige-background_23-2148041733.jpg" },
              { id: "c4", name: "Luxury Hospitality Leadership", price: "$499", variant: "Leadership", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-plus-size-man-working-as-barista_23-2150754672.jpg" }
            ]}
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterLogoEmphasis
            logoText="GourmetAgency"
            columns={[
              { items: [{ label: "Home", href: "/" }, { label: "Courses", href: "/courses" }] },
              { items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
            ]}
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}