"use client"

import { ThemeProvider } from '@/components/ui/ThemeProvider'
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple'
import HeroBillboard from '@/components/sections/hero/HeroBillboard'
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne'
import AboutMetric from '@/components/sections/about/AboutMetric'
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve'
import BlogCardOne from '@/components/sections/blog/BlogCardOne'
import ContactCenter from '@/components/sections/contact/ContactCenter'
import FooterBase from '@/components/sections/footer/FooterBase'
import { Building2, Users, Code, Globe, Sparkles, TrendingUp, ShoppingCart, Zap } from 'lucide-react'

export default function NestJSPage() {
  return (
    <ThemeProvider 
      defaultButtonVariant="text-stagger" 
      defaultTextAnimation="entrance-slide" 
      borderRadius="rounded" 
      background="aurora" 
      cardStyle="glass-elevated" 
      primaryButtonStyle="gradient" 
      secondaryButtonStyle="glass"
    >
      <NavbarStyleApple
        brandName="NestJS"
        navItems={[
          { name: 'Documentation', id: 'documentation' },
          { name: 'Support', id: 'support' },
          { name: 'Enterprise', id: 'enterprise' },
          { name: 'Courses', id: 'courses' },
          { name: 'Discover', id: 'discover' }
        ]}
      />
      
      <div id="hero" data-section="hero">
        <HeroBillboard
          title="A progressive Node.js framework"
          description="NestJS is a framework for building efficient, scalable Node.js server-side applications. It uses progressive JavaScript, is built with TypeScript and combines elements of OOP, FP, and FRP."
          tag="Progressive Framework"
          imageSrc="/images/header.e5c9eff6-1768922368786.webp"
          imageAlt="NestJS Framework"
          buttons={[
            { text: 'Get Started', href: 'https://docs.nestjs.com' },
            { text: 'Learn More', href: 'documentation' }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardOne
          title="Why choose NestJS?"
          description="Discover the powerful features that make NestJS the preferred choice for enterprise applications"
          tag="Features"
          tagIcon={Sparkles}
          textboxLayout="default"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          features={[
            {
              title: "TypeScript Support",              description: "Built with TypeScript from the ground up for better code quality and developer experience",              imageSrc: "/images/type-safety.34453790-1768922368129.svg",              imageAlt: "TypeScript Support"
            },
            {
              title: "Microservices Ready",              description: "Create distributed systems with built-in microservices support and communication patterns",              imageSrc: "/images/microservices.e0074903-1768922368094.svg",              imageAlt: "Microservices Architecture"
            },
            {
              title: "Dependency Injection",              description: "Powerful dependency injection system inspired by Angular for better code organization",              imageSrc: "/images/di.a0b12f44-1768922368113.svg",              imageAlt: "Dependency Injection"
            },
            {
              title: "Rich Ecosystem",              description: "Extensive collection of modules and integrations for databases, authentication, and more",              imageSrc: "/images/ecosystem.eaa69289-1768922368108.svg",              imageAlt: "Rich Ecosystem"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <AboutMetric
          title="Trusted by developers and enterprises worldwide for building scalable applications"
          useInvertedBackground="noInvert"
          metrics={[
            { icon: TrendingUp, label: 'GitHub Stars', value: '68K+' },
            { icon: Users, label: 'Community Members', value: '200K+' },
            { icon: Building2, label: 'Enterprise Clients', value: '500+' },
            { icon: Code, label: 'npm Downloads', value: '3M+' }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          cardTitle="Trusted by leading companies and thousands of developers worldwide"
          cardTag="Community"
          cardTagIcon={Globe}
          useInvertedBackground="noInvert"
          testimonials={[
            { id: '1', name: 'Microsoft', imageSrc: '/images/microsoft-logo.77c662a4-1768922368122.png' },
            { id: '2', name: 'Red Hat', imageSrc: '/images/red-hat-logo.17d10010-1768922368180.svg' },
            { id: '3', name: 'Mercedes', imageSrc: '/images/mercedes-logo.191e30c5-1768922368350.png' },
            { id: '4', name: 'JetBrains', imageSrc: '/images/jetbrains-logo.d24f46f1-1768922368208.svg' },
            { id: '5', name: 'Sanofi', imageSrc: '/images/sanofi.d67c6a70-1768922368262.png' },
            { id: '6', name: 'Netlify', imageSrc: '/images/netlify-logo.9322c2d1-1768922368283.svg' }
          ]}
        />
      </div>

      <div id="courses" data-section="courses">
        <BlogCardOne
          title="Learn NestJS"
          description="Comprehensive courses and resources to master NestJS development"
          tag="Education"
          tagIcon={Zap}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          blogs={[
            {
              id: '1',
              category: 'Course',
              title: 'NestJS Fundamentals',
              excerpt: 'Learn the core concepts and building blocks of NestJS framework',
              imageSrc: '/images/courses-box-1.e8498908-1768922368131.png',
              imageAlt: 'NestJS Fundamentals Course',
              authorName: 'NestJS Team',
              authorAvatar: '/images/logo-small-gradient.0ed287ce-1768922368007.svg',
              date: '2024'
            },
            {
              id: '2',
              category: 'Advanced',
              title: 'Microservices with NestJS',
              excerpt: 'Build scalable microservices architectures with NestJS',
              imageSrc: '/images/courses-box-2.2e36a41b-1768922368127.png',
              imageAlt: 'Microservices Course',
              authorName: 'NestJS Team',
              authorAvatar: '/images/logo-small-gradient.0ed287ce-1768922368007.svg',
              date: '2024'
            },
            {
              id: '3',
              category: 'Tutorial',
              title: 'Complete NestJS Guide',
              excerpt: 'From beginner to advanced NestJS development techniques',
              imageSrc: '/images/courses.aee168f4-1768922368172.png',
              imageAlt: 'Complete NestJS Guide',
              authorName: 'Community',
              authorAvatar: '/images/logo-small-gradient.0ed287ce-1768922368007.svg',
              date: '2024'
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Get Started"
          tagIcon={Code}
          title="Ready to build amazing applications?"
          description="Join thousands of developers who trust NestJS for their server-side applications. Get started with our comprehensive documentation and community support."
          useInvertedBackground="noInvert"
          buttonText="Subscribe"
          inputPlaceholder="Enter your email"
          termsText="By subscribing you agree to receive updates about NestJS developments and community news."
        />
      </div>

      <FooterBase
        logoText="NestJS"
        copyrightText="© 2025 NestJS. MIT Licensed."
        columns={[
          {
            title: 'Documentation',
            items: [
              { label: 'Getting Started', href: 'https://docs.nestjs.com' },
              { label: 'Techniques', href: 'https://docs.nestjs.com/techniques' },
              { label: 'Recipes', href: 'https://docs.nestjs.com/recipes' },
              { label: 'FAQ', href: 'https://docs.nestjs.com/faq' }
            ]
          },
          {
            title: 'Community',
            items: [
              { label: 'Discord', href: 'https://discord.gg/nestjs' },
              { label: 'GitHub', href: 'https://github.com/nestjs/nest' },
              { label: 'Twitter', href: 'https://twitter.com/nestframework' },
              { label: 'Support', href: 'https://opencollective.com/nest' }
            ]
          },
          {
            title: 'Enterprise',
            items: [
              { label: 'Consulting', href: 'https://enterprise.nestjs.com' },
              { label: 'Training', href: 'https://courses.nestjs.com' },
              { label: 'Devtools', href: 'https://devtools.nestjs.com' },
              { label: 'Jobs', href: 'https://jobs.nestjs.com' }
            ]
          }
        ]}
      />
    </ThemeProvider>
  )
}