"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroBillboardTestimonial from "@/components/sections/hero/HeroBillboardTestimonial";
import TextAbout from "@/components/sections/about/TextAbout";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import { Zap, Lightbulb, Globe, Smartphone, Code, Award, MessageSquare, CheckCircle, Target } from "lucide-react";

const HomePage = () => {
  const navItems = [
    { name: "Home", id: "/" },
    { name: "Services", id: "/services" },
    { name: "Portfolio", id: "/portfolio" },
    { name: "About", id: "/about" },
    { name: "Contact", id: "/contact" },
  ];

  const footerColumns = [
    {
      title: "Product",      items: [
        { label: "Services", href: "services" },
        { label: "Portfolio", href: "portfolio" },
        { label: "Pricing", href: "#" },
        { label: "Security", href: "#" },
      ],
    },
    {
      title: "Company",      items: [
        { label: "About Us", href: "about" },
        { label: "Our Team", href: "about" },
        { label: "Blog", href: "#" },
        { label: "Contact", href: "contact" },
      ],
    },
    {
      title: "Connect",      items: [
        { label: "LinkedIn", href: "https://linkedin.com" },
        { label: "Twitter", href: "https://twitter.com" },
        { label: "GitHub", href: "https://github.com" },
        { label: "Facebook", href: "https://facebook.com" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="mediumLargeSizeMediumTitles"
      background="circleGradient"
      cardStyle="subtle-shadow"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      {/* Navbar */}
      <div id="nav" data-section="nav">
        <NavbarStyleApple brandName="Kraftcode" navItems={navItems} />
      </div>

      {/* Hero Section */}
      <div id="hero" data-section="hero">
        <HeroBillboardTestimonial
          title="Discover Your Path to Success"
          description="Seize the Opportunity: Start Your Transformation Today. In today's dynamic digital world, staying ahead means embracing innovation and powerful solutions. We help elevate your business to new heights through expert website development, Android app development, and iOS app development."
          tag="Digital Innovation"
          tagIcon={Zap}
          tagAnimation="slide-up"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/a-modern-tech-company-hero-image-showing-1772536832346-3e105fc1.png"
          imageAlt="Digital transformation and innovation"
          mediaAnimation="slide-up"
          testimonials={[
            {
              name: "Sarah Johnson",              handle: "CEO, TechCorp",              testimonial:
                "Working with Kraftcode transformed our digital presence. Their strategic insights and meticulous approach delivered results beyond expectations.",              rating: 5,
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-a-business-exec-1772536829249-92484298.png",              imageAlt: "Sarah Johnson"},
            {
              name: "Michael Chen",              handle: "CTO, InnovateLab",              testimonial:
                "Exceptional team that understands technology and business. They delivered a cutting-edge platform that exceeded all our requirements.",              rating: 5,
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-a-business-mana-1772536828421-9ae258e6.png",              imageAlt: "Michael Chen"},
            {
              name: "Emily Rodriguez",              handle: "Founder, GrowthCo",              testimonial:
                "Kraftcode's expertise in web and mobile development is unmatched. They built solutions that directly contributed to our business growth.",              rating: 5,
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-an-entrepreneur-1772536829312-461ee1ff.png",              imageAlt: "Emily Rodriguez"},
          ]}
          testimonialRotationInterval={5000}
          buttons={[
            { text: "Get Started Today", href: "/contact" },
            { text: "See Our Services", href: "/services" },
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "glowing-orb" }}
          useInvertedBackground={false}
          ariaLabel="Hero section"
        />
      </div>

      {/* About Section */}
      <div id="about" data-section="about">
        <TextAbout
          tag="About Kraftcode"
          tagIcon={Target}
          tagAnimation="blur-reveal"
          title="Unlocking Transformational Potential Through Expert Digital Solutions. We craft innovative, high-performance websites and mobile applications that drive real results."
          buttons={[{ text: "Learn More About Us", href: "/about" }]}
          buttonAnimation="blur-reveal"
          useInvertedBackground={true}
          ariaLabel="About section"
        />
      </div>

      {/* Services Section */}
      <div id="services" data-section="services">
        <FeatureHoverPattern
          title="Expertise in Digital Solutions"
          description="Strategic, creative, and tech-driven solutions tailored for your success. We combine strategic thinking with creative design and advanced development to ensure every solution is both functional and impactful."
          tag="Our Services"
          tagIcon={Lightbulb}
          tagAnimation="slide-up"
          features={[
            {
              icon: Globe,
              title: "Website Development",              description:
                "Custom sites boost your online presence. We create responsive, scalable websites that engage users and drive conversions.",              button: { text: "Explore Web Services", href: "/services" },
            },
            {
              icon: Smartphone,
              title: "Mobile App Development",              description:
                "Mobile solutions tailored to your vision. iOS and Android apps built with cutting-edge technology and user-centric design.",              button: { text: "Explore App Services", href: "/services" },
            },
            {
              icon: Code,
              title: "Custom Development",              description:
                "Bespoke solutions tailored to your unique business requirements. We build scalable, secure, and innovative digital products.",              button: { text: "Explore Custom Solutions", href: "/services" },
            },
            {
              icon: Zap,
              title: "Performance Optimization",              description:
                "Lightning-fast applications and websites. We optimize every aspect to ensure exceptional speed and user experience.",              button: { text: "Learn About Optimization", href: "/services" },
            },
            {
              icon: Code,
              title: "Security & Compliance",              description:
                "Enterprise-grade security and compliance. We build solutions that protect your data and meet industry standards.",              button: { text: "Explore Security", href: "/services" },
            },
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttonAnimation="blur-reveal"
          ariaLabel="Services section"
        />
      </div>

      {/* Metrics Section */}
      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Our Impact by the Numbers"
          description="Building trust through proven results. Discover how we've delivered value for our clients."
          tag="Key Achievements"
          tagIcon={Award}
          tagAnimation="slide-up"
          metrics={[
            {
              id: "1",              value: "300+",              title: "Happy Customers",              description: "Trusted by businesses worldwide",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/happy-customers-and-client-satisfaction--1772536829516-9e8b25ec.png",              imageAlt: "Happy customers"},
            {
              id: "2",              value: "500+",              title: "Successful Projects",              description: "Delivered across web and mobile",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/successful-project-delivery-visualizatio-1772536830356-9ed4b093.png",              imageAlt: "Successful projects"},
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          ariaLabel="Metrics section"
        />
      </div>

      {/* Testimonials Section */}
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwo
          title="Listen In Their Own Words"
          description="Real feedback from satisfied clients who experienced transformation with our solutions."
          tag="Testimonials"
          tagIcon={MessageSquare}
          tagAnimation="blur-reveal"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              role: "CEO, TechCorp",              testimonial:
                "Working with Kraftcode was a transformational experience for our company. Their strategic insights and meticulous planning delivered results beyond our expectations.",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-a-business-exec-1772536829249-92484298.png",              imageAlt: "Sarah Johnson"},
            {
              id: "2",              name: "Michael Chen",              role: "CTO, InnovateLab",              testimonial:
                "Exceptional team that understands both technology and business needs. They delivered a cutting-edge platform that exceeded all our requirements.",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-a-business-mana-1772536828421-9ae258e6.png",              imageAlt: "Michael Chen"},
            {
              id: "3",              name: "Emily Rodriguez",              role: "Founder, GrowthCo",              testimonial:
                "Kraftcode's expertise in web and mobile development is unmatched. They built solutions that directly contributed to our business growth.",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-an-entrepreneur-1772536829312-461ee1ff.png",              imageAlt: "Emily Rodriguez"},
            {
              id: "4",              name: "David Kim",              role: "Product Manager, StartupXYZ",              testimonial:
                "Professional, reliable, and innovative. Kraftcode delivered our project on time and within budget while maintaining exceptional code quality.",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-a-business-owne-1772536829505-ee335f31.png",              imageAlt: "David Kim"},
            {
              id: "5",              name: "Jessica Martinez",              role: "Director, Innovation Labs",              testimonial:
                "Outstanding service from start to finish. The team's attention to detail and commitment to excellence was evident in every aspect of our project.",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-a-project-manag-1772536831572-9fdcfe07.png",              imageAlt: "Jessica Martinez"},
            {
              id: "6",              name: "Robert Thompson",              role: "CEO, Digital Solutions Co",              testimonial:
                "A trusted partner for digital transformation. Kraftcode's solutions have significantly improved our operational efficiency and customer satisfaction.",              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQtbsTMeGJHQMw356WqTQ94vTH/professional-headshot-of-a-business-stra-1772536828602-df1b16dd.png",              imageAlt: "Robert Thompson"},
          ]}
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
          buttonAnimation="blur-reveal"
          ariaLabel="Testimonials section"
        />
      </div>

      {/* Social Proof Section */}
      <div id="socialproof" data-section="socialproof">
        <SocialProofOne
          title="Trusted by Leading Companies"
          description="We take immense pride in our track record of serving as a trusted consulting partner to influential companies across various industries."
          tag="Trusted Partners"
          tagIcon={CheckCircle}
          tagAnimation="blur-reveal"
          names={[
            "Microsoft",            "Google",            "Amazon",            "Apple",            "IBM",            "Netflix",            "Oracle",            "Salesforce"]}
          logos={[
            "http://img.b2bpic.net/free-vector/geometric-abstract-echos-web-design-agency-logo_1421494-124.jpg",            "http://img.b2bpic.net/free-vector/technology-logo_1071-152.jpg",            "http://img.b2bpic.net/free-vector/shiny-cyber-monday-background_23-2147718014.jpg",            "http://img.b2bpic.net/free-vector/gradient-weight-loss-logo-template_23-2150815714.jpg",            "http://img.b2bpic.net/free-vector/gradient-data-logo-template_23-2149202348.jpg",            "http://img.b2bpic.net/free-vector/gradient-n-logo-template_23-2149377854.jpg",            "http://img.b2bpic.net/free-vector/logotype_23-2148145168.jpg",            "http://img.b2bpic.net/free-vector/technology-logo-template-with-abstract-shapes_23-2148240848.jpg"]}
          textboxLayout="default"
          useInvertedBackground={false}
          speed={40}
          showCard={true}
          ariaLabel="Social proof section"
        />
      </div>

      {/* Footer */}
      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={footerColumns}
          copyrightText="© 2025 Kraftcode Infosol. All rights reserved."
          ariaLabel="Footer section"
        />
      </div>
    </ThemeProvider>
  );
};

export default HomePage;