"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import { BookOpen, Download, LayoutDashboard, Users, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="largeSizeMediumTitles"
        background="none"
        cardStyle="layered-gradient"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Dashboard",
          id: "hero",
        },
        {
          name: "About",
          id: "about",
        },
        {
          name: "Features",
          id: "features",
        },
        {
          name: "Contact",
          id: "contact",
        },
      ]}
      brandName="EduPlatform MVP"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitTestimonial
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient",
      }}
      title="Your Education Platform MVP"
      description="Building the future of rapid e-learning. A functional, web-based platform ready for your content and student growth."
      testimonials={[
        {
          name: "Sarah Johnson",
          handle: "@sarahj",
          testimonial: "The rapid development of this platform was incredible. It works perfectly.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-horizontal-green-screen-digital-tablet-hospital-ward-sick-patient-looking-isolated-background-mockup-template-with-chroma-key-gadget-display-technology_482257-27476.jpg",
          imageAlt: "educational dashboard interface laptop",
        },
        {
          name: "Mark Chen",
          handle: "@mchen",
          testimonial: "Clean, simple, and functional. Exactly what we needed for the MVP.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/studying-moments-pretty-joyful-brunette-young-woman-black-glasses-working-with-laptop-table-library-cheerful-mood-smiling-designing-creative-work-smart-student-success_197531-1865.jpg",
          imageAlt: "educational dashboard interface laptop",
        },
        {
          name: "Alex Riv",
          handle: "@ariv",
          testimonial: "Excellent baseline for our educational content and lesson management.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/cropped-unrecognizable-person-analysing-financial-chart-smartphone_1098-18935.jpg",
          imageAlt: "educational dashboard interface laptop",
        },
        {
          name: "Lisa Wang",
          handle: "@lwang",
          testimonial: "The dashboard interface is very intuitive for our students.",
          rating: 4,
          imageSrc: "http://img.b2bpic.net/free-photo/health-cure-medicine-medical-wellness-concept_53876-132293.jpg",
          imageAlt: "educational dashboard interface laptop",
        },
        {
          name: "Tom O'Connor",
          handle: "@tocon",
          testimonial: "Great foundation for future features and student engagement.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-schoolgirl-studying-with-laptop_23-2148203863.jpg",
          imageAlt: "educational dashboard interface laptop",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/close-up-horizontal-green-screen-digital-tablet-hospital-ward-sick-patient-looking-isolated-background-mockup-template-with-chroma-key-gadget-display-technology_482257-27476.jpg"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/close-up-adult-male-working-from-home_23-2148694515.jpg",
          alt: "Close-up adult male working from home",
        },
        {
          src: "http://img.b2bpic.net/free-photo/top-view-tablet-near-ethernet-cable-mock-up_23-2148291138.jpg",
          alt: "Top view tablet near ethernet cable mock-up",
        },
        {
          src: "http://img.b2bpic.net/free-photo/legal-expert-analyzing-capital-funds-documents-home-with-copy-space_482257-121422.jpg",
          alt: "Legal expert analyzing capital funds documents at home with copy space",
        },
        {
          src: "http://img.b2bpic.net/free-photo/arrangement-with-desk-items-top-view_23-2148128321.jpg",
          alt: "Arrangement with desk items top view",
        },
        {
          src: "http://img.b2bpic.net/free-photo/freelancer-posing-with-laptop-cup-coffee_651396-1001.jpg",
          alt: "Freelancer posing with laptop and cup of coffee",
        },
      ]}
      marqueeItems={[
        {
          type: "text",
          text: "Rapid Scaling",
        },
        {
          type: "text",
          text: "Interactive UI",
        },
        {
          type: "text",
          text: "Secure Hosting",
        },
        {
          type: "text",
          text: "24/7 Support",
        },
        {
          type: "text",
          text: "Mobile Ready",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={false}
      title="Built for Speed and Scalability"
      description="Our MVP is designed to validate rapid development cycles, providing a robust base for future feature enhancements and student learning."
      metrics={[
        {
          value: "2h",
          title: "MVP Build Time",
        },
        {
          value: "100%",
          title: "Core Functionality",
        },
        {
          value: "24/7",
          title: "Platform Availability",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/studying-moments-pretty-joyful-brunette-young-woman-black-glasses-working-with-laptop-table-library-cheerful-mood-smiling-designing-creative-work-smart-student-success_197531-1865.jpg"
      mediaAnimation="slide-up"
      metricsAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFive
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          title: "Course Dashboard",
          description: "Personalized landing page for students to track progress.",
          icon: LayoutDashboard,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/cropped-unrecognizable-person-analysing-financial-chart-smartphone_1098-18935.jpg",
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/health-cure-medicine-medical-wellness-concept_53876-132293.jpg",
            },
          ],
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-horizontal-green-screen-digital-tablet-hospital-ward-sick-patient-looking-isolated-background-mockup-template-with-chroma-key-gadget-display-technology_482257-27476.jpg",
          imageAlt: "digital quiz interactive test",
        },
        {
          title: "Interactive Lessons",
          description: "Engage with lessons through content and quizzes.",
          icon: BookOpen,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/school-items-arrangement-view_23-2149001118.jpg",
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/tablet-row-books_23-2147845968.jpg",
            },
          ],
          imageSrc: "http://img.b2bpic.net/free-photo/studying-moments-pretty-joyful-brunette-young-woman-black-glasses-working-with-laptop-table-library-cheerful-mood-smiling-designing-creative-work-smart-student-success_197531-1865.jpg",
          imageAlt: "digital quiz interactive test",
        },
        {
          title: "Resource Management",
          description: "Upload and download study materials seamlessly.",
          icon: Download,
          mediaItems: [
            {
              imageSrc: "http://img.b2bpic.net/free-photo/view-school-items-arrangement_23-2149001122.jpg",
            },
            {
              imageSrc: "http://img.b2bpic.net/free-vector/education-elements-background-flat-style_23-2147761982.jpg",
            },
          ],
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-schoolgirl-studying-with-laptop_23-2148203863.jpg",
          imageAlt: "digital quiz interactive test",
        },
      ]}
      title="MVP Core Features"
      description="Critical functionalities delivered for your students and instructors."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        {
          id: "c1",
          brand: "Tech",
          name: "Intro to React",
          price: "Free",
          rating: 5,
          reviewCount: "120",
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-schoolgirl-studying-with-laptop_23-2148203863.jpg",
        },
        {
          id: "c2",
          brand: "Design",
          name: "UI/UX Basics",
          price: "$49",
          rating: 5,
          reviewCount: "85",
          imageSrc: "http://img.b2bpic.net/free-vector/minimal-charity-event-youtube-channel-art_23-2149387649.jpg",
        },
        {
          id: "c3",
          brand: "Coding",
          name: "Full Stack Dev",
          price: "$199",
          rating: 5,
          reviewCount: "210",
          imageSrc: "http://img.b2bpic.net/free-photo/learn-learning-knowledge-education-college-concept_53876-133560.jpg",
        },
        {
          id: "c4",
          brand: "Design",
          name: "Product Design",
          price: "$79",
          rating: 4,
          reviewCount: "45",
          imageSrc: "http://img.b2bpic.net/free-vector/flat-design-minimal-international-school-template_23-2149279979.jpg",
        },
        {
          id: "c5",
          brand: "Cloud",
          name: "AWS Essentials",
          price: "$129",
          rating: 5,
          reviewCount: "62",
          imageSrc: "http://img.b2bpic.net/free-photo/troubled-pensive-uneasy-pretty-redhead-female-pouting-frowning-looking-away-thoughtful-feeli_1258-126409.jpg",
        },
        {
          id: "c6",
          brand: "Data",
          name: "Data Analytics",
          price: "$99",
          rating: 4,
          reviewCount: "33",
          imageSrc: "http://img.b2bpic.net/free-psd/flat-design-webinar-template_23-2150390567.jpg",
        },
      ]}
      title="Explore Our Courses"
      description="Browse and start your learning journey with our core courses."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardThirteen
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",
          name: "Student A",
          handle: "@stuA",
          testimonial: "Super intuitive UI and great course content delivery.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/stylish-afro-american-student-keyboarding-laptop-computer-while-sitting-cafe-table-with-textbooks-working-homework-having-focused-concentrated-look-people-modern-technology-education_273609-7537.jpg",
          imageAlt: "Stylish Afro American student keyboarding on laptop computer while sitting at cafe table with textbooks, working on homework, having focused concentrated look. People, modern technology and education",
        },
        {
          id: "2",
          name: "Instructor B",
          handle: "@instB",
          testimonial: "Uploading materials is a breeze with this system.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-horizontal-green-screen-digital-tablet-hospital-ward-sick-patient-looking-isolated-background-mockup-template-with-chroma-key-gadget-display-technology_482257-27476.jpg",
          imageAlt: "Stylish Afro American student keyboarding on laptop computer while sitting at cafe table with textbooks, working on homework, having focused concentrated look. People, modern technology and education",
        },
        {
          id: "3",
          name: "Student C",
          handle: "@stuC",
          testimonial: "Responsive design works great on my tablet.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/studying-moments-pretty-joyful-brunette-young-woman-black-glasses-working-with-laptop-table-library-cheerful-mood-smiling-designing-creative-work-smart-student-success_197531-1865.jpg",
          imageAlt: "Stylish Afro American student keyboarding on laptop computer while sitting at cafe table with textbooks, working on homework, having focused concentrated look. People, modern technology and education",
        },
        {
          id: "4",
          name: "Instructor D",
          handle: "@instD",
          testimonial: "Simple but effective feature set for MVP.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/cropped-unrecognizable-person-analysing-financial-chart-smartphone_1098-18935.jpg",
          imageAlt: "Stylish Afro American student keyboarding on laptop computer while sitting at cafe table with textbooks, working on homework, having focused concentrated look. People, modern technology and education",
        },
        {
          id: "5",
          name: "Student E",
          handle: "@stuE",
          testimonial: "I love the interactive quiz feature, very helpful.",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/health-cure-medicine-medical-wellness-concept_53876-132293.jpg",
          imageAlt: "Stylish Afro American student keyboarding on laptop computer while sitting at cafe table with textbooks, working on homework, having focused concentrated look. People, modern technology and education",
        },
      ]}
      showRating={true}
      title="User Success Stories"
      description="What our early adopters have to say about the platform."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",
          value: "100+",
          title: "Active Courses",
          description: "Courses currently live.",
          icon: BookOpen,
        },
        {
          id: "m2",
          value: "2000+",
          title: "Happy Students",
          description: "Total registered learners.",
          icon: Users,
        },
        {
          id: "m3",
          value: "99.9%",
          title: "Uptime",
          description: "Reliable access 24/7.",
          icon: Zap,
        },
      ]}
      title="Performance at a Glance"
      description="Monitoring the impact and efficiency of our platform."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="split"
      useInvertedBackground={false}
      faqs={[
        {
          id: "f1",
          title: "Is this platform responsive?",
          content: "Yes, it is fully optimized for mobile and desktop.",
        },
        {
          id: "f2",
          title: "Can instructors edit content?",
          content: "Yes, instructors have full management capabilities.",
        },
        {
          id: "f3",
          title: "What's in the roadmap next?",
          content: "Progress tracking and third-party integrations.",
        },
      ]}
      title="Common Questions"
      description="Answers to frequently asked questions about the MVP."
      faqsAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/senior-man-doing-online-classes-tablet_23-2149114302.jpg"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Contact Us"
      description="Reach out to join our beta program today."
      inputs={[
        {
          name: "name",
          type: "text",
          placeholder: "Your Name",
        },
        {
          name: "email",
          type: "email",
          placeholder: "Email Address",
        },
      ]}
      textarea={{
        name: "message",
        placeholder: "What would you like to build?",
      }}
      imageSrc="http://img.b2bpic.net/free-photo/feedback-survey-response-advice-suggestions_53876-123637.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterSimple
      columns={[
        {
          title: "Company",
          items: [
            {
              label: "About",
              href: "#about",
            },
            {
              label: "Features",
              href: "#features",
            },
          ],
        },
        {
          title: "Resources",
          items: [
            {
              label: "Blog",
              href: "#",
            },
            {
              label: "Help",
              href: "#",
            },
          ],
        },
      ]}
      bottomLeftText="© 2024 EduPlatform MVP"
      bottomRightText="Built for Learning"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
