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 { TechStackVisualization } from "../components/vectors/TechStackVisualization";
import { Smartphone, Users, Code, CheckCircle, Star, Award, Clock, TrendingUp } from "lucide-react";

const hireWearableAppDevelopersData = {
  heroBanner: {
    category: "Hire Expert Developers",
    title: "Hire Wearable App Developers",
    description: "Get access to specialized wearable app developers for Apple Watch, Android Wear, and IoT devices. Build innovative wearable experiences that extend your digital ecosystem.",
    primaryCTA: {
      text: "Hire Wearable Developers",
      href: "/contact-us",
      icon: Smartphone
    },
    secondaryCTA: {
      text: "View Developer Profiles",
      href: "/hire-talent",
      icon: Users
    }
  },
  
  // Wearable-specific metrics
  metrics: [
    {
      value: "45+",
      label: "Wearable Apps Built",
      description: "Apple Watch & Android Wear"
    },
    {
      value: "85%",
      label: "User Engagement Rate",
      description: "Daily active usage"
    },
    {
      value: "2M+",
      label: "Wearable Installations",
      description: "Across all platforms"
    },
    {
      value: "95%",
      label: "Battery Optimization",
      description: "Efficient power consumption"
    }
  ],

  // Wearable development process
  process: {
    title: "Our Wearable Development Process",
    subtitle: "Smart devices, smarter experiences",
    steps: [
      {
        number: "01",
        title: "Wearable Strategy & UX Design",
        description: "Define wearable-specific features, micro-interactions, and user experience optimized for small screens.",
        icon: <Smartphone className="w-8 h-8" />,
        details: [
          "Wearable UX patterns analysis",
          "Micro-interaction design", 
          "Platform capability assessment",
          "Battery optimization planning"
        ]
      },
      {
        number: "02", 
        title: "Platform-Specific Development",
        description: "Create wearable apps using platform-specific SDKs and following wearable design guidelines.",
        icon: <Code className="w-8 h-8" />,
        details: [
          "Apple Watch WatchOS development",
          "Android Wear OS implementation",
          "Companion app integration",
          "Sensor data processing"
        ]
      },
      {
        number: "03",
        title: "Performance & Battery Optimization",
        description: "Optimize for wearable constraints including battery life, processing power, and memory limitations.",
        icon: <CheckCircle className="w-8 h-8" />,
        details: [
          "Power consumption optimization",
          "Background processing efficiency",
          "Data synchronization strategies",
          "Memory management"
        ]
      },
      {
        number: "04",
        title: "Testing & Deployment",
        description: "Comprehensive testing on real devices and deployment to wearable app stores and distribution platforms.",
        icon: <TrendingUp className="w-8 h-8" />,
        details: [
          "Multi-device testing",
          "Wearable store submission",
          "Companion app coordination", 
          "Analytics implementation"
        ]
      }
    ]
  },

  // Wearable-focused FAQs
  faqs: [
    {
      question: "What wearable platforms do your developers support?",
      answer: "Our developers specialize in Apple Watch (WatchOS), Android Wear OS, Samsung Galaxy Watch, Fitbit OS, and custom IoT wearable devices. We also develop companion mobile apps for seamless integration with smartphones."
    },
    {
      question: "How do you optimize wearable apps for battery life?",
      answer: "We implement battery optimization techniques including efficient background processing, smart data synchronization, optimized sensor usage, reduced CPU-intensive operations, and intelligent update scheduling to maximize battery life on wearable devices."
    },
    {
      question: "Can wearable apps work independently without a smartphone?",
      answer: "Yes, we develop both standalone wearable apps with cellular/WiFi connectivity and companion apps that sync with smartphones. The approach depends on device capabilities and your specific use case requirements."
    },
    {
      question: "What types of wearable applications do you develop?",
      answer: "We develop fitness tracking apps, health monitoring solutions, productivity tools, communication apps, payment applications, navigation aids, entertainment apps, and enterprise wearable solutions for various industries."
    },
    {
      question: "How do you handle data synchronization between wearables and mobile apps?",
      answer: "We implement efficient sync strategies using background syncing, delta updates, conflict resolution, offline capability, and optimized data transfer protocols to ensure seamless data flow between wearable and companion apps."
    },
    {
      question: "What sensors and hardware features can wearable apps access?",
      answer: "Wearable apps can access heart rate monitors, accelerometers, gyroscopes, GPS, microphones, speakers, haptic feedback, digital crown, force touch, NFC, and various health sensors depending on the device capabilities."
    }
  ]
};

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

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

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

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

      {/* FAQ Section */}
      <section>
        <FAQSection 
          title="Wearable Development FAQs"
          subtitle="Everything you need to know about hiring wearable app developers"
          faqs={hireWearableAppDevelopersData.faqs}
        />
      </section>

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

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

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