"use client"

import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBase from '@/components/sections/footer/FooterBase';

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";

import { Sparkles, Code, Shield, Users, Zap, Heart, Star, Coffee, CheckCircle, ArrowRight } from 'lucide-react';

export default function EnterprisePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="largeSmall"
      background="circleGradient"
      cardStyle="gradient-mesh"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          navItems={[
            { name: "Support", id: "support" },
            { name: "Services", id: "services" },
            { name: "Enterprise", id: "enterprise" },
            { name: "Contact", id: "contact" }
          ]}
          brandName="NestJS"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplit
          title="Enterprise NestJS Support"
          description="Official support from NestJS core team members to eliminate project risk and tackle your most ambitious projects - right by your side."
          tag="Official Support"
          tagIcon={Star}
          imagePosition="right"
          imageSrc="/images/support.cbdb04e7-1768999835191.png"
          imageAlt="NestJS enterprise support illustration"
          buttons={[
            { text: "Get in touch", href: "contact" },
            { text: "Read more", href: "services" }
          ]}
        />
      </div>

      <div id="support" data-section="support">
        <SplitAbout
          title="Accelerate your development"
          description="We work alongside you to meet your deadlines while avoiding costly tech debt. Our goal is to help you get to market faster."
          tag="Expert Guidance"
          tagIcon={Zap}
          bulletPoints={[
            {
              title: "Technical Guidance",              description: "Architectural reviews and best practices from Nest core team members",              icon: Code
            },
            {
              title: "Team Mentoring",              description: "Direct mentoring and skill development for your development team",              icon: Users
            },
            {
              title: "Security & Performance",              description: "Address security concerns and performance optimization",              icon: Shield
            }
          ]}
          imageSrc="/images/header-2.50296714-1768999834818.jpg"
          imageAlt="Enterprise development team collaboration"
          imagePosition="right"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "Contact us", href: "contact" }
          ]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardOne
          title="How can we help you be successful?"
          description="Nest Enterprise Consulting includes a broad range of services to empower your team."
          tag="Enterprise Services"
          tagIcon={Sparkles}
          features={[
            {
              title: "Development",              description: "Achieve your goals faster with Nest experts on your team tackling challenging issues right by your side.",              imageSrc: "/images/startup.b4dbf43d-1768999834615.svg",              imageAlt: "Development services"
            },
            {
              title: "Technical Guidance",              description: "Enable your team to get the most out of the technology. Ensure your solutions are secure and reliable.",              imageSrc: "/images/conversation.2689303c-1768999834614.svg",              imageAlt: "Technical guidance"
            },
            {
              title: "Migration Assistance",              description: "We provide comprehensive migration assistance, ensuring you are using the latest and greatest.",              imageSrc: "/images/puzzle.a43aa4b7-1768999834619.svg",              imageAlt: "Migration assistance"
            },
            {
              title: "Code Reviews",              description: "Frequent code reviews can eliminate potentially hazardous bugs and issues at an early stage.",              imageSrc: "/images/big-data.88454030-1768999834619.svg",              imageAlt: "Code reviews"
            },
            {
              title: "Long-term Support",              description: "Have peace of mind with Nest long-term support, priority fixes, and upgrade assistance.",              imageSrc: "/images/protect.5939735a-1768999834619.svg",              imageAlt: "Long-term support"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Who is using Nest?"
          description="Nest is proudly powering a large ecosystem of enterprises and products out there."
          tag="Trusted By"
          tagIcon={Heart}
          metrics={[
            {
              id: "1",              value: "500K+",              title: "Developers",              description: "Active developers using NestJS worldwide",              imageSrc: "/images/gitlab.4f9d2995-1768999834528.png",              imageAlt: "GitLab logo"
            },
            {
              id: "2",              value: "50+",              title: "Enterprise Clients",              description: "Fortune 500 companies trust NestJS",              imageSrc: "/images/adidas.718f26f2-1768999834539.svg",              imageAlt: "Adidas logo"
            },
            {
              id: "3",              value: "1M+",              title: "Downloads",              description: "Monthly npm downloads and growing",              imageSrc: "/images/ibm.b8c76e06-1768999834594.svg",              imageAlt: "IBM logo"
            },
            {
              id: "4",              value: "99.9%",              title: "Uptime",              description: "Enterprise-grade reliability and performance",              imageSrc: "/images/mercedes.ee8047a9-1768999834576.png",              imageAlt: "Mercedes logo"
            }
          ]}
          animationType="opacity"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="enterprise" data-section="enterprise">
        <PricingCardFive
          title="Enterprise Services Pricing"
          description="Choose the plan that fits your development needs and timeline."
          tag="Flexible Plans"
          tagIcon={CheckCircle}
          plans={[
            {
              id: "consulting",              tag: "Consulting Package",              tagIcon: Code,
              price: "$5,000",              period: "/month",              description: "Get expert guidance and architectural reviews for your NestJS projects.",              button: {
                text: "Get Started",                href: "contact"
              },
              featuresTitle: "What's Included:",              features: [
                "Weekly 1-on-1 sessions with core team",                "Code review and architectural guidance",                "Priority email support",                "Best practices documentation"
              ]
            },
            {
              id: "development",              tag: "Development Partnership",              tagIcon: Users,
              price: "$15,000",              period: "/month",              description: "Direct development support with NestJS experts working alongside your team.",              button: {
                text: "Contact Sales",                href: "contact"
              },
              featuresTitle: "What's Included:",              features: [
                "Dedicated developer from core team",                "Daily standups and collaboration",                "Custom feature development",                "Migration and upgrade assistance",                "24/7 priority support"
              ]
            }
          ]}
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="What Our Clients Say"
          description="Hear from enterprise teams who've experienced our expert support."
          tag="Client Success"
          tagIcon={Coffee}
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              handle: "@sarahj_tech",              testimonial: "The NestJS team helped us scale our application to handle millions of requests. Their expertise is unmatched."
            },
            {
              id: "2",              name: "Michael Chen",              handle: "@mchen_dev",              testimonial: "Working with the core team accelerated our development by months. The architectural guidance was invaluable."
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "@emilyrod",              testimonial: "The migration support from NestJS Enterprise was seamless. They handled everything while we focused on features."
            },
            {
              id: "4",              name: "David Kim",              handle: "@davidkim_cto",              testimonial: "Best investment we made for our Node.js infrastructure. The performance improvements were immediate."
            },
            {
              id: "5",              name: "Lisa Parker",              handle: "@lisap_eng",              testimonial: "The code reviews and mentoring transformed our development practices. Our team is now much more confident."
            },
            {
              id: "6",              name: "Alex Thompson",              handle: "@alexthompson",              testimonial: "24/7 support when we needed it most. The NestJS enterprise team is truly dedicated to client success."
            },
            {
              id: "7",              name: "Maria Garcia",              handle: "@mariagarcia",              testimonial: "The technical guidance helped us avoid costly mistakes and implement best practices from day one."
            },
            {
              id: "8",              name: "James Wilson",              handle: "@jameswilson",              testimonial: "Exceptional expertise and professionalism. The NestJS team became an extension of our development team."
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          speed={30}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Let's achieve your most ambitious goals - together"
          description="Contact us today to explore enterprise services and get your project to the next level."
          inputs={[
            {
              name: "name",              type: "text",              placeholder: "Your name",              required: true
            },
            {
              name: "email",              type: "email",              placeholder: "Your email",              required: true
            },
            {
              name: "company",              type: "text",              placeholder: "Company name",              required: true
            },
            {
              name: "phone",              type: "tel",              placeholder: "Phone number"
            }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your project and requirements...",            rows: 6,
            required: true
          }}
          buttonText="Contact us"
          mediaPosition="right"
          imageSrc="/images/conversation.2689303c-1768999834614.svg"
          imageAlt="Contact us illustration"
          useInvertedBackground="noInvert"
          onSubmit={(data) => console.log('Form submitted:', data)}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="NestJS"
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "https://nestjs.com" },
                { label: "Documentation", href: "https://docs.nestjs.com" },
                { label: "Community", href: "https://github.com/nestjs" },
                { label: "Enterprise", href: "enterprise" }
              ]
            },
            {
              title: "Services",              items: [
                { label: "Consulting", href: "services" },
                { label: "Development", href: "services" },
                { label: "Migration", href: "services" },
                { label: "Support", href: "support" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About", href: "https://trilon.io" },
                { label: "Blog", href: "https://trilon.io/blog" },
                { label: "Careers", href: "https://trilon.io/careers" },
                { label: "Contact", href: "contact" }
              ]
            }
          ]}
          copyrightText="© 2017-2025 Kamil Mysliwiec"
          onPrivacyClick={() => console.log('Privacy policy clicked')}
        />
      </div>
    </ThemeProvider>
  );
}
