"use client";

import { ThemeProvider } from '@/components/theme/ThemeProvider';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Zap, Database, Shield, Users, Code, Rocket } from 'lucide-react';

export default function NestJSPage() {
  return (
    <ThemeProvider 
      defaultButtonVariant="hover-bubble" 
      defaultTextAnimation="entrance-slide" 
      borderRadius="rounded"
      background="aurora"
      cardStyle="glass-elevated"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="glass"
    >
      <NavbarStyleApple
        brandName="NestJS"
        navItems={[
          { name: "Documentation", id: "docs" },
          { name: "Features", id: "features" },
          { name: "Community", id: "community" },
          { name: "Blog", id: "blog" },
          { name: "Support", id: "support" }
        ]}
      />

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="A progressive Node.js framework"
          description="NestJS is a framework for building efficient, scalable Node.js web applications. It uses modern JavaScript, is built with TypeScript and combines elements of OOP, FP, and FRP."
          tag="Framework"
          tagIcon={Rocket}
          imageSrc="/images/logo-small-gradient.0ed287ce-1768915138899.svg"
          imageAlt="NestJS Logo"
          buttons={[
            { text: "Get Started", href: "https://docs.nestjs.com" },
            { text: "View on GitHub", href: "https://github.com/nestjs/nest" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardOne
          title="Why Choose NestJS?"
          description="Built with TypeScript and modern development practices in mind"
          tag="Features"
          tagIcon={Zap}
          textboxLayout="default"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          features={[
            {
              title: "TypeScript First",              description: "Built with TypeScript and supports both TypeScript and JavaScript",              imageSrc: "/images/type-safety.34453790-1768915138990.svg",              imageAlt: "TypeScript support"
            },
            {
              title: "Dependency Injection",              description: "Powerful DI system inspired by Angular for better code organization",              imageSrc: "/images/di.a0b12f44-1768915138987.svg",              imageAlt: "Dependency Injection"
            },
            {
              title: "Microservices Ready",              description: "Built-in support for microservices architecture and patterns",              imageSrc: "/images/microservices.e0074903-1768915139008.svg",              imageAlt: "Microservices"
            },
            {
              title: "Rich Ecosystem",              description: "Extensive ecosystem of modules and integrations",              imageSrc: "/images/ecosystem.eaa69289-1768915138988.svg",              imageAlt: "Ecosystem"
            }
          ]}
        />
      </div>

      <div id="community" data-section="community">
        <TestimonialCardSix
          title="Trusted by Developers Worldwide"
          description="See what the community says about NestJS"
          tag="Community"
          tagIcon={Users}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",              name: "Microsoft",              handle: "@microsoft",              testimonial: "NestJS provides a solid foundation for building enterprise applications with TypeScript.",              imageSrc: "/images/microsoft-logo.77c662a4-1768915139009.png",              imageAlt: "Microsoft"
            },
            {
              id: "2",              name: "Red Hat",              handle: "@redhat",              testimonial: "The architecture and design patterns in NestJS make it perfect for large-scale applications.",              imageSrc: "/images/red-hat-logo.17d10010-1768915139103.svg",              imageAlt: "Red Hat"
            },
            {
              id: "3",              name: "JetBrains",              handle: "@jetbrains",              testimonial: "Excellent TypeScript support and developer experience with great tooling integration.",              imageSrc: "/images/jetbrains-logo.d24f46f1-1768915139102.svg",              imageAlt: "JetBrains"
            },
            {
              id: "4",              name: "Trilon",              handle: "@trilon_io",              testimonial: "NestJS has revolutionized how we build backend services. Highly recommended!",              imageSrc: "/images/trilon.22c96544-1768915139101.svg",              imageAlt: "Trilon"
            },
            {
              id: "5",              name: "SwingDev",              handle: "@swingdev",              testimonial: "The modular architecture and dependency injection make development a breeze.",              imageSrc: "/images/swingdev-logo.168e0bec-1768915139102.svg",              imageAlt: "SwingDev"
            },
            {
              id: "6",              name: "Valor Software",              handle: "@valorSoft",              testimonial: "NestJS brings the best of both worlds - enterprise patterns with Node.js flexibility.",              imageSrc: "/images/valor-software.b334df62-1768915139158.png",              imageAlt: "Valor Software"
            }
          ]}
        />
      </div>

      <div id="blog" data-section="blog">
        <BlogCardOne
          title="Latest from the NestJS Blog"
          description="Stay updated with the latest features, tutorials, and community highlights"
          tag="Blog"
          tagIcon={Code}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          blogs={[
            {
              id: "1",              category: "Tutorial",              title: "Getting Started with NestJS",              excerpt: "Learn how to build your first NestJS application from scratch",              imageSrc: "/images/courses-box-1.e8498908-1768915139017.png",              imageAlt: "NestJS Tutorial",              authorName: "NestJS Team",              authorAvatar: "/images/logo-small-gradient.0ed287ce-1768915138899.svg",              date: "Jan 15, 2025"
            },
            {
              id: "2",              category: "Advanced",              title: "Microservices with NestJS",              excerpt: "Building scalable microservices architecture using NestJS",              imageSrc: "/images/courses-box-2.2e36a41b-1768915139006.png",              imageAlt: "Microservices Tutorial",              authorName: "NestJS Team",              authorAvatar: "/images/logo-small-gradient.0ed287ce-1768915138899.svg",              date: "Jan 10, 2025"
            },
            {
              id: "3",              category: "DevTools",              title: "NestJS DevTools Preview",              excerpt: "Explore the new developer tools for better debugging experience",              imageSrc: "/images/devtools.7a9f095a-1768915139124.png",              imageAlt: "NestJS DevTools",              authorName: "NestJS Team",              authorAvatar: "/images/logo-small-gradient.0ed287ce-1768915138899.svg",              date: "Jan 5, 2025"
            }
          ]}
        />
      </div>

      <div id="support" data-section="support">
        <FooterBase
          logoText="NestJS"
          columns={[
            {
              title: "Framework",              items: [
                { label: "Documentation", href: "https://docs.nestjs.com" },
                { label: "Getting Started", href: "https://docs.nestjs.com/first-steps" },
                { label: "Examples", href: "https://github.com/nestjs/nest/tree/master/sample" },
                { label: "CLI", href: "https://docs.nestjs.com/cli/overview" }
              ]
            },
            {
              title: "Community",              items: [
                { label: "GitHub", href: "https://github.com/nestjs/nest" },
                { label: "Discord", href: "https://discord.gg/nestjs" },
                { label: "Twitter", href: "https://twitter.com/nestframework" },
                { label: "Stack Overflow", href: "https://stackoverflow.com/questions/tagged/nestjs" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Courses", href: "https://courses.nestjs.com" },
                { label: "Blog", href: "https://trilon.io/blog" },
                { label: "Enterprise", href: "https://enterprise.nestjs.com" },
                { label: "Support", href: "https://enterprise.nestjs.com/support" }
              ]
            }
          ]}
          copyrightText="© 2025 NestJS. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}