"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import { Calendar, Camera, Clock, GraduationCap, TrendingUp, Users } from "lucide-react";

export default function LandingPage() {
  const handlePayment = (planId: string) => {
    console.log(`Redirecting to Stripe checkout for plan: ${planId}`);
  };

  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="medium"
        sizing="largeSmallSizeLargeTitles"
        background="circleGradient"
        cardStyle="layered-gradient"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        { name: "Features", id: "#features"},
        { name: "Pricing", id: "#pricing"},
        { name: "Testimonials", id: "#testimonials"},
      ]}
      button={{ text: "Get Started", href: "#contact"}}
      brandName="StudyFlow AI"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardTestimonial
      useInvertedBackground={false}
      background={{ variant: "plain"}}
      title="Master Your Studies with AI"
      description="StudyFlow AI transforms your learning ecosystem, providing instant homework solutions, smart planners, and personalized tutoring 24/7."
      testimonials={[
        { name: "Alex R.", handle: "@alex_study", testimonial: "This app turned my grades around completely!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/chrome-key-tablet-updating-ai-systems_482257-90828.jpg?_wi=1", imageAlt: "ai student dashboard dark mode"},
        { name: "Jordan P.", handle: "@jp_learns", testimonial: "The AI explanations are so clear and easy.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-working-her-workshop-creative-invention_23-2149067197.jpg", imageAlt: "ai student dashboard dark mode"},
        { name: "Sam K.", handle: "@sam_study", testimonial: "Finally, a tool that actually understands complex physics problems.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/online-calendar_53876-95302.jpg", imageAlt: "ai student dashboard dark mode"},
        { name: "Mia L.", handle: "@mia_academic", testimonial: "My study efficiency has doubled since I started.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/shoukder-view-unrecognizable-person-examining-analysis-chart-tablet-pc_1098-18930.jpg", imageAlt: "ai student dashboard dark mode"},
        { name: "Leo T.", handle: "@leo_tech", testimonial: "The personalized schedule keeps me on track every day.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/image-stylish-african-student-with-earring-wearing-denim-shirt-sitting-wooden-table-doing-his-homework-holding-smartphone-being-happy-recieve-message-from-his-friend-typing-something_273609-7426.jpg?_wi=1", imageAlt: "ai student dashboard dark mode"},
      ]}
      buttons={[{ text: "Start Free Trial", href: "#contact"}]}
      imageSrc="http://img.b2bpic.net/free-photo/chrome-key-tablet-updating-ai-systems_482257-90828.jpg?_wi=2"
      avatars={[
        { src: "http://img.b2bpic.net/free-photo/focused-self-employed-adult-researching-data-driven-topics-home_482257-120641.jpg", alt: "Student avatar 1"},
        { src: "http://img.b2bpic.net/free-photo/network-analyst-studying-digital-commerce-progression-reports-computer_482257-126389.jpg", alt: "Student avatar 2"},
        { src: "http://img.b2bpic.net/free-photo/stakeholders-president-company-gather-via-video-link_482257-82326.jpg", alt: "Student avatar 3"},
        { src: "http://img.b2bpic.net/free-photo/futuristic-ai-data-visualization_23-2151977857.jpg", alt: "Student avatar 4"},
        { src: "http://img.b2bpic.net/free-photo/top-view-wooden-figurine-with-academic-cap-notebook_23-2148756544.jpg", alt: "Student avatar 5"},
      ]}
      avatarText="Join 100,000+ students"
      marqueeItems={[{ type: "text", text: "Mathematics"}, { type: "text", text: "Physics"}, { type: "text", text: "Chemistry"}, { type: "text", text: "History"}, { type: "text", text: "Computer Science"}]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureHoverPattern
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        { icon: Camera, title: "AI Homework Solver", description: "Snap a photo and get step-by-step explanations instantly."},
        { icon: Calendar, title: "Smart Study Planner", description: "Personalized schedules that adapt to your progress and deadlines."},
        { icon: GraduationCap, title: "AI Quiz Generator", description: "Generate custom quizzes from any material to ensure you're ready."},
      ]}
      title="Smarter Learning, Faster Results"
      description="Our core suite of tools is designed to bridge the gap between struggling with content and mastering your academic goals."
    />
  </div>

  <div id="ecosystem" data-section="ecosystem">
      <TextSplitAbout
      useInvertedBackground={false}
      title="Your All-in-One Study Ecosystem"
      description={[
        "StudyFlow AI isn't just a solver; it's a productivity powerhouse. From focus modes and distraction blockers to deep performance analytics, we track every aspect of your learning.",        "Our advanced AI summarizes dense PDFs into revision sheets, tracks your study streaks with XP and gamification, and provides a platform to compete on leaderboards with friends."]}
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardTwo
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      plans={[
        { id: "free", badge: "Basic", price: "$0", subtitle: "Get started with essentials", buttons: [{ text: "Sign Up", onClick: () => handlePayment("free")}], features: ["Limited daily AI questions", "Basic planner", "Ad-supported"]},
        { id: "premium", badge: "Pro", price: "$9.99", subtitle: "For focused learners", buttons: [{ text: "Upgrade", onClick: () => handlePayment("premium"]}], features: ["Unlimited explanations", "PDF summarization", "No ads"]},
        { id: "plus", badge: "Plus", price: "$19.99", subtitle: "For top performers", buttons: [{ text: "Upgrade", onClick: () => handlePayment("plus"]}], features: ["Voice tutoring", "Exam prediction AI", "Group study rooms"]},
      ]}
      title="Flexible Plans for Every Student"
      description="Choose the level of AI support that fits your academic journey."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      metrics={[
        { id: "1", value: "45%", title: "Grade Improvement", description: "Average increase in student grades.", icon: TrendingUp},
        { id: "2", value: "2hrs", title: "Time Saved", description: "Average hours saved per week on homework.", icon: Clock},
        { id: "3", value: "100k+", title: "Students Helped", description: "Students already acing their exams.", icon: Users},
      ]}
      title="Proven Academic Impact"
      description="See how StudyFlow AI makes a real difference in student productivity."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSix
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      testimonials={[
        { id: "1", name: "Sarah J.", handle: "@sarah_j", testimonial: "I never understood physics until StudyFlow AI.", imageSrc: "http://img.b2bpic.net/free-photo/image-stylish-african-student-with-earring-wearing-denim-shirt-sitting-wooden-table-doing-his-homework-holding-smartphone-being-happy-recieve-message-from-his-friend-typing-something_273609-7426.jpg?_wi=2"},
        { id: "2", name: "Mark L.", handle: "@mark_l", testimonial: "The quiz generator is a total lifesaver for finals.", imageSrc: "http://img.b2bpic.net/free-photo/woman-works-tablet-does-graphic-design-draws-sketch-works-as-freelance-illustrator-dressed-casually-poses-outdoor-uses-electronic-pen-writing_273609-54703.jpg"},
        { id: "3", name: "Elena V.", handle: "@elena_v", testimonial: "Finally, an AI that explains instead of just answering.", imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-student-boy-sitting-desk-with-school-tools-showing-yes-gesture-isolated-yellow-wall_141793-78126.jpg"},
        { id: "4", name: "Kevin B.", handle: "@kevin_b", testimonial: "The study planner is incredibly helpful for my schedule.", imageSrc: "http://img.b2bpic.net/free-photo/glad-student-girl-posing-desk-against-pink-wall_273609-20798.jpg"},
        { id: "5", name: "Chloe T.", handle: "@chloe_t", testimonial: "Gamification makes studying feel like a game now!", imageSrc: "http://img.b2bpic.net/free-photo/young-content-student-with-with-books_23-2147655927.jpg"},
      ]}
      title="Loved by Students Globally"
      description="Hear from students whose grades and confidence skyrocketed after using StudyFlow AI."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="split"
      useInvertedBackground={false}
      faqs={[
        { id: "q1", title: "Is the app free?", content: "Yes, we offer a robust free plan with daily limitations. You can upgrade for unlimited features."},
        { id: "q2", title: "Does it work for math?", content: "Yes, we support math, physics, chemistry, and many more subjects."},
        { id: "q3", title: "Can I upload my own notes?", content: "Yes, you can upload PDFs, photos, and handwritten notes for summarization."},
      ]}
      mediaAnimation="slide-up"
      title="Frequently Asked Questions"
      description="Got questions? We've got answers to help you get started on your journey."
      faqsAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/caucasian-female-student-good-humor-trying-find-required-information-history-studying-textbook-sitting-library-front-piles-books-smiling-looking-happy-satisfied_273609-1117.jpg"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      tag="Contact"
      title="Ready to transform your study habits?"
      description="Get started today and unlock your full academic potential."
      background={{ variant: "plain" }}
      mediaPosition="right"
      onSubmit={(email) => console.log("Signed up:", email)}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        { title: "Product", items: [{ label: "Features", href: "#features"}, { label: "Pricing", href: "#pricing"}]},
        { title: "Company", items: [{ label: "About Us", href: "#"}, { label: "Contact", href: "#contact"}]},
        { title: "Legal", items: [{ label: "Privacy", href: "#"}, { label: "Terms", href: "#"}]},
      ]}
      logoText="StudyFlow AI"
      copyrightText="© 2025 StudyFlow AI"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}