"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
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 TeamCardOne from '@/components/sections/team/TeamCardOne';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Code, Shield, Users, TrendingUp, Clock, Award, CheckCircle, Star } from 'lucide-react';

export default function EnterprisePage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="mediumLarge"
      background="circleGradient"
      cardStyle="elevated"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple 
          navItems={[
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" }
          ]}
          brandName="NestJS"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplit
          title="Official NestJS Enterprise Support"
          description="Get expert guidance from NestJS core team members. We work alongside you to tackle ambitious projects, eliminate risks, and accelerate development with best practices."
          tag="Enterprise Partnership"
          tagIcon={Award}
          buttons={[
            { text: "Get Started", href: "contact" },
            { text: "Learn More", href: "services" }
          ]}
          imageSrc="/images/header-2.50296714-1768999801769.jpg"
          imageAlt="NestJS enterprise development team collaboration"
          imagePosition="right"
        />
      </div>

      <div id="about" data-section="about">
        <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 with NestJS best practices."
          tag="Our Mission"
          tagIcon={TrendingUp}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          bulletPoints={[
            { 
              title: "Technical Guidance", 
              description: "Architectural reviews and strategic planning",              icon: Shield
            },
            { 
              title: "Team Mentoring", 
              description: "Direct mentoring of your development team",              icon: Users
            },
            { 
              title: "Code Reviews", 
              description: "In-depth code reviews and best practices",              icon: CheckCircle
            }
          ]}
          imageSrc="/images/support.cbdb04e7-1768999801832.png"
          imageAlt="NestJS development support"
          imagePosition="left"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardOne
          title="Enterprise Services"
          description="Comprehensive range of services to empower your team and grow your business"
          tag="What We Offer"
          tagIcon={Code}
          textboxLayout="default"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          features={[
            {
              title: "Development Partnership",              description: "Achieve your goals faster with NestJS experts on your team tackling challenging issues right by your side.",              imageSrc: "/images/puzzle.a43aa4b7-1768999801720.svg",              imageAlt: "Development partnership"
            },
            {
              title: "Technical Guidance",              description: "Enable your team to get the most out of the technology. Ensure your solutions are secure and reliable.",              imageSrc: "/images/protect.5939735a-1768999801715.svg",              imageAlt: "Security and protection"
            },
            {
              title: "Migration Assistance",              description: "We provide comprehensive migration assistance, ensuring you are using the latest and greatest.",              imageSrc: "/images/conversation.2689303c-1768999801700.svg",              imageAlt: "Migration support"
            },
            {
              title: "Code Reviews",              description: "Frequent code reviews can eliminate potentially hazardous bugs and issues at an early stage while enforcing best practices.",              imageSrc: "/images/startup.b4dbf43d-1768999801700.svg",              imageAlt: "Code review process"
            },
            {
              title: "Long-term Support (LTS)",              description: "Have peace of mind with NestJS long-term support, priority fixes, upgrade assistance, and live troubleshooting.",              imageSrc: "/images/big-data.88454030-1768999801700.svg",              imageAlt: "Long-term support"
            },
            {
              title: "Team Training",              description: "Level-up your team by having expert-led NestJS trainings or workshops. Get everyone up-to-speed quickly.",              imageSrc: "/images/hired.123ab98d-1768999801700.svg",              imageAlt: "Team training"
            }
          ]}
        />
      </div>

      <div id="clients" data-section="clients">
        <TeamCardOne
          title="Trusted by Industry Leaders"
          description="NestJS is proudly powering a large ecosystem of enterprises and products worldwide"
          tag="Our Clients"
          tagIcon={Star}
          textboxLayout="default"
          gridVariant="four-items-2x2-equal-grid"
          animationType="opacity"
          useInvertedBackground="invertDefault"
          members={[
            {
              id: "1",              name: "Adidas",              role: "Global Brand",              imageSrc: "/images/adidas.718f26f2-1768999801643.svg",              imageAlt: "Adidas logo"
            },
            {
              id: "2",              name: "BMW",              role: "Automotive",              imageSrc: "/images/bmw.0ce4c05c-1768999801692.svg",              imageAlt: "BMW logo"
            },
            {
              id: "3",              name: "Red Hat",              role: "Enterprise Software",              imageSrc: "/images/red-hat.c5e6e64a-1768999801653.svg",              imageAlt: "Red Hat logo"
            },
            {
              id: "4",              name: "IBM",              role: "Technology",              imageSrc: "/images/ibm.b8c76e06-1768999801691.svg",              imageAlt: "IBM logo"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="Proven Track Record"
          description="Numbers that speak to our enterprise success and client satisfaction"
          tag="Our Impact"
          tagIcon={TrendingUp}
          textboxLayout="default"
          animationType="scale-rotate"
          useInvertedBackground="noInvert"
          metrics={[
            {
              id: "1",              icon: Users,
              title: "Enterprise Clients",              value: "500+"
            },
            {
              id: "2",              icon: Code,
              title: "Projects Delivered",              value: "1000+"
            },
            {
              id: "3",              icon: Clock,
              title: "Years of Experience",              value: "8+"
            },
            {
              id: "4",              icon: Award,
              title: "Success Rate",              value: "99%"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to achieve your most ambitious goals with NestJS? Let's partner together and take your enterprise project to the next level."
          animationType="reveal-blur"
          buttons={[
            { text: "Contact Us Today", href: "https://enterprise.nestjs.com/contact" },
            { text: "View Services", href: "services" }
          ]}
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="NestJS"
          copyrightText="© 2017-2026 Kamil Mysliwiec"
          columns={[
            {
              title: "Services",              items: [
                { label: "Development", href: "services" },
                { label: "Consulting", href: "services" },
                { label: "Training", href: "services" },
                { label: "Support", href: "services" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About", href: "about" },
                { label: "Team", href: "clients" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Documentation", href: "https://docs.nestjs.com" },
                { label: "Community", href: "https://nestjs.com" },
                { label: "Newsletter", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}