"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import MediaAbout from '@/components/sections/about/MediaAbout';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import MetricCardTen from '@/components/sections/metrics/MetricCardTen';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Sparkles, Award, Zap, Star, TrendingUp, CheckCircle, DollarSign } from 'lucide-react';

export default function HomePage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Services", id: "services" },
    { name: "Portfolio", id: "portfolio" },
    { name: "Pricing", id: "pricing" },
    { name: "About", id: "about" },
    { name: "Contact", id: "contact" },
  ];

  const footerColumns = [
    {
      title: "Services",
      items: [
        { label: "Content Strategy", href: "/" },
        { label: "Community Management", href: "/" },
        { label: "Paid Social", href: "/" },
        { label: "Analytics & Reporting", href: "/" },
      ],
    },
    {
      title: "Company",
      items: [
        { label: "About Us", href: "/about" },
        { label: "Portfolio", href: "/" },
        { label: "Pricing", href: "/" },
        { label: "Contact", href: "/" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Privacy Policy", href: "#" },
        { label: "Terms of Service", href: "#" },
        { label: "Cookie Policy", href: "#" },
        { label: "Disclaimer", href: "#" },
      ],
    },
    {
      title: "Connect",
      items: [
        { label: "Instagram", href: "https://instagram.com" },
        { label: "LinkedIn", href: "https://linkedin.com" },
        { label: "Twitter", href: "https://twitter.com" },
        { label: "TikTok", href: "https://tiktok.com" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="mediumSmall"
      sizing="large"
      background="noise"
      cardStyle="soft-shadow"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="SocialPeak"
          navItems={navItems}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitTestimonial
          title="Transform Your Brand Through Strategic Social Media"
          description="We craft compelling social narratives that drive engagement, build communities, and deliver measurable results for premium brands."
          tag="Premium Social Media Services"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          buttons={[
            { text: "Start Your Strategy", href: "/contact" },
            { text: "View Portfolio", href: "/" },
          ]}
          buttonAnimation="slide-up"
          testimonials={[
            {
              name: "Alexandra Chen",
              handle: "@alexandrac_ventures",
              testimonial: "SocialPeak transformed our brand presence. Our engagement increased 340% in just 6 months.",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/business-woman-with-crossed-arms-smiling_23-2148095677.jpg",
              imageAlt: "Alexandra Chen",
            },
            {
              name: "Marcus Johnson",
              handle: "@marcus_jtech",
              testimonial: "The strategic approach and creative execution exceeded all our expectations. Best investment for our brand.",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/closeup-serious-handsome-middle-aged-boss_1262-4837.jpg",
              imageAlt: "Marcus Johnson",
            },
            {
              name: "Priya Patel",
              handle: "@priya_wellness_co",
              testimonial: "Their content strategy perfectly captured our brand voice. Sales grew 280% through social channels.",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/woman-with-crossed-arms_23-2147574179.jpg",
              imageAlt: "Priya Patel",
            },
            {
              name: "David Rodriguez",
              handle: "@david_innovation",
              testimonial: "Professional, creative, and results-driven. They truly understand premium brand positioning.",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-suit_23-2149705918.jpg",
              imageAlt: "David Rodriguez",
            },
          ]}
          testimonialRotationInterval={5000}
          useInvertedBackground={true}
          background={{ variant: "radial-gradient" }}
          imageSrc="http://img.b2bpic.net/free-photo/map-lying-wooden-table_53876-105723.jpg"
          imageAlt="Social Media Agency Team"
          mediaAnimation="slide-up"
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Elevating Brands Through Social Excellence"
          description="At SocialPeak, we combine strategic insight with creative excellence. Our team of specialists brings together years of experience in brand building, content creation, and digital community management. We don't just manage social media—we build movements."
          tag="Our Story"
          tagIcon={Award}
          tagAnimation="slide-up"
          buttons={[{ text: "Learn More", href: "/about" }]}
          buttonAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/group-business-partners-meeting-discussing-company-profits-making-research-looking-through-ompetieours-work-laptop-business-teamwork-concept_176420-8292.jpg"
          imageAlt="Our Creative Team"
          useInvertedBackground={false}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardEight
          title="Comprehensive Social Media Solutions"
          description="From strategy to execution, we deliver premium social media services that drive real business results."
          tag="What We Do"
          tagIcon={Zap}
          tagAnimation="slide-up"
          features={[
            {
              id: 1,
              title: "Content Strategy & Creation",
              description: "We develop compelling content narratives that resonate with your target audience, combining data insights with creative storytelling.",
              imageSrc: "http://img.b2bpic.net/free-photo/vlogger-recording-testimonial-about-mini-trepied-subscribers-professional-studio-video-photo-equipment-technology-work-photo-studio-social-media-star-influencer_482257-3924.jpg",
              imageAlt: "Content Creation",
            },
            {
              id: 2,
              title: "Social Media Strategy",
              description: "Strategic planning that aligns with your business goals. We analyze competitors, identify opportunities, and create actionable roadmaps.",
              imageSrc: "http://img.b2bpic.net/free-photo/male-consultant-presents-business-analytics_482257-121129.jpg",
              imageAlt: "Strategy Planning",
            },
            {
              id: 3,
              title: "Community Management",
              description: "Building engaged communities through authentic engagement, responsive communication, and strategic community growth initiatives.",
              imageSrc: "http://img.b2bpic.net/free-photo/office-worker-looks-greenscreen_482257-76595.jpg",
              imageAlt: "Community Management",
            },
          ]}
          textboxLayout="default"
          useInvertedBackground={true}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="portfolio" data-section="portfolio">
        <ProductCardFour
          title="Showcase of Success"
          description="Explore our portfolio of premium brand campaigns that delivered exceptional results."
          tag="Our Work"
          tagIcon={Star}
          tagAnimation="slide-up"
          buttonAnimation="slide-up"
          products={[
            {
              id: "luxury-fashion",
              name: "Luxury Fashion Brand",
              price: "340% Engagement Growth",
              variant: "Instagram Campaign",
              imageSrc: "http://img.b2bpic.net/free-psd/instagram-posts-collection-fashion-lifestyle_23-2148613428.jpg",
              imageAlt: "Luxury Fashion Campaign",
            },
            {
              id: "tech-startup",
              name: "Tech Startup Growth",
              price: "2.5M Impressions",
              variant: "Integrated Campaign",
              imageSrc: "http://img.b2bpic.net/free-photo/people-practicing-social-integration-workspace_23-2149405350.jpg",
              imageAlt: "Tech Startup Campaign",
            },
            {
              id: "wellness-brand",
              name: "Wellness Community",
              price: "280% Sales Growth",
              variant: "Community Building",
              imageSrc: "http://img.b2bpic.net/free-photo/stylish-girl-taking-pictures-with-apple-notebook-whie-table_176420-11555.jpg",
              imageAlt: "Wellness Campaign",
            },
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardTen
          title="Results That Speak"
          description="Our proven track record of delivering exceptional outcomes for premium brands."
          tag="Our Impact"
          tagIcon={TrendingUp}
          tagAnimation="slide-up"
          buttonAnimation="slide-up"
          metrics={[
            {
              id: "brands",
              title: "Premium Brands",
              subtitle: "Successfully Managed",
              category: "Clients",
              value: "150+",
            },
            {
              id: "engagement",
              title: "Average Engagement",
              subtitle: "Increase Per Campaign",
              category: "Growth",
              value: "340%",
            },
            {
              id: "followers",
              title: "Followers Generated",
              subtitle: "For Our Clients",
              category: "Community",
              value: "25M+",
            },
            {
              id: "campaigns",
              title: "Successful Campaigns",
              subtitle: "Launched & Optimized",
              category: "Experience",
              value: "500+",
            },
          ]}
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="slide-up"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          testimonials={[
            {
              id: "1",
              name: "Sarah Mitchell",
              imageSrc: "http://img.b2bpic.net/free-photo/business-woman-with-crossed-arms-smiling_23-2148095677.jpg",
              imageAlt: "Sarah Mitchell",
            },
            {
              id: "2",
              name: "James Chen",
              imageSrc: "http://img.b2bpic.net/free-photo/closeup-serious-handsome-middle-aged-boss_1262-4837.jpg",
              imageAlt: "James Chen",
            },
            {
              id: "3",
              name: "Elena Rodriguez",
              imageSrc: "http://img.b2bpic.net/free-photo/woman-with-crossed-arms_23-2147574179.jpg",
              imageAlt: "Elena Rodriguez",
            },
            {
              id: "4",
              name: "Michael Park",
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-suit_23-2149705918.jpg",
              imageAlt: "Michael Park",
            },
          ]}
          cardTitle="Exceptional Results, Premium Service"
          cardTag="Trusted by Industry Leaders"
          cardTagIcon={CheckCircle}
          cardAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Leading Brands"
          description="Join 150+ premium brands that have transformed their social presence with SocialPeak."
          tag="Our Partners"
          tagIcon={Star}
          tagAnimation="slide-up"
          buttonAnimation="slide-up"
          names={[
            "Luxury Fashion Inc",
            "Tech Innovations Co",
            "Wellness Global",
            "Real Estate Premier",
            "Commerce Elite",
            "Finance Leaders",
            "Hospitality Group",
          ]}
          textboxLayout="default"
          useInvertedBackground={true}
          showCard={true}
          speed={40}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="SocialPeak"
          copyrightText="© 2025 SocialPeak. All rights reserved."
          columns={footerColumns}
        />
      </div>
    </ThemeProvider>
  );
}