"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroSplit from "@/components/sections/hero/HeroSplit";
import FeatureCardNineteen from "@/components/sections/feature/FeatureCardNineteen";
import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
import AboutMetric from "@/components/sections/about/AboutMetric";
import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import { Sparkles, Zap, TrendingUp, BarChart3, Lightbulb, Users, Heart, Award } from "lucide-react";

const navItems = [
  { name: "Services", id: "services" },
  { name: "Portfolio", id: "portfolio" },
  { name: "Insights", id: "blog" },
  { name: "Testimonials", id: "testimonials" },
  { name: "Contact", id: "contact" },
];

const footerColumns = [
  {
    title: "Services",    items: [
      { label: "Short-Form Content", href: "/services" },
      { label: "Long-Form Production", href: "/services" },
      { label: "Strategy Consulting", href: "/services" },
      { label: "Analytics & Optimization", href: "/services" },
    ],
  },
  {
    title: "Company",    items: [
      { label: "About Us", href: "/about" },
      { label: "Our Process", href: "#process" },
      { label: "Case Studies", href: "/portfolio" },
      { label: "Careers", href: "/careers" },
    ],
  },
  {
    title: "Resources",    items: [
      { label: "Content Blog", href: "/blog" },
      { label: "Trend Reports", href: "/trends" },
      { label: "Creator Community", href: "/community" },
      { label: "Contact", href: "#contact" },
    ],
  },
];

