import { Navigation } from "../components/Navigation";
import { Footer } from "../components/Footer";
import { HireTalentHeroBanner } from "../components/HireTalentHeroBanner";
import { FAQSection } from "../components/FAQSection";
import { AppSuccessMetrics } from "../components/AppSuccessMetrics";
import { StepsIllustrated } from "../components/StepsIllustrated";
import { CarouselTestimonials } from "../components/CarouselTestimonials";
import { ResourceCards } from "../components/ResourceCards";
import { SplitCallToAction } from "../components/SplitCallToAction";
import { TeamCollaborationVector } from "../components/vectors/TeamCollaborationVector";
import { Link, Users, Code, CheckCircle, Star, Award, Clock, TrendingUp } from "lucide-react";

const hireThirdPartyIntegrationsDevelopersData = {
  heroBanner: {
    category: "Hire Expert Developers",
    title: "Hire Third-Party Integrations Developers",
    description: "Connect your systems seamlessly with expert integration developers. Streamline workflows, automate data exchange, and enhance functionality through robust third-party API integrations and middleware solutions.",
    primaryCTA: {
      text: "Hire Integration Experts",
      href: "/contact-us",
      icon: Link
    },
    secondaryCTA: {
      text: "View Developer Profiles",
      href: "/hire-talent",
      icon: Users
    }
  },
  
  // Third-Party Integrations specific metrics
  metrics: [
    {
      value: "500+",
      label: "API Integrations",
      description: "Successful third-party connections"
    },
    {
      value: "99.5%",
      label: "Integration Uptime",
      description: "Reliable data synchronization"
    },
    {
      value: "50+",
      label: "Platform Integrations",
      description: "Different systems connected"
    },
    {
      value: "Real-time",
      label: "Data Sync",
      description: "Live data synchronization"
    }
  ],

  // Third-Party Integrations development process
  process: {
    title: "Our Third-Party Integration Process",
    subtitle: "From API analysis to seamless system connectivity",
    steps: [
      {
        number: "01",
        title: "Integration Planning & Analysis",
        description: "Analyze your systems and third-party requirements to design optimal integration architecture and data flow strategies.",
        icon: <Link className="w-8 h-8" />,
        details: [
          "System architecture and API analysis",
          "Integration requirements gathering",
          "Data mapping and transformation planning",
          "Security and authentication strategy design"
        ]
      },
      {
        number: "02", 
        title: "API Development & Implementation",
        description: "Build robust APIs and integration layers that connect your systems with third-party services efficiently and securely.",
        icon: <Code className="w-8 h-8" />,
        details: [
          "Custom API development and middleware",
          "Third-party API integration and mapping",
          "Data transformation and validation logic",
          "Authentication and security implementation"
        ]
      },
      {
        number: "03",
        title: "Testing & Validation",
        description: "Comprehensive testing of integrations including data flow, error handling, and performance under various conditions.",
        icon: <CheckCircle className="w-8 h-8" />,
        details: [
          "Integration testing and validation",
          "Error handling and fallback mechanisms",
          "Performance and load testing",
          "Security and data integrity verification"
        ]
      },
      {
        number: "04",
        title: "Deployment & Monitoring",
        description: "Deploy integrations with monitoring systems to ensure continuous data flow and proactive issue detection.",
        icon: <TrendingUp className="w-8 h-8" />,
        details: [
          "Production deployment and configuration",
          "Real-time monitoring and alerting setup",
          "Performance optimization and scaling",
          "Ongoing maintenance and support"
        ]
      }
    ]
  },

  // Third-Party Integrations focused FAQs
  faqs: [
    {
      question: "What types of third-party integrations can you implement?",
      answer: "We implement various integrations including payment gateways (Stripe, PayPal), CRM systems (Salesforce, HubSpot), ERP platforms, social media APIs, marketing automation tools, analytics platforms, communication APIs, and custom business applications."
    },
    {
      question: "How do you ensure data security in third-party integrations?",
      answer: "We implement robust security measures including OAuth 2.0, API key management, data encryption in transit and at rest, secure webhooks, rate limiting, and compliance with data protection regulations like GDPR and CCPA."
    },
    {
      question: "Can you integrate with legacy systems and modern APIs?",
      answer: "Yes, we have expertise in both legacy system integration using protocols like SOAP, XML-RPC, and file-based transfers, as well as modern REST APIs, GraphQL, and real-time integrations using WebSockets and webhooks."
    },
    {
      question: "How do you handle API rate limits and failures?",
      answer: "We implement retry mechanisms, exponential backoff strategies, request queuing, caching for frequently accessed data, circuit breakers for failed services, and graceful degradation to ensure system reliability."
    },
    {
      question: "What integration platforms and tools do you use?",
      answer: "We work with integration platforms like Zapier, MuleSoft, Azure Logic Apps, AWS API Gateway, Postman, and custom middleware solutions. We also use tools like Apache Kafka for real-time data streaming and message queues for reliable processing."
    },
    {
      question: "How do you monitor and maintain third-party integrations?",
      answer: "We implement comprehensive monitoring using tools like API monitoring dashboards, error tracking, performance metrics, webhook reliability checks, and automated alerts for integration failures or performance degradation."
    }
  ]
};

export function HireThirdPartyIntegrationsDevelopers() {
  return (
    <div className="dark min-h-screen bg-background">
      {/* <Navigation /> */}
      
      {/* Hero Section with TeamCollaborationVector */}
      <HireTalentHeroBanner
        vectorComponent={TeamCollaborationVector}
        category={hireThirdPartyIntegrationsDevelopersData.heroBanner.category}
        title={hireThirdPartyIntegrationsDevelopersData.heroBanner.title}
        description={hireThirdPartyIntegrationsDevelopersData.heroBanner.description}
        primaryCTA={hireThirdPartyIntegrationsDevelopersData.heroBanner.primaryCTA}
        secondaryCTA={hireThirdPartyIntegrationsDevelopersData.heroBanner.secondaryCTA}
      />

      {/* Success Metrics */}
      {/* <section>
        <AppSuccessMetrics metrics={hireThirdPartyIntegrationsDevelopersData.metrics} />
      </section> */}

      {/* Development Process */}
      <section>
        <StepsIllustrated 
          title={hireThirdPartyIntegrationsDevelopersData.process.title}
          subtitle={hireThirdPartyIntegrationsDevelopersData.process.subtitle}
          steps={hireThirdPartyIntegrationsDevelopersData.process.steps}
        />
      </section>

      {/* Client Testimonials */}
      <section>
        <CarouselTestimonials />
      </section>

      {/* FAQ Section */}
      <section>
        <FAQSection 
          title="Third-Party Integrations FAQs"
          subtitle="Everything you need to know about hiring third-party integration developers"
          faqs={hireThirdPartyIntegrationsDevelopersData.faqs}
        />
      </section>

      {/* Resources */}
      <section>
        <ResourceCards />
      </section>

      {/* Call to Action */}
      <section>
        <SplitCallToAction />
      </section>

      {/* <Footer /> */}
    </div>
  );
}