"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="compact"
        sizing="largeSmallSizeLargeTitles"
        background="blurBottom"
        cardStyle="glass-depth"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "About",
          id: "/about",
        },
        {
          name: "Programs",
          id: "/programs",
        },
        {
          name: "Impact",
          id: "/impact",
        },
        {
          name: "Camp",
          id: "/camp",
        },
        {
          name: "Get Involved",
          id: "/involved",
        },
        {
          name: "Donate",
          id: "/donate",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="MAD PARK Community"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroCarouselLogo
      logoText="Building Healthier Futures for Charleston Youth & Families"
      description="MAD PARK Community helps scholars, families, and educators live well, move well, feel well, and lead well through year-round wellness programming."
      buttons={[
        {
          text: "Donate Now",
          href: "/donate",
        },
        {
          text: "Join the Movement",
          href: "/involved",
        },
      ]}
      slides={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/friends-studying-sitting-bench-park_23-2147850676.jpg",
          imageAlt: "diverse youth group exercising outdoors",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-fit-friends-outdoors_23-2150828920.jpg",
          imageAlt: "diverse youth group exercising outdoors",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-cycling-gym_1163-3763.jpg",
          imageAlt: "diverse youth group exercising outdoors",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/kids-having-their-hands-dirty-after-planting_23-2149002818.jpg",
          imageAlt: "diverse youth group exercising outdoors",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/kids-having-fun-jungle-party_23-2149498977.jpg",
          imageAlt: "diverse youth group exercising outdoors",
        },
      ]}
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={false}
      title="Our Impact Snapshot"
      tag="Community Reach"
      metrics={[
        {
          id: "m1",
          value: "500+",
          description: "Scholars served",
        },
        {
          id: "m2",
          value: "250+",
          description: "Families impacted",
        },
        {
          id: "m3",
          value: "40+",
          description: "Community events",
        },
        {
          id: "m4",
          value: "15+",
          description: "School partnerships",
        },
      ]}
      metricsAnimation="slide-up"
    />
  </div>

  <div id="mission" data-section="mission">
      <MediaAbout
      useInvertedBackground={false}
      title="Wellness Is a Right, Not a Privilege"
      description="MAD PARK Community is a Charleston-based movement dedicated to breaking down barriers to health and wellness. Through fitness, nutrition, emotional well-being, mentorship, and family-centered programming, we equip young people and their communities with tools to thrive for generations."
      imageSrc="http://img.b2bpic.net/free-photo/young-adults-doing-outdoor-fitness_23-2149082005.jpg"
      imageAlt="youth wellness mentor coaching"
    />
  </div>

  <div id="programs" data-section="programs">
      <FeatureCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      features={[
        {
          title: "Scholar Strong",
          description: "In-school youth wellness initiative.",
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-girls-making-soap-bubbles-outdoors_23-2149265003.jpg",
        },
        {
          title: "Family Thrive",
          description: "Whole-family wellness support.",
          imageSrc: "http://img.b2bpic.net/free-photo/happy-family-two-dads-baby_23-2149259092.jpg",
        },
        {
          title: "Teacher Collective",
          description: "Educator wellness support.",
          imageSrc: "http://img.b2bpic.net/free-photo/different-people-working-together-donation-facility_23-2148687357.jpg",
        },
      ]}
      title="Wellness Programming"
      description="Discover our core initiatives that foster health and resilience."
    />
  </div>

  <div id="testimonial" data-section="testimonial">
      <TestimonialCardTen
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",
          title: "Parent Perspective",
          quote: "MAD PARK has truly changed how our family prioritizes health.",
          name: "Sarah J.",
          role: "Parent",
          imageSrc: "http://img.b2bpic.net/free-photo/diverse-friends-holding-speech-bubbles_53876-95252.jpg",
        },
        {
          id: "t2",
          title: "Scholar Voice",
          quote: "I feel stronger and more confident after participating.",
          name: "Marcus D.",
          role: "Scholar",
          imageSrc: "http://img.b2bpic.net/free-photo/cheerful-waitress-with-charming-smile_1098-15077.jpg",
        },
        {
          id: "t3",
          title: "Educator Insight",
          quote: "The Teacher Wellness Collective is exactly what our faculty needed.",
          name: "Dr. Miller",
          role: "Educator",
          imageSrc: "http://img.b2bpic.net/free-photo/meet-one-online-matchmaking-sign-up-concept_53876-14018.jpg",
        },
        {
          id: "t4",
          title: "Community Partner",
          quote: "MAD PARK is a critical component of Charleston's health infrastructure.",
          name: "David W.",
          role: "Partner",
          imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-holding-jacket-shoulder_1262-3853.jpg",
        },
        {
          id: "t5",
          title: "Volunteer Story",
          quote: "Being a part of this movement is life-changing work.",
          name: "Jessica L.",
          role: "Volunteer",
          imageSrc: "http://img.b2bpic.net/free-photo/diverse-friends-holding-speech-bubbles_53876-25120.jpg",
        },
      ]}
      title="Stories from the Community"
      description="Hear directly from those we serve."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoText="MAD PARK Community"
      leftLink={{
        text: "Privacy Policy",
        href: "#",
      }}
      rightLink={{
        text: "© 2024 MAD PARK Community. All rights reserved.",
        href: "#",
      }}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