export default function HomePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="largeSmall"
      background="noiseDiagonalGradient"
      cardStyle="subtle-shadow"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="normal"
    >
      {/* Navbar */}
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={navItems}
          button={{ text: "Start Growing", href: "#contact" }}
          brandName="ViralFlow"
        />
      </div>

      {/* Hero Section */}
      <div id="hero" data-section="hero">
        <HeroSplit
          title="Transform Your Message Into Viral Moments"
          description="We specialize in crafting compelling short-form and long-form content that captures attention, drives engagement, and builds authentic connections with your audience across all platforms."
          background={{ variant: "glowing-orb" }}
          tag="Content Strategy Specialists"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          buttons={[
            { text: "Explore Our Work", href: "/portfolio" },
            { text: "Book Strategy Call", href: "#contact" },
          ]}
          buttonAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/people-working-together-new-film_23-2149066351.jpg"
          imageAlt="Content creation team in action"
          mediaAnimation="slide-up"
          imagePosition="right"
        />
      </div>

      {/* Services Section */}
      <div id="services" data-section="services">
        <FeatureCardNineteen
          title="Our Content Services"
          description="From viral TikTok trends to in-depth YouTube documentaries, we handle every format with excellence and strategic precision."
          tag="What We Do"
          tagIcon={Zap}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          features={[
            {
              id: 1,
              tag: "Short-Form Mastery",              title: "TikTok & Reels Optimization",              subtitle: "Viral-ready content designed to dominate",              description:
                "We create snappy, scroll-stopping content that leverages platform algorithms. From trending sounds to perfect cuts, every frame is engineered for virality and audience engagement.",              imageSrc:
                "http://img.b2bpic.net/free-photo/person-recording-blogger-influencer_1268-21928.jpg",              imageAlt: "Short-form content creation"},
            {
              id: 2,
              tag: "Long-Form Excellence",              title: "YouTube & Podcast Production",              subtitle: "Deep dives that build loyal communities",              description:
                "Our long-form specialists craft narratives that hold attention from intro to outro. High-quality production, compelling storytelling, and strategic SEO optimization for maximum reach.",              imageSrc:
                "http://img.b2bpic.net/free-photo/close-up-shot-phone-used-film-by-influencer-making-energetic-hand-movements_482257-123006.jpg",              imageAlt: "Long-form video production"},
            {
              id: 3,
              tag: "Cross-Platform Strategy",              title: "Omnichannel Content Planning",              subtitle: "One idea, infinite platforms",              description:
                "We develop content ecosystems where short-form pieces funnel audiences to long-form experiences. Strategic repurposing maximizes your content ROI across YouTube, Instagram, TikTok, Twitter, and LinkedIn.",              imageSrc:
                "http://img.b2bpic.net/free-vector/social-media-network-tree_1394-23.jpg",              imageAlt: "Multi-platform content strategy"},
            {
              id: 4,
              tag: "Audience Analytics",              title: "Data-Driven Optimization",              subtitle: "Measure, learn, and grow continuously",              description:
                "Every piece of content is tracked and analyzed. We use deep-dive metrics to understand what resonates with your audience and continuously refine your content strategy for better performance.",              imageSrc:
                "http://img.b2bpic.net/free-photo/data-analytics-dashboard_23-2152001529.jpg",              imageAlt: "Content analytics and performance metrics"},
          ]}
        />
      </div>

      {/* Metrics Section */}
      <div id="metrics" data-section="metrics">
        <MetricCardTwo
          title="The Numbers Behind Our Success"
          description="Real results from real campaigns. These metrics represent the impact we deliver for our clients."
          tag="Performance"
          tagIcon={BarChart3}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          metrics={[
            {
              id: "1",              value: "500M+",              description: "Total Views Generated Across Platforms"},
            {
              id: "2",              value: "2.5M+",              description: "Average Campaign Reach Per Month"},
            {
              id: "3",              value: "8.2%",              description: "Average Engagement Rate (Industry: 2.1%)"},
            {
              id: "4",              value: "150+",              description: "Successful Campaigns Delivered"},
          ]}
        />
      </div>

      {/* Process Section */}
      <div id="process" data-section="process">
        <AboutMetric
          title="Our Content Creation Philosophy: Strategy First, Creativity Second, Virality Always"
          useInvertedBackground={true}
          metricsAnimation="slide-up"
          metrics={[
            {
              icon: Lightbulb,
              label: "Strategic Planning",              value: "100%"},
            {
              icon: Zap,
              label: "Execution Speed",              value: "48hrs"},
            {
              icon: Users,
              label: "Audience Growth",              value: "300%"},
            {
              icon: TrendingUp,
              label: "Viral Probability",              value: "7x Better"},
          ]}
        />
      </div>

      {/* Testimonials Section */}
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Our Clients Say"
          description="Real feedback from brands and creators who've experienced viral success with our content strategies."
          tag="Client Success Stories"
          tagIcon={Heart}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          testimonials={[
            {
              id: "1",              name: "Victoria Laurent",              role: "Marketing Director",              company: "Fashion Forward Inc",              rating: 5,
              imageSrc:
                "http://img.b2bpic.net/free-photo/portrait-young-woman-with-long-brown-hair-black-t-shirt-white-jacket_613910-8245.jpg",              imageAlt: "Victoria Laurent"},
            {
              id: "2",              name: "Marcus Thompson",              role: "CEO",              company: "TechGrow Startups",              rating: 5,
              imageSrc:
                "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "Marcus Thompson"},
            {
              id: "3",              name: "Sarah Okonkwo",              role: "Content Lead",              company: "Beauty Collective",              rating: 5,
              imageSrc:
                "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg",              imageAlt: "Sarah Okonkwo"},
            {
              id: "4",              name: "James Patterson",              role: "Founder",              company: "Digital Nomad Network",              rating: 5,
              imageSrc:
                "http://img.b2bpic.net/free-photo/young-serious-businessman-looking-camera-meeting-headshot-portrait_1163-3923.jpg",              imageAlt: "James Patterson"},
            {
              id: "5",              name: "Emma Rodriguez",              role: "Brand Manager",              company: "Wellness Revolution",              rating: 5,
              imageSrc:
                "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",              imageAlt: "Emma Rodriguez"},
            {
              id: "6",              name: "David Nakamura",              role: "Growth Manager",              company: "EdTech Solutions",              rating: 5,
              imageSrc:
                "http://img.b2bpic.net/free-photo/close-up-smiley-man-library_23-2149204750.jpg",              imageAlt: "David Nakamura"},
          ]}
        />
      </div>

      {/* Social Proof Section */}
      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Leading Brands"
          description="From emerging startups to Fortune 500 companies, these brands trust us with their content strategy and brand growth."
          tag="Our Partners"
          tagIcon={Award}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          names={["Netflix", "Shopify", "HubSpot", "Airbnb", "Stripe", "Figma", "Notion", "Canva"]}
          speed={35}
          showCard={true}
        />
      </div>

      {/* Footer */}
      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={footerColumns}
          copyrightText="© 2025 ViralFlow. All rights reserved. | Built for content creators, powered by data."
        />
      </div>
    </ThemeProvider>
  );
}