"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import TextAbout from '@/components/sections/about/TextAbout';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterCard from '@/components/sections/footer/FooterCard';
import Link from 'next/link';
import { Sparkles, Zap, BookOpen, Heart, Github, Twitter, Linkedin } from 'lucide-react';

export default function HomePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="small"
      sizing="medium"
      background="blurBottom"
      cardStyle="gradient-mesh"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="PyLearn"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Learn Python", id: "learn" },
            { name: "Practice", id: "practice" },
            { name: "Interpreter", id: "interpreter" }
          ]}
          button={{
            text: "Get Started",
            href: "/learn"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Learn Python the Interactive Way"
          description="Master Python programming with our beginner-friendly platform featuring integrated browser-based interpreter. Write code, see results instantly, and build your coding skills from the ground up."
          background={{ variant: "sparkles-gradient" }}
          tag="Start Learning Today"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          buttons={[
            { text: "Start Interactive Lesson", href: "/learn" },
            { text: "Try Interpreter Now", href: "/learn" }
          ]}
          buttonAnimation="blur-reveal"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/a-modern-code-editor-interface-displayin-1773824099697-e11e3078.png?_wi=1"
          imageAlt="Python code editor interface"
          mediaAnimation="slide-up"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNineteen
          tag="Platform Features"
          tagIcon={Zap}
          tagAnimation="slide-up"
          title="Everything You Need to Master Python"
          description="Our comprehensive platform combines structured lessons, hands-on practice, and an integrated Python interpreter to create the perfect learning environment for beginners."
          textboxLayout="split"
          useInvertedBackground={false}
          features={[
            {
              id: 1,
              tag: "Interactive Coding",
              title: "Browser-Based Interpreter",
              subtitle: "Write and Execute Python Code Instantly",
              description: "No installation needed. Write Python code directly in your browser and see the output immediately. Perfect for learning without setup complexity.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/a-browser-based-python-interpreter-inter-1773824100739-2213359b.png?_wi=1",
              imageAlt: "Online Python interpreter"
            },
            {
              id: 2,
              tag: "Structured Learning",
              title: "Comprehensive Tutorials",
              subtitle: "From Variables to Advanced Concepts",
              description: "Learn variables, loops, functions, lists, dictionaries, file handling, and basic data analysis through clear explanations and practical examples.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/an-educational-lesson-interface-showing--1773824099800-8c0e260b.png?_wi=1",
              imageAlt: "Python learning lessons"
            },
            {
              id: 3,
              tag: "Hands-On Practice",
              title: "Coding Challenges",
              subtitle: "Apply What You've Learned",
              description: "Practice with beginner-friendly challenges, receive hints when stuck, and view sample solutions. Build confidence through repeated practice.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/a-coding-challenges-platform-showing-beg-1773824100597-aef15a40.png?_wi=1",
              imageAlt: "Python coding challenges"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          tag="About PyLearn"
          tagIcon={BookOpen}
          tagAnimation="slide-up"
          title="Making Python Education Accessible to Everyone"
          useInvertedBackground={true}
          buttons={[
            { text: "Explore Lessons", href: "/learn" }
          ]}
          buttonAnimation="blur-reveal"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          cardTitle="Loved by Learners Worldwide"
          cardTag="Real Success Stories"
          cardTagIcon={Heart}
          cardAnimation="blur-reveal"
          useInvertedBackground={false}
          testimonials={[
            {
              id: "1",
              name: "Sarah Johnson",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-photo-of-a-young-p-1773824099410-832f9c00.png?_wi=1",
              imageAlt: "Sarah Johnson"
            },
            {
              id: "2",
              name: "Marcus Chen",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-of-a-mid-career-de-1773824098653-ff4cffc6.png?_wi=1",
              imageAlt: "Marcus Chen"
            },
            {
              id: "3",
              name: "Priya Patel",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-of-a-diverse-tech--1773824099111-c3409ef1.png?_wi=1",
              imageAlt: "Priya Patel"
            },
            {
              id: "4",
              name: "James Williams",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-of-a-successful-pr-1773824098688-76774071.png?_wi=1",
              imageAlt: "James Williams"
            }
          ]}
        />
      </div>

      <div id="blog" data-section="blog">
        <BlogCardOne
          tag="Learning Resources"
          tagIcon={BookOpen}
          tagAnimation="slide-up"
          title="Expert Guides & Learning Articles"
          description="Explore in-depth guides, tips, and resources to accelerate your Python learning journey."
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="blur-reveal"
          blogs={[
            {
              id: "1",
              category: "Beginner Guide",
              title: "Getting Started with Python: Your First Steps",
              excerpt: "Learn the fundamentals of Python programming, set up your environment, and write your first program.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/a-welcoming-introduction-scene-to-python-1773824099453-712f97b3.png?_wi=1",
              imageAlt: "Python getting started",
              authorName: "Dr. Alex Turner",
              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-photo-of-a-young-p-1773824099410-832f9c00.png",
              date: "March 15, 2024"
            },
            {
              id: "2",
              category: "Intermediate Level",
              title: "Mastering Data Structures: Lists, Dicts & More",
              excerpt: "Deep dive into Python's powerful data structures and learn how to use them effectively in your programs.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/an-intermediate-python-programmer-workin-1773824099739-6f478f46.png?_wi=1",
              imageAlt: "Python data structures",
              authorName: "Dr. Lisa Wong",
              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-of-a-mid-career-de-1773824098653-ff4cffc6.png",
              date: "March 10, 2024"
            },
            {
              id: "3",
              category: "Web Development",
              title: "Building Web Apps with Python: Flask Basics",
              excerpt: "Introduction to Flask framework and how to build simple web applications using Python.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/python-web-development-scene-showing-fla-1773824099826-147f4a68.png?_wi=1",
              imageAlt: "Python web development",
              authorName: "James Rodriguez",
              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-of-a-diverse-tech--1773824099111-c3409ef1.png",
              date: "March 5, 2024"
            },
            {
              id: "4",
              category: "Data Science",
              title: "Data Analysis with Python: Pandas & NumPy",
              excerpt: "Learn essential tools for data manipulation and analysis in Python's scientific ecosystem.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/data-analysis-and-visualization-with-pyt-1773824099522-623438b5.png",
              imageAlt: "Python data analysis",
              authorName: "Dr. Maya Patel",
              authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B6sh1xZKNJYDe63NCnshCWKiPL/professional-headshot-of-a-successful-pr-1773824098688-76774071.png",
              date: "February 28, 2024"
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Common Questions"
          sideDescription="Find answers to questions about PyLearn, Python programming, and getting started with our platform."
          faqs={[
            {
              id: "1",
              title: "Do I need to install anything to use PyLearn?",
              content: "No! PyLearn uses an integrated browser-based Python interpreter called Pyodide. You can start coding immediately without any installation. Everything runs safely inside your browser."
            },
            {
              id: "2",
              title: "Is PyLearn suitable for complete beginners?",
              content: "Absolutely. PyLearn is designed specifically for beginners. All lessons start from the fundamentals and progress gradually. You don't need any prior programming experience."
            },
            {
              id: "3",
              title: "Can I save my code and progress?",
              content: "Yes, you can save your code snippets and track your progress through our platform. Your learning journey is stored securely so you can pick up where you left off."
            },
            {
              id: "4",
              title: "What topics are covered in the tutorials?",
              content: "We cover variables, data types, loops, functions, lists, dictionaries, file handling, and basic data analysis. Lessons are structured to build upon each other gradually."
            },
            {
              id: "5",
              title: "Are there real-time coding challenges?",
              content: "Yes! Our practice section includes beginner-friendly challenges with hints and sample solutions. You can submit your code and get instant feedback."
            },
            {
              id: "6",
              title: "Can I use the interpreter for my own projects?",
              content: "Absolutely! The interpreter is available for all users to write and test any Python code. It's perfect for learning and quick testing of Python scripts."
            }
          ]}
          faqsAnimation="blur-reveal"
          useInvertedBackground={true}
          textPosition="left"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="PyLearn"
          copyrightText="© 2024 PyLearn | Making Python Education Accessible"
          socialLinks={[
            { icon: Github, href: "https://github.com", ariaLabel: "GitHub" },
            { icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
            { icon: Linkedin, href: "https://linkedin.com", ariaLabel: "LinkedIn" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}