"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { BookOpen, Newspaper } from "lucide-react";

export default function BlogPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="reveal-blur"
      borderRadius="sharp"
      contentWidth="smallMedium"
      sizing="mediumLargeSizeLargeTitles"
      background="aurora"
      cardStyle="glass-elevated"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Home", id: "hero" },
            { name: "Articles", id: "blog" },
            { name: "Categories", id: "blog" },
            { name: "Subscribe", id: "newsletter" },
            { name: "About", id: "about" }
          ]}
          button={{ text: "Subscribe", href: "newsletter" }}
          brandName="ArticleHub"
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroSplitDualMedia
          title="Discover Stories That Inspire and Transform"
          description="Explore in-depth articles on digital marketing, design innovation, technology trends, and creative inspiration curated for curious minds."
          tag="Welcome to Our Blog"
          tagIcon={BookOpen}
          background={{ variant: "aurora" }}
          mediaItems={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-with-glasses-cafe_273609-3980.jpg",              imageAlt: "Blog reading workspace"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/concentrated-colleagues-sitting-office-coworking_171337-17049.jpg",              imageAlt: "Creative writing environment"
            }
          ]}
          rating={5}
          ratingText="Trusted by 15,000+ readers"
          buttons={[
            { text: "Explore Articles", href: "blog" },
            { text: "Subscribe Now", href: "newsletter" }
          ]}
        />
      </div>
      
      <div id="blog" data-section="blog">
        <BlogCardTwo
          title="Latest Articles"
          description="Stay updated with our most recent insights and expert perspectives on digital topics."
          tag="Blog"
          tagIcon={Newspaper}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          carouselMode="buttons"
          blogs={[
            {
              id: "1",              category: ["Digital Marketing", "Strategy"],
              title: "The Complete Guide to Content Marketing in 2025",              excerpt: "Learn the essential strategies and tactics for creating compelling content that drives engagement and conversions in today's digital landscape.",              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-with-glasses-cafe_273609-3973.jpg",              authorName: "Sarah Mitchell",              authorAvatar: "https://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman-looking-camera_74855-4120.jpg",              date: "15 Jan 2025"
            },
            {
              id: "2",              category: ["Design", "UX/UI"],
              title: "Designing for Accessibility: Creating Inclusive Digital Experiences",              excerpt: "Explore best practices for designing digital products that are accessible to everyone, including those with disabilities.",              imageSrc: "https://img.b2bpic.net/free-photo/hands-writing-notebook_1150-162.jpg",              authorName: "Michael Chen",              authorAvatar: "https://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg",              date: "12 Jan 2025"
            },
            {
              id: "3",              category: ["Technology", "Innovation"],
              title: "AI and Machine Learning: Transforming Business Operations",              excerpt: "Discover how artificial intelligence is revolutionizing industries and creating new opportunities for businesses worldwide.",              imageSrc: "https://img.b2bpic.net/free-photo/young-woman-with-glasses-cafe_273609-3978.jpg",              authorName: "Emma Rodriguez",              authorAvatar: "https://img.b2bpic.net/free-photo/casual-smile-street-style-background-spring_1139-777.jpg",              date: "10 Jan 2025"
            },
            {
              id: "4",              category: ["Lifestyle", "Productivity"],
              title: "Building Sustainable Habits: A Science-Backed Approach",              excerpt: "Learn psychological principles and practical techniques for developing lasting habits that stick and transform your life.",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-good-woman-cup-computer-bed_1418-484.jpg",              authorName: "David Park",              authorAvatar: "https://img.b2bpic.net/free-photo/portrait-attractive-young-businesswoman_329181-15813.jpg",              date: "8 Jan 2025"
            },
            {
              id: "5",              category: ["Travel", "Culture"],
              title: "Hidden Gems: Undiscovered Destinations Worth Exploring",              excerpt: "Venture beyond typical tourist routes and discover authentic, breathtaking destinations that offer unique cultural experiences.",              imageSrc: "https://img.b2bpic.net/free-photo/cropped-man-checking-blueprint-while-having-tea_1098-18847.jpg",              authorName: "Jessica Williams",              authorAvatar: "https://img.b2bpic.net/free-photo/real-professional-smiling-businesswoman-looking-confident-determined-face-expression-standing-suit-white-background_1258-123234.jpg",              date: "5 Jan 2025"
            },
            {
              id: "6",              category: ["Photography", "Visual Arts"],
              title: "Mastering Visual Storytelling Through Photography",              excerpt: "Unlock the techniques and principles professional photographers use to tell compelling stories through images.",              imageSrc: "https://img.b2bpic.net/free-photo/pregnant-woman-using-digital-tablet-living-room_107420-12191.jpg",              authorName: "James Thompson",              authorAvatar: "https://img.b2bpic.net/free-photo/real-professional-smiling-businesswoman-looking-confident-determined-face-expression-standing-suit-white-background_1258-122910.jpg",              date: "2 Jan 2025"
            }
          ]}
        />
      </div>
      
      <div id="newsletter" data-section="newsletter">
        <ContactSplitForm
          title="Subscribe to Our Newsletter"
          description="Join thousands of readers getting weekly insights on digital marketing, design, and innovation directly to your inbox."
          useInvertedBackground="invertDefault"
          imageSrc="https://img.b2bpic.net/free-photo/join-us-register-newsletter-concept_53876-132697.jpg"
          imageAlt="Newsletter subscription illustration"
          mediaPosition="right"
          inputs={[
            {
              name: "name",              type: "text",              placeholder: "Full Name",              required: true
            },
            {
              name: "email",              type: "email",              placeholder: "Email Address",              required: true
            }
          ]}
          textarea={{
            name: "interests",            placeholder: "What topics interest you most? (Optional)",            rows: 4,
            required: false
          }}
          buttonText="Subscribe Now"
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="ArticleHub"
          leftLink={{ text: "Privacy Policy", href: "#" }}
          rightLink={{ text: "Terms of Service", href: "#" }}
        />
      </div>
    </ThemeProvider>
  );
}