"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroBillboardTestimonial from "@/components/sections/hero/HeroBillboardTestimonial";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import ProductCardThree from "@/components/sections/product/ProductCardThree";
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import Link from "next/link";
import { Sparkles, Lightbulb, Rocket, Award, Users, MessageSquare } from "lucide-react";

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

  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="compact"
      sizing="mediumLarge"
      background="grid"
      cardStyle="gradient-bordered"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="OakWorks Digital"
          navItems={navItems}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardTestimonial
          title="Crafting Digital Excellence for Your Business"
          description="Transform your vision into powerful web solutions. We specialize in custom development, stunning design, and scalable architecture that drives results."
          tag="Web Development Studio"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "rotated-rays-animated-grid" }}
          useInvertedBackground={false}
          buttons={[
            { text: "Get Your Free Consultation", href: "/contact" },
            { text: "View Our Work", href: "/portfolio" },
          ]}
          buttonAnimation="slide-up"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/a-modern-professional-web-development-wo-1772517081919-512502d7.png"
          imageAlt="Web development workspace"
          mediaAnimation="slide-up"
          testimonials={[
            {
              name: "Patricia Moon",              handle: "Business Owner",              testimonial: "Our new website isn't just beautiful - it's a revenue-generating machine. OakCraft's strategic approach to development is outstanding.",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-confident-wom-1772517081878-7f285fcc.png"},
            {
              name: "Robert Martinez",              handle: "VP Products",              testimonial: "The redesign OakCraft completed significantly improved our user engagement metrics. Their UX research was thorough and the implementation was flawless.",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-male-executiv-1772517081968-c66df3c1.png"},
            {
              name: "Alex Johnson",              handle: "CEO, TechStartup Co",              testimonial: "OakCraft transformed our online presence. Their attention to detail and technical expertise exceeded our expectations.",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-confident-bus-1772517081348-5d786ee9.png"},
            {
              name: "Sarah Mitchell",              handle: "Marketing Director, Growth Inc",              testimonial: "Working with OakCraft was a game-changer. They delivered a platform that's both beautiful and performs exceptionally.",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-confident-wom-1772517080889-fa28466e.png"},
          ]}
          testimonialRotationInterval={5000}
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Who We Are"
          tagIcon={Lightbulb}
          tagAnimation="slide-up"
          title="Dedicated to Building Exceptional Digital Experiences"
          description="OakWorks Digital is a team of passionate developers and designers committed to delivering innovative web solutions."
          subdescription="Est. 2018 | 50+ Projects | 12+ Team Members"
          icon={Lightbulb}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/a-diverse-team-of-web-developers-and-des-1772517082098-94ce55f4.png?_wi=1"
          imageAlt="OakWorks Digital team collaboration"
          mediaAnimation="slide-up"
          useInvertedBackground={true}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardSeven
          title="Our Services"
          description="We offer comprehensive web development and design solutions tailored to your business needs."
          tag="What We Offer"
          tagIcon={Rocket}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="blur-reveal"
          features={[
            {
              id: 1,
              title: "Custom Web Development",              description: "Full-stack web applications built with modern technologies. React, Node.js, Next.js - we use the best tools for your project.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/close-up-of-a-developer-writing-clean-mo-1772517081940-f9b2063a.png?_wi=1",              imageAlt: "Custom web development"},
            {
              id: 2,
              title: "UI/UX Design",              description: "Beautiful, intuitive interfaces that users love. We combine aesthetics with functionality to create engaging experiences.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/designer-working-on-ui-ux-design-in-figm-1772517082218-c29d6496.png?_wi=1",              imageAlt: "UI/UX design process"},
            {
              id: 3,
              title: "E-Commerce Solutions",              description: "Secure, scalable online stores that convert. Complete setup from product catalog to payment integration.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/modern-e-commerce-storefront-interface-d-1772517082364-f0573add.png?_wi=1",              imageAlt: "E-commerce platform"},
            {
              id: 4,
              title: "Performance Optimization",              description: "Lightning-fast websites that rank better and convert more. SEO optimization and technical excellence included.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/performance-analytics-dashboard-with-spe-1772517083042-0434276f.png",              imageAlt: "Performance metrics dashboard"},
          ]}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Industry Leaders"
          description="Our work has earned the confidence of companies across diverse industries."
          tag="Partners"
          tagIcon={Users}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          names={[
            "TechCorp Solutions",            "Digital Innovations Inc",            "Future Systems",            "CloudBase Technologies",            "Nexus Analytics",            "Velocity Digital",            "Forge Development",            "Prime Web Services"]}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardEleven
          title="Meet Our Team"
          description="Talented professionals passionate about creating exceptional digital solutions."
          tag="Our People"
          tagIcon={Users}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="blur-reveal"
          groups={[
            {
              id: "development",              groupTitle: "Development",              members: [
                {
                  id: "1",                  title: "Marcus Thompson",                  subtitle: "Lead Developer",                  detail: "Full-stack expert | 8+ years experience",                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-male-senior-d-1772517081797-16100617.png?_wi=1"},
                {
                  id: "2",                  title: "Jessica Liu",                  subtitle: "Frontend Specialist",                  detail: "React & Vue specialist | Creative problem solver",                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-woman-fronten-1772517081455-01fb3f91.png?_wi=1"},
                {
                  id: "3",                  title: "David Kumar",                  subtitle: "Backend Developer",                  detail: "Node.js & Python expert | Database architect",                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-male-backend--1772517081261-4bea4c21.png?_wi=1"},
              ],
            },
            {
              id: "design",              groupTitle: "Design & UX",              members: [
                {
                  id: "4",                  title: "Aurora Petrov",                  subtitle: "Design Lead",                  detail: "User-centered designer | 6+ years UX focus",                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-woman-design--1772517081775-ae51e443.png?_wi=1"},
                {
                  id: "5",                  title: "Ramon Santos",                  subtitle: "UI Designer",                  detail: "Visual storyteller | Figma specialist",                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-man-ui-design-1772517081148-c754918e.png?_wi=1"},
              ],
            },
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="What Our Clients Say"
          description="Real feedback from the businesses we've partnered with."
          tag="Client Stories"
          tagIcon={MessageSquare}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          testimonials={[
            {
              id: "1",              name: "Patricia Moon, Business Owner",              date: "Date: 05 June 2024",              title: "Worth every penny invested",              quote: "Our new website isn't just beautiful - it's a revenue-generating machine. OakCraft's strategic approach to development is outstanding.",              tag: "SMB",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-confident-wom-1772517081878-7f285fcc.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/small-business-owner-in-modern-retail-or-1772517082303-4a0e0b0d.png"},
            {
              id: "2",              name: "Robert Martinez, VP Products",              date: "Date: 08 September 2024",              title: "Transformed our user experience overnight",              quote: "The redesign OakCraft completed significantly improved our user engagement metrics. Their UX research was thorough and the implementation was flawless.",              tag: "SaaS",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-male-executiv-1772517081968-c66df3c1.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/product-vp-in-saas-office-environment-pr-1772517081600-daab3a39.png"},
            {
              id: "3",              name: "James Wilson, CEO of GrowthTech",              date: "Date: 15 November 2024",              title: "Best investment in our digital transformation",              quote: "OakCraft didn't just build us a website - they built us a complete digital ecosystem. The attention to detail, performance optimization, and ongoing support have been exceptional.",              tag: "Enterprise",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-mature-male-c-1772517080744-37c1d7a8.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/dynamic-image-of-a-ceo-in-a-modern-tech--1772517082479-327f2998.png"},
            {
              id: "4",              name: "Lisa Chen, Founder of CreativeFlow",              date: "Date: 22 October 2024",              title: "Exceeded every expectation we had",              quote: "From initial consultation to launch and beyond, OakCraft demonstrated professionalism and technical excellence. Our platform now handles 10x more traffic than expected.",              tag: "Startup",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-confident-asi-1772517082687-eee62225.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/founder-in-creative-startup-environment--1772517082119-58a33299.png"},
            {
              id: "5",              name: "Sophie Laurent, Marketing Director",              date: "Date: 19 August 2024",              title: "Partners who genuinely care about your success",              quote: "OakCraft became an extension of our team. They understood our business challenges and provided solutions that actually moved the needle.",              tag: "Mid-Market",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-confident-wom-1772517080933-46f253d0.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/marketing-director-collaborating-with-te-1772517082779-b19c689d.png"},
            {
              id: "6",              name: "Thomas Anderson, Operations Lead",              date: "Date: 12 July 2024",              title: "Technical excellence meets exceptional service",              quote: "Building with OakCraft was smooth from start to finish. They managed complexity beautifully and delivered on time, every time.",              tag: "Enterprise",              avatarSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/professional-headshot-of-a-mature-male-o-1772517082162-80679a7c.png",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQFg8RdJJCfHIKkdKyz1yrAP8o/operations-manager-overseeing-enterprise-1772517085377-e0e02944.png"},
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="OakWorks Digital"
          leftLink={{ text: "Privacy Policy", href: "#" }}
          rightLink={{ text: "Terms of Service", href: "#" }}
        />
      </div>
    </ThemeProvider>
  );
}

import TeamCardEleven from "@/components/sections/team/TeamCardEleven";
