"use client";

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

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Menu",
          id: "/menu",
        },
        {
          name: "About",
          id: "/about",
        },
        {
          name: "Order",
          id: "/order",
        },
        {
          name: "Visit",
          id: "/visit",
        },
      ]}
      brandName="Teddy's Cafe"
    />
  </div>

  <div id="product" data-section="product">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      title="Full Menu"
      description="Explore all our fusion options."
      products={[
        {
          id: "pr1",
          name: "Classic Teriyaki",
          price: "$10.50",
          imageSrc: "http://img.b2bpic.net/free-photo/fried-chicken-with-vegetables-sesame-sauce_140725-424.jpg",
        },
        {
          id: "pr2",
          name: "Gourmet Cheeseburger",
          price: "$11.99",
          imageSrc: "http://img.b2bpic.net/free-photo/juicy-cheeseburger-with-salad-wooden-board_140725-7362.jpg",
        },
      ]}
    />
  </div>

  <div id="feature" data-section="feature">
      <FeatureCardSeven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      title="Fresh Ingredients"
      description="We source the best local produce daily."
      features={[
        {
          title: "Fresh Produce",
          description: "Local farms only.",
          imageSrc: "http://img.b2bpic.net/free-photo/vegan-rice-paper-rolls-with-vegetables-sesam-served-plate-ready-eat_1220-7023.jpg",
        },
        {
          title: "Quality Protein",
          description: "Hand-cut meats.",
          imageSrc: "http://img.b2bpic.net/free-photo/asian-style-lunch-with-noodles-with-chicken-teriyaki-sauce-vegetables-spices-microgreens_166373-738.jpg",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/colorful-poke-bowl-with-salmon-avocado-seaweed-served-bed-rice_9975-124822.jpg?_wi=2"
      logoText="Teddy's Cafe"
      columns={[
        {
          title: "Menu",
          items: [
            {
              label: "Appetizers",
              href: "/menu",
            },
            {
              label: "Burgers",
              href: "/menu",
            },
            {
              label: "Sushi",
              href: "/menu",
            },
          ],
        },
        {
          title: "Company",
          items: [
            {
              label: "About",
              href: "/about",
            },
            {
              label: "Visit Us",
              href: "/visit",
            },
          ],
        },
        {
          title: "Support",
          items: [
            {
              label: "Order Online",
              href: "/order",
            },
            {
              label: "Contact",
              href: "/visit",
            },
          ],
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
