"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import TagMediaSplitAbout from '@/components/sections/about/TagMediaSplitAbout';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import TeamCardFour from '@/components/sections/team/TeamCardFour';
import ContactInline from '@/components/sections/contact/ContactInline';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { ShoppingCart, Sparkles, Target } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="medium"
      sizing="medium"
      background="animatedAurora"
      cardStyle="noise"
      primaryButtonStyle="flat"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="MarketHub"
          navItems={[
            { name: "Services", id: "services" },
            { name: "Work", id: "work" },
            { name: "About", id: "about" },
            { name: "Team", id: "team" }
          ]}
          button={{
            text: "Get Started",
            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogo
          logoText="MarketHub"
          description="Strategic marketing solutions that drive growth and transform brands"
          buttons={[
            { text: "View Our Work", href: "work" },
            { text: "Schedule Consultation", href: "contact" }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735973071-k7swxkeq.jpg"
          imageAlt="Marketing strategy and creative collaboration"
          showDimOverlay={true}
        />
      </div>

      <div id="about" data-section="about">
        <TagMediaSplitAbout
          variant="card"
          title="Transforming Ideas Into Results"
          description="We are a full-service marketing agency dedicated to helping businesses reach their full potential"
          tag="About Us"
          textboxLayout="default"
          contentTag="OUR APPROACH"
          contentTagIcon={Sparkles}
          contentTitle="Data-Driven Marketing Excellence"
          contentDescription="With over a decade of combined expertise, our team crafts custom marketing strategies that blend creativity with analytics. We don't just create campaigns—we build lasting connections between brands and their audiences."
          contentButtons={[{ text: "Learn More", href: "#" }]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140098536-9jc7ywck.jpg"
          imageAlt="Our creative team collaborating"
          imagePosition="right"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardSixteen
          title="Why Choose MarketHub"
          description="See how our approach delivers better results than traditional marketing"
          tag="Services"
          textboxLayout="default"
          negativeCard={{
            title: "Traditional Marketing",
            items: [
              "One-size-fits-all campaigns",
              "Limited measurement and analytics",
              "Slow adaptation to market changes",
              "Higher costs with unclear ROI",
              "Outdated strategies and tactics"
            ]
          }}
          positiveCard={{
            title: "MarketHub Strategy",
            items: [
              "Custom tailored campaigns for your brand",
              "Real-time data and performance tracking",
              "Agile approach with rapid optimization",
              "Transparent ROI and cost efficiency",
              "Modern tactics and cutting-edge tools"
            ]
          }}
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="work" data-section="work">
        <BlogCardThree
          title="Featured Case Studies"
          description="Real results from brands we've helped transform"
          tag="Work"
          textboxLayout="default"
          animationType="slide-up"
          containerStyle="default"
          useInvertedBackground="noInvert"
          blogs={[
            {
              id: "1",
              category: "E-Commerce",
              categoryIcon: ShoppingCart,
              title: "200% Sales Growth in 6 Months",
              description: "Comprehensive digital strategy for leading online retailer increased conversions through targeted campaigns",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735979965-ub5950lw.jpg",
              imageAlt: "E-commerce success case study"
            },
            {
              id: "2",
              category: "Brand Strategy",
              categoryIcon: Target,
              title: "Brand Repositioning Success",
              description: "Rebranded established company for millennial audience, resulting in 150% increase in engagement",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140107205-4bafhl5z.jpg",
              imageAlt: "Brand strategy case study"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Our Impact by Numbers"
          description="Proven results across diverse industries and markets"
          tag="Results"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          metrics={[
            {
              id: "1",
              value: "500+",
              title: "Campaigns Delivered",
              description: "Successful marketing campaigns across all channels",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735978956-mbp7zxok.jpg",
              imageAlt: "Campaign success metrics"
            },
            {
              id: "2",
              value: "$50M+",
              title: "Revenue Generated",
              description: "Total revenue driven for our clients",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735978956-mbp7zxok.jpg",
              imageAlt: "Revenue metrics"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Our Clients Say"
          description="Real feedback from brands we've partnered with"
          tag="Testimonials"
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          containerStyle="default"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",
              name: "Sarah Johnson",
              role: "CEO",
              company: "TechVenture Inc",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140101670-ttp7xdlv.jpg",
              imageAlt: "Sarah Johnson testimonial"
            },
            {
              id: "2",
              name: "Michael Chen",
              role: "Marketing Director",
              company: "RetailBrand Co",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766517224921-22qgllu9.jpg",
              imageAlt: "Michael Chen testimonial"
            },
            {
              id: "3",
              name: "Emily Rodriguez",
              role: "Founder",
              company: "GrowthLabs",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735981305-ohmchoon.jpg",
              imageAlt: "Emily Rodriguez testimonial"
            },
            {
              id: "4",
              name: "David Kim",
              role: "CMO",
              company: "InnovateCorp",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735982136-fwsz9f0i.jpg",
              imageAlt: "David Kim testimonial"
            }
          ]}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardFour
          title="Meet Our Team"
          description="Creative experts driving results"
          tag="Team"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          team={[
            {
              id: "1",
              name: "Alexandra Stone",
              role: "Creative Director",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766320179601-o8gildtx.jpg",
              imageAlt: "Alexandra Stone"
            },
            {
              id: "2",
              name: "James Mitchell",
              role: "Strategy Lead",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766320184384-whnns6as.jpg",
              imageAlt: "James Mitchell"
            },
            {
              id: "3",
              name: "Lisa Park",
              role: "Digital Strategist",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766320178642-9c2nk7ji.jpg",
              imageAlt: "Lisa Park"
            },
            {
              id: "4",
              name: "Marcus Williams",
              role: "Content Director",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735974338-mwt6qh8n.jpg",
              imageAlt: "Marcus Williams"
            },
            {
              id: "5",
              name: "Nina Patel",
              role: "Social Media Lead",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735975379-yoqflx89.jpg",
              imageAlt: "Nina Patel"
            },
            {
              id: "6",
              name: "Christopher Lee",
              role: "Analytics Specialist",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735976207-aze9gss7.jpg",
              imageAlt: "Christopher Lee"
            },
            {
              id: "7",
              name: "Jessica Brown",
              role: "UX/UI Designer",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735977046-e7cx4iz7.jpg",
              imageAlt: "Jessica Brown"
            },
            {
              id: "8",
              name: "Robert Garcia",
              role: "Campaign Manager",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766735977891-vxdvgsqm.jpg",
              imageAlt: "Robert Garcia"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactInline
          text="Ready to transform your marketing?"
          animationType="background-highlight"
          inputPlaceholder="Enter your email"
          buttonText="Get in Touch"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="MarketHub"
          columns={[
            {
              title: "Services",
              items: [
                { label: "Strategy", href: "#" },
                { label: "Content Marketing", href: "#" },
                { label: "Social Media", href: "#" },
                { label: "Analytics", href: "#" }
              ]
            },
            {
              title: "Company",
              items: [
                { label: "About", href: "about" },
                { label: "Team", href: "team" },
                { label: "Work", href: "work" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              title: "Resources",
              items: [
                { label: "Blog", href: "#" },
                { label: "Case Studies", href: "#" },
                { label: "Tools", href: "#" },
                { label: "Guides", href: "#" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Privacy", href: "#" },
                { label: "Terms", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2024 MarketHub. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}