"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="background-highlight"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="mediumLarge"
        background="circleGradient"
        cardStyle="inset"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "Menu",
          id: "/menu",
        },
        {
          name: "Deals",
          id: "/deals",
        },
        {
          name: "Rewards",
          id: "/rewards",
        },
        {
          name: "Locations",
          id: "/locations",
        },
        {
          name: "App",
          id: "/app",
        },
        {
          name: "About",
          id: "/about",
        },
      ]}
      brandName="McDonald's"
    />
  </div>

  <div id="rewards-overview" data-section="rewards-overview">
      <FeatureCardTwentyEight
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "rewards-feat-1",
          title: "Earn Points on Every Purchase",
          subtitle: "Get points for every dollar spent on eligible McDonald's items.",
          category: "Earning",
          value: "Easy Points",
        },
        {
          id: "rewards-feat-2",
          title: "Redeem for Free Favorites",
          subtitle: "Exchange your points for free menu items, from burgers to beverages.",
          category: "Redeeming",
          value: "Free Food",
        },
        {
          id: "rewards-feat-3",
          title: "Unlock Personalized Offers",
          subtitle: "Receive special offers tailored just for you in the McDonald's App.",
          category: "Offers",
          value: "Exclusive Deals",
        },
      ]}
      title="MyMcDonald's Rewards"
      description="Earn points on every order and redeem them for free food and drinks! It's our way of saying thank you for being a loyal customer."
    />
  </div>

  <div id="member-statistics" data-section="member-statistics">
      <MetricCardEleven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        {
          id: "member-metric-1",
          value: "30M+",
          title: "Members",
          description: "Globally enjoying rewards.",
          imageSrc: "http://img.b2bpic.net/free-photo/closeup-woman-with-smartphone-taking-pic-red-gift-box-counter_181624-30160.jpg",
          imageAlt: "McDonald's App rewards screen",
        },
        {
          id: "member-metric-2",
          value: "Thousands",
          title: "Free Meals Daily",
          description: "Redeemed by our loyal members.",
          imageSrc: "http://img.b2bpic.net/free-vector/vector-icon-illustration-hamburger-collection-color-gray-black-white-isolated-white_134830-1667.jpg",
          imageAlt: "Big Mac burger",
        },
        {
          id: "member-metric-3",
          value: "100+",
          title: "Countries",
          description: "Where MyMcDonald's Rewards is available.",
          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-smartphone_23-2149870751.jpg",
          imageAlt: "McDonald's App home screen",
        },
      ]}
      title="Join Our Growing Community"
      description="See why millions love earning rewards with MyMcDonald's. It's more than just points, it's about being part of the family!"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/young-adults-enjoying-food_23-2149303581.jpg"
      imageAlt="Happy family eating McDonald's food"
      logoSrc="http://img.b2bpic.net/free-photo/view-3d-delicious-looking-burger_23-2150914669.jpg"
      logoAlt="McDonald's Golden Arches Logo"
      logoText="McDonald's"
      columns={[
        {
          title: "Menu",
          items: [
            {
              label: "All Products",
              href: "/menu",
            },
            {
              label: "Deals",
              href: "/deals",
            },
            {
              label: "Nutrition",
              href: "/menu#nutrition",
            },
          ],
        },
        {
          title: "About Us",
          items: [
            {
              label: "Our Story",
              href: "/about#our-story",
            },
            {
              label: "Careers",
              href: "/about#careers",
            },
            {
              label: "Sustainability",
              href: "/about",
            },
          ],
        },
        {
          title: "Get The App",
          items: [
            {
              label: "MyMcDonald's Rewards",
              href: "/rewards",
            },
            {
              label: "Download Now",
              href: "/app",
            },
          ],
        },
        {
          title: "Contact",
          items: [
            {
              label: "Find a Restaurant",
              href: "/locations",
            },
            {
              label: "Customer Service",
              href: "#",
            },
            {
              label: "Feedback",
              href: "#",
            },
          ],
        },
      ]}
      copyrightText="© 2024 McDonald's. All Rights Reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
