import { useEffect, useState } from "react";
import { CarouselTestimonials } from "./components/CarouselTestimonials";
import { CaseStudyHighlight } from "./components/CaseStudyHighlight";
import { ClientLogos } from "./components/ClientLogos";
import { Footer } from "./components/Footer";
import { HeroSection } from "./components/HeroSection";
import { HorizontalTagScroller } from "./components/HorizontalTagScroller";
import { InlineCTA } from "./components/InlineCTA";
import { Navigation } from "./components/Navigation";
import { ProcessSection } from "./components/ProcessSection";
import { ResourceCards } from "./components/ResourceCards";
import { SplitCallToAction } from "./components/SplitCallToAction";
import { Button } from "./components/ui/button";
import { WhyChooseWDI } from "./components/WhyChooseWDI";

// Main Category Pages
import { ArtificialIntelligenceServices } from "./pages/ArtificialIntelligenceServices";
import { ContactMain } from "./pages/ContactMain";
import { DesignExperience } from "./pages/DesignExperience";
import { Industries } from "./pages/Industries";
import { MachineLearning } from "./pages/MachineLearning";
import { Resources } from "./pages/Resources";
import { Services } from "./pages/Services";
import { SoftwareEngineering } from "./pages/SoftwareEngineering";
import { Solutions } from "./pages/Solutions";
import { WebCloudServices } from "./pages/WebCloudServices";

// Service Pages
import { AdminPanelsDashboards } from "./pages/AdminPanelsDashboards";
import { AIAutomationWorkflows } from "./pages/AIAutomationWorkflows";
import { AIChatbotsVirtualAssistants } from "./pages/AIChatbotsVirtualAssistants";
import { AIIntegrationDigitalProducts } from "./pages/AIIntegrationDigitalProducts";
import { AIModelDeploymentMLOps } from "./pages/AIModelDeploymentMLOps";
import { AIStrategyConsulting } from "./pages/AIStrategyConsulting";
import { AndroidAppDevelopment } from "./pages/AndroidAppDevelopment";
import { APIBackendDevelopment } from "./pages/APIBackendDevelopment";
import { ClickablePrototypes } from "./pages/ClickablePrototypes";
import { ComputerVisionApplications } from "./pages/ComputerVisionApplications";
import { CrossPlatformAppDevelopment } from "./pages/CrossPlatformAppDevelopment";
import { CustomMLModelDevelopment } from "./pages/CustomMLModelDevelopment";
import { CustomWebAppDevelopment } from "./pages/CustomWebAppDevelopment";
import { DesignThinkingWorkshops } from "./pages/DesignThinkingWorkshops";
import { EcommercePlatforms } from "./pages/EcommercePlatforms";
import { EnterpriseSoftwareSolutions } from "./pages/EnterpriseSoftwareSolutions";
import { GenAIIntegrationDigitalProducts } from "./pages/GenAIIntegrationDigitalProducts";
import { IOSAppDevelopment } from "./pages/iOSAppDevelopment";
import { MobileAppDevelopment } from "./pages/MobileAppDevelopment";
import { NativeAppDevelopment } from "./pages/NativeAppDevelopment";
import { NLPTextAnalytics } from "./pages/NLPTextAnalytics";
import { PredictiveAnalyticsForecasting } from "./pages/PredictiveAnalyticsForecasting";
import { ProductModernization } from "./pages/ProductModernization";
import { PWADevelopment } from "./pages/PWADevelopment";
import { RecommendationEngines } from "./pages/RecommendationEngines";
import { SaaSProductEngineering } from "./pages/SaaSProductEngineering";
import { SystemArchitectureDevOps } from "./pages/SystemArchitectureDevOps";
import { ThirdPartyIntegrations } from "./pages/ThirdPartyIntegrations";
import { UIUXDesign } from "./pages/UIUXDesign";
import { UserResearchTesting } from "./pages/UserResearchTesting";
import { WearableDeviceDevelopment } from "./pages/WearableDeviceDevelopment";

// Solution Pages
import { BusinessProcessAutomation } from "./pages/BusinessProcessAutomation";
import { ComplianceReadySystems } from "./pages/ComplianceReadySystems";
import { DedicatedOffshoreODC } from "./pages/DedicatedOffshoreODC";
import { DigitalProductDevelopment } from "./pages/DigitalProductDevelopment";
import { LegacySystemRebuilds } from "./pages/LegacySystemRebuilds";
import { MVPStartupLaunchPackages } from "./pages/MVPStartupLaunchPackages";

// Industry Pages - Financial Services
import { FinTechBankingApps } from "./pages/FinTechBankingApps";
import { RealEstateTech } from "./pages/RealEstateTech";
import { WealthTechPlatforms } from "./pages/WealthTechPlatforms";

// Industry Pages - Healthcare & Wellness
import { FitnessWellnessPlatforms } from "./pages/FitnessWellnessPlatforms";
import { HealthTechApplications } from "./pages/HealthTechApplications";
import { MedicalComplianceSolutions } from "./pages/MedicalComplianceSolutions";

// Industry Pages - Learning & Education
import { EdTechPlatforms } from "./pages/EdTechPlatforms";
import { MicrolearningApps } from "./pages/MicrolearningApps";
import { VirtualClassroomsLMS } from "./pages/VirtualClassroomsLMS";

// Industry Pages - Commerce & Consumer
import { EcommerceMarketplaces } from "./pages/EcommerceMarketplaces";
import { EventTicketingSolutions } from "./pages/EventTicketingSolutions";
import { FoodOrderingDelivery } from "./pages/FoodOrderingDelivery";
import { TravelBookingSystems } from "./pages/TravelBookingSystems";

// Industry Pages - Media & Community
import { OTTStreamingApps } from "./pages/OTTStreamingApps";
import { SocialPlatformsNetworks } from "./pages/SocialPlatformsNetworks";
import { SportsFanEngagement } from "./pages/SportsFanEngagement";

// Industry Pages - Mobility & Logistics
import { OnDemandServices } from "./pages/OnDemandServices";
import { SupplyChainFleetManagement } from "./pages/SupplyChainFleetManagement";
import { TransportationApps } from "./pages/TransportationApps";

// Industry Pages - Industrial & Emerging Tech
import { AgriTechPlatforms } from "./pages/AgriTechPlatforms";
import { ManufacturingAutomation } from "./pages/ManufacturingAutomation";
import { OilGasMonitoringSystems } from "./pages/OilGasMonitoringSystems";

// Company Pages
import { AboutWDI } from "./pages/AboutWDI";
import { AwardsCertifications } from "./pages/AwardsCertifications";
import { Careers } from "./pages/Careers";
import { CultureValues } from "./pages/CultureValues";
import { LeadershipTeam } from "./pages/LeadershipTeam";
import { OurHistory } from "./pages/OurHistory";
import { PressMedia } from "./pages/PressMedia";

// Hire Talent Pages
import { DedicatedDevelopmentTeams } from "./pages/DedicatedDevelopmentTeams";
import { EngagementModels } from "./pages/EngagementModels";
import { HireBackendDevelopers } from "./pages/HireBackendDevelopers";
import { HireFrontendDevelopers } from "./pages/HireFrontendDevelopers";
import { HireFullStackDevelopers } from "./pages/HireFullStackDevelopers";
import { HireMobileAppDevelopers } from "./pages/HireMobileAppDevelopers";
import { HireQAEngineers } from "./pages/HireQAEngineers";
import { HireTalent } from "./pages/HireTalent";
import { HireUIUXDesigners } from "./pages/HireUIUXDesigners";
import { TeamAugmentationServices } from "./pages/TeamAugmentationServices";

// Resource Pages
import { Blog } from "./pages/Blog";
import { CaseStudies } from "./pages/CaseStudies";
import { ClientTestimonials } from "./pages/ClientTestimonials";
import { FAQs } from "./pages/FAQs";
import { WhitepapersInsights } from "./pages/WhitepapersInsights";

// Contact Pages
import { motion } from "framer-motion";
import { ChevronRight } from "lucide-react";
import { Helmet } from "react-helmet-async";
import { CookieConsent } from "./components/CookieConsent";
import { ArticleDetail } from "./pages/ArticleDetail";
import { AutomationReshapingBusiness } from "./pages/AutomationReshapingBusiness";
import { BuildingYourAPIStack } from "./pages/BuildingYourAPIStack";
import { ClientSupport } from "./pages/ClientSupport";
import { ComplianceReadyFintech } from "./pages/ComplianceReadyFintech";
import { Contact } from "./pages/Contact";
import { FutureOfAIHealthcare } from "./pages/FutureOfAIHealthcare";
import { GoodTimesProject } from "./pages/GoodTimesProject";
import { LegacySystemScaling } from "./pages/LegacySystemScaling";
import { MigratingToLinear101 } from "./pages/MigratingToLinear101";
import { OfficeLocations } from "./pages/OfficeLocations";
import { ProspertyProject } from "./pages/ProspertyProject";
import { RanOutOfProject } from "./pages/RanOutOfProject";
import { RegroupProject } from "./pages/RegroupProject";
import { RequestProposal } from "./pages/RequestProposal";
import { ScheduleDiscoveryCall } from "./pages/ScheduleDiscoveryCall";
import { SeezunProject } from "./pages/SeezunProject";
import { SendYourCV } from "./pages/SendYourCV";
import { StartAProject } from "./pages/StartAProject";
import { TanamiProject } from "./pages/TanamiProject";
import { ThankYou } from "./pages/ThankYou";
import { TradersCircuitProject } from "./pages/TradersCircuitProject";
import { UXReviewPresentations } from "./pages/UXReviewPresentations";
import { WokaProject } from "./pages/WokaProject";
import { VIB360Project } from "./pages/VIB360Project";
import { AmbleProject } from "./pages/AmbleProject";
import { AmozProject } from "./pages/AmozProject";
import { SimpliTendProject } from "./pages/SimpliTendProject";
import { CaseStudyComingSoon } from "./pages/CaseStudyComingSoon";
import { HireiOSAppDevelopers } from "./pages/HireiOSAppDevelopers";
import { HireAndroidAppDevelopers } from "./pages/HireAndroidAppDevelopers";
import { HireCrossPlatformDevelopers } from "./pages/HireCrossPlatformDevelopers";
import { HireNativeAppDevelopers } from "./pages/HireNativeAppDevelopers";
import { HirePWADevelopers } from "./pages/HirePWADevelopers";
import { HireWearableAppDevelopers } from "./pages/HireWearableAppDevelopers";
import { HireCustomWebAppDevelopers } from "./pages/HireCustomWebAppDevelopers";
import { HireSaaSProductDevelopers } from "./pages/HireSaaSProductDevelopers";
import { HireEcommercePlatformDevelopers } from "./pages/HireEcommercePlatformDevelopers";
import { HireAdminPanelDevelopers } from "./pages/HireAdminPanelDevelopers";
import { HireAPIBackendDevelopers } from "./pages/HireAPIBackendDevelopers";
import { HireEnterpriseSoftwareDevelopers } from "./pages/HireEnterpriseSoftwareDevelopers";
import { HireSystemArchitectureDevOpsDevelopers } from "./pages/HireSystemArchitectureDevOpsDevelopers";
import { HireProductModernizationDevelopers } from "./pages/HireProductModernizationDevelopers";
import { HireThirdPartyIntegrationsDevelopers } from "./pages/HireThirdPartyIntegrationsDevelopers";
import { HireClickablePrototypesDevelopers } from "./pages/HireClickablePrototypesDevelopers";
import { HireDesignThinkingWorkshopsDevelopers } from "./pages/HireDesignThinkingWorkshopsDevelopers";
import { HireUserResearchTestingDevelopers } from "./pages/HireUserResearchTestingDevelopers";


// Create a global navigation context
let setCurrentPath: ((path: string) => void) | null = null;

// Smooth scroll to top function
const scrollToTop = () => {
  const scrollStep = -window.scrollY / (300 / 15); // Duration in ms / frame rate
  const scrollInterval = () => {
    if (window.scrollY !== 0) {
      window.scrollBy(0, scrollStep);
      window.requestAnimationFrame(scrollInterval);
    }
  };
  window.requestAnimationFrame(scrollInterval);
};

export const navigateTo = (path: string) => {
  if (setCurrentPath) {
    // First update the URL and path
    window.history.pushState({}, "", path);
    setCurrentPath(path);
  }
};

// Simple routing logic with better state management
const useRouter = () => {
  const [currentPath, setCurrentPathState] = useState(
    window.location.pathname,
  );

  useEffect(() => {
    // Set the global navigation function
    setCurrentPath = setCurrentPathState;

    const handlePopState = () => {
      setCurrentPathState(window.location.pathname);
    };

    window.addEventListener("popstate", handlePopState);

    return () => {
      window.removeEventListener("popstate", handlePopState);
      setCurrentPath = null;
    };
  }, []);

  // Scroll to top whenever the path changes - but only after a delay to ensure rendering
  useEffect(() => {
    // Use a timeout to ensure the new page has rendered before scrolling
    const scrollTimeout = setTimeout(() => {
      scrollToTop();
    }, 100);

    return () => clearTimeout(scrollTimeout);
  }, [currentPath]);

  return { currentPath };
};


const services = [
  {
    title: "Mobile App Development",
    icon: (
      <path
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth={1.5}
        d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"
      />
    ),
    description: "Native & cross-platform apps with pixel-perfect UIs and seamless user experiences.",
    link: "/services/mobile-app-development"
  },
  {
    title: "Web Platforms & SaaS",
    icon: (
      <path
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth={1.5}
        d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4"
      />
    ),
    description: "Scalable, secure, and SEO-optimized web applications built for performance.",
    link: "/web-cloud"
  },
  {
    title: "AI & ML Solutions",
    icon: (
      <path
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth={1.5}
        d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"
      />
    ),
    description: "Intelligent features powered by cutting-edge algorithms and machine learning.",
    link: "/artificial-intelligence"
  },
  {
    title: "DevOps & Cloud",
    icon: (
      <path
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth={1.5}
        d="M5 12h14M5 12a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v4a2 2 0 01-2 2M5 12a2 2 0 00-2 2v4a2 2 0 002 2h14a2 2 0 002-2v-4a2 2 0 00-2-2m-2-4h.01M17 16h.01"
      />
    ),
    description: "CI/CD pipelines and managed cloud infrastructure for seamless deployment.",
    link: "/services/system-architecture-devops"
  },
  {
    title: "Product Design & UX",
    icon: (
      <path
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth={1.5}
        d="M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4zM21 5a2 2 0 00-2-2h-4a2 2 0 00-2 2v12a4 4 0 004 4h4a2 2 0 002-2V5z"
      />
    ),
    description: "Human-centered UX with delightful micro-interactions and intuitive interfaces.",
    link: "/design-experience"
  },
  {
    title: "Security & Compliance",
    icon: (
      <path
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth={1.5}
        d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"
      />
    ),
    description: "Pen-testing, auditing, and regulatory alignment for enterprise-grade security.",
    link: "/solutions/compliance-ready-systems"
  }
];

// Placeholder component for pages that don't exist yet
const PlaceholderPage = ({
  title = "Coming Soon",
}: {
  title?: string;
}) => (
  <div className="dark min-h-screen bg-background">
    <Navigation />
    <div className="pt-24 pb-16 bg-background">
      <div className="container mx-auto px-6 lg:px-8">
        <div className="max-w-4xl mx-auto text-center">
          <h1 className="text-4xl md:text-6xl font-bold mb-6 bg-gradient-to-r from-white via-white to-white/80 bg-clip-text text-transparent">
            {title}
          </h1>
          <p className="text-lg text-muted-foreground mb-8">
            This page is currently under development. Please
            check back soon!
          </p>
          <Button onClick={() => navigateTo("/")} size="lg">
            Return to Homepage
          </Button>
        </div>
      </div>
    </div>
    <Footer />
  </div>
);

// Homepage component - ENSURED ALL SECTIONS USE DARK BACKGROUNDS
const Homepage = () => (
  <div className="dark min-h-screen bg-background">
    <Helmet>
      {/* Page Title and Meta Description */}
      <title>Mobile App Development Services | WDI - iOS & Android App Development</title>
      <meta
        name="description"
        content="Professional mobile app development services at WDI. Build secure, scalable iOS and Android apps with expert developers. Cross-platform solutions available."
      />

      {/* Canonical Link */}
      <link rel="canonical" href="https://www.wdipl.com/" />

      {/* Open Graph Tags (for Facebook, LinkedIn) */}
      <meta property="og:title" content="Mobile App Development Services | WDI - iOS & Android App Development" />
      <meta
        property="og:description"
        content="Professional mobile app development services at WDI. Build secure, scalable iOS and Android apps with expert developers. Cross-platform solutions available."
      />
      <meta property="og:url" content="https://www.wdipl.com/services" />
      <meta property="og:type" content="website" />
      <meta property="og:image" content="https://www.wdipl.com/your-preview-image.jpg" />

      {/* Twitter Card Tags */}
      <meta name="twitter:card" content="summary_large_image" />
      <meta name="twitter:title" content="Mobile App Development Services | WDI - iOS & Android App Development" />
      <meta
        name="twitter:description"
        content="Professional mobile app development services at WDI. Build secure, scalable iOS and Android apps with expert developers. Cross-platform solutions available."
      />
      <meta name="twitter:image" content="https://www.wdipl.com/your-preview-image.jpg" />

      {/* Social Profiles (using JSON-LD Schema) */}
      <script type="application/ld+json">
        {`
                  {
                    "@context": "https://schema.org",
                    "@type": "Organization",
                    "name": "WDI",
                    "url": "https://www.wdipl.com",
                    "sameAs": [
                      "https://www.facebook.com/wdideas",
                      "https://www.linkedin.com/in/website-developers-india/",
                      "https://www.instagram.com/wdipl/"
                    ]
                  }
                `}
      </script>
    </Helmet>
    <Navigation />

    {/* Hero Section - Dark background */}
    <section className="bg-background">
      <HeroSection />
    </section>

    {/* Client Logos - Dark background */}
    <section className="bg-background">
      <ClientLogos />
    </section>

    {/* Services Grid - Dark background */}
    {/* <section className="bg-background">
      <ServicesSection />
    </section> */}
    <section className="py-20 bg-background">
      <div className="container mx-auto px-6 lg:px-8">
        <motion.div
          initial={{ opacity: 0, y: 30 }}
          whileInView={{ opacity: 1, y: 0 }}
          transition={{ duration: 0.8 }}
          viewport={{ once: true }}
          className="text-left mb-20"
        >
          <div className="text-center">
            <h2 className="text-3xl sm:text-4xl font-semibold tracking-tight text-white">What We Do</h2>
            <p className="mt-4 text-gray-400 max-w-2xl mx-auto">
              End-to-end solutions for every stage of your product lifecycle.
            </p>
          </div>
        </motion.div>

        <motion.div
          initial={{ opacity: 0, y: 40 }}
          whileInView={{ opacity: 1, y: 0 }}
          transition={{ duration: 0.8, delay: 0.2 }}
          viewport={{ once: true }}
          className="grid md:grid-cols-2 lg:grid-cols-3 gap-8"
        >
          {services.map((service, index) => {
            const IconComponent = service.icon;
            return (
              <motion.div
                key={index}
                initial={{ opacity: 0, y: 20 }}
                whileInView={{ opacity: 1, y: 0 }}
                transition={{ duration: 0.5, delay: index * 0.01 }}
                viewport={{ once: true }}
                whileHover={{ y: -5 }}
                className="group cursor-pointer"
                onClick={() => navigateTo(service.link)}
              >
                <div className="bg-gray-900/50 backdrop-blur-sm rounded-2xl border border-gray-800 p-8 hover:border-accent/30 transition-all duration-300 shadow-lg hover:shadow-xl h-full">
                  <div className="flex flex-col items-start space-y-6">
                    <div className="w-12 h-12 bg-accent/20 rounded-lg flex items-center justify-center">
                      {/* <IconComponent className="w-6 h-6 text-accent" /> */}
                      <svg
                        className="w-6 h-6 text-accent"
                        fill="none"
                        stroke="currentColor"
                        viewBox="0 0 24 24"
                      >
                        {service.icon}
                      </svg>
                    </div>

                    <div>
                      <h3 className="text-xl font-semibold text-white mb-4">
                        {service.title}
                      </h3>
                      <p className="text-gray-400 leading-relaxed">
                        {service.description}
                      </p>
                    </div>

                    <div className="flex items-center gap-2 text-accent font-medium">
                      <span>Explore Services</span>
                      <ChevronRight className="w-4 h-4" />
                    </div>
                  </div>
                </div>
              </motion.div>
            );
          })}
        </motion.div>
      </div>
    </section>

    {/* Why Choose WDI - Dark background */}
    <section className="bg-background">
      <WhyChooseWDI />
    </section>

    {/* Industry Solutions - Dark background */}
    <section className="bg-background">
      <HorizontalTagScroller />
    </section>

    {/* Case Studies - Dark background */}
    <section className="bg-background">
      <CaseStudyHighlight />
    </section>

    {/* Inline CTA - Dark background */}
    <section className="bg-background">
      <InlineCTA />
    </section>

    {/* Process Steps - Dark background */}
    <section className="bg-background">
      <ProcessSection />
    </section>

    {/* Testimonials - Dark background */}
    <section className="bg-background">
      <CarouselTestimonials />
    </section>

    {/* Resources - Dark background */}
    <section className="bg-background">
      <ResourceCards />
    </section>

    {/* Final CTA - Dark background */}
    <section className="bg-background">
      <SplitCallToAction />
    </section>

    {/* Footer - Dark background */}
    <section className="bg-background">
      <Footer />
    </section>
  </div>
);

export default function App() {
  const { currentPath } = useRouter();

  // Route definitions for cleaner code
  const routes = {
    // Homepage
    "/": Homepage,
    "/home": Homepage,

    // MAIN CATEGORY PAGES - ALL NOW FULLY IMPLEMENTED ✅
    "/services": Services,
    "/solutions": Solutions,
    "/industries": Industries,
    "/resources": Resources,
    // "/company": Company,
    // "/contact": ContactMain,
    "/web-cloud": WebCloudServices,
    "/software-engineering": SoftwareEngineering,
    "/design-experience": DesignExperience,
    "/artificial-intelligence": ArtificialIntelligenceServices,
    "/machine-learning": MachineLearning,

    // SERVICES
    "/services/mobile-app-development": MobileAppDevelopment,
    "/services/ios-app-development": IOSAppDevelopment,
    "/services/android-app-development": AndroidAppDevelopment,
    "/services/cross-platform-app-development":
      CrossPlatformAppDevelopment,
    "/services/native-app-development": NativeAppDevelopment,
    "/services/pwa-development": PWADevelopment,
    "/services/wearable-device-development":
      WearableDeviceDevelopment,
    "/services/custom-web-app-development":
      CustomWebAppDevelopment,
    "/services/saas-product-engineering":
      SaaSProductEngineering,
    "/services/ecommerce-platforms": EcommercePlatforms,
    "/services/admin-panels-dashboards": AdminPanelsDashboards,
    "/services/api-backend-development": APIBackendDevelopment,
    "/services/enterprise-software-solutions":
      EnterpriseSoftwareSolutions,
    "/services/system-architecture-devops":
      SystemArchitectureDevOps,
    "/services/third-party-integrations":
      ThirdPartyIntegrations,
    "/services/product-modernization": ProductModernization,
    "/services/ui-ux-design": UIUXDesign,
    "/services/clickable-prototypes": ClickablePrototypes,
    "/services/design-thinking-workshops":
      DesignThinkingWorkshops,
    "/services/user-research-testing": UserResearchTesting,
    "/services/ai-strategy-consulting": AIStrategyConsulting,
    "/services/ai-automation-workflows": AIAutomationWorkflows,
    "/services/ai-integration-digital-products":
      AIIntegrationDigitalProducts,
    "/services/gen-ai-integration-digital-products":
      GenAIIntegrationDigitalProducts,
    "/services/ai-chatbots-virtual-assistants":
      AIChatbotsVirtualAssistants,
    "/services/ai-model-deployment-mlops":
      AIModelDeploymentMLOps,
    "/services/custom-ml-model-development":
      CustomMLModelDevelopment,
    "/services/predictive-analytics-forecasting":
      PredictiveAnalyticsForecasting,
    "/services/computer-vision-applications":
      ComputerVisionApplications,
    "/services/nlp-text-analytics": NLPTextAnalytics,
    "/services/recommendation-engines": RecommendationEngines,

    // SOLUTIONS - Original routes
    "/solutions/digital-product-development":
      DigitalProductDevelopment,
    "/solutions/mvp-startup-launch-packages":
      MVPStartupLaunchPackages,
    "/solutions/legacy-system-rebuilds": LegacySystemRebuilds,
    "/solutions/dedicated-offshore-odc": DedicatedOffshoreODC,
    "/solutions/business-process-automation":
      BusinessProcessAutomation,
    "/solutions/compliance-ready-systems":
      ComplianceReadySystems,

    // SOLUTIONS - New simplified routes
    "/digital-product-development": DigitalProductDevelopment,
    "/mvp-startup-launch": MVPStartupLaunchPackages,
    "/legacy-system-rebuilds": LegacySystemRebuilds,
    "/dedicated-development-centers": DedicatedOffshoreODC,
    "/business-process-automation": BusinessProcessAutomation,
    "/compliance-ready-systems": ComplianceReadySystems,

    // INDUSTRIES - Financial Services
    "/industries/fintech-banking-apps": FinTechBankingApps,
    "/industries/financial-services/wealthtech-platforms":
      WealthTechPlatforms,
    "/industries/financial-services/real-estate-tech":
      RealEstateTech,

    // INDUSTRIES - Healthcare & Wellness
    "/industries/healthcare/healthtech-applications":
      HealthTechApplications,
    "/industries/healthcare/medical-compliance-solutions":
      MedicalComplianceSolutions,
    "/industries/healthcare/fitness-wellness-platforms":
      FitnessWellnessPlatforms,

    // INDUSTRIES - Learning & Education
    "/industries/education/edtech-platforms": EdTechPlatforms,
    "/industries/education/virtual-classrooms-lms":
      VirtualClassroomsLMS,
    "/industries/education/microlearning-apps":
      MicrolearningApps,

    // INDUSTRIES - Commerce & Consumer
    "/industries/commerce/ecommerce-marketplaces":
      EcommerceMarketplaces,
    "/industries/commerce/food-ordering-delivery":
      FoodOrderingDelivery,
    "/industries/commerce/travel-booking-systems":
      TravelBookingSystems,
    "/industries/commerce/event-ticketing-solutions":
      EventTicketingSolutions,

    // INDUSTRIES - Media & Community
    "/industries/media/ott-streaming-apps": OTTStreamingApps,
    "/industries/media/social-platforms-networks":
      SocialPlatformsNetworks,
    "/industries/media/sports-fan-engagement":
      SportsFanEngagement,

    // INDUSTRIES - Mobility & Logistics
    "/industries/mobility/transportation-apps":
      TransportationApps,
    "/industries/mobility/on-demand-services": OnDemandServices,
    "/industries/mobility/supply-chain-fleet-management":
      SupplyChainFleetManagement,

    // INDUSTRIES - Industrial & Emerging Tech
    "/industries/industrial/manufacturing-automation":
      ManufacturingAutomation,
    "/industries/industrial/agritech-platforms":
      AgriTechPlatforms,
    "/industries/industrial/oil-gas-monitoring-systems":
      OilGasMonitoringSystems,

    // COMPANY PAGES - About WDI now accessible only through Company dropdown
    "/company/about-wdi": AboutWDI,
    "/company/our-history": OurHistory,
    "/company/leadership-team": LeadershipTeam,
    "/company/awards-certifications": AwardsCertifications,
    "/company/careers": Careers,
    "/company/culture-values": CultureValues,
    "/company/press-media": PressMedia,

    // CAREERS PAGES - Direct access routes
    "/careers": Careers,
    "/careers/open-positions": Careers,
    "/careers/send-cv": Careers,

    // HIRE TALENT PAGES
    "/hire-talent": HireTalent,
    "/hire-talent/mobile-app-developers":
      HireMobileAppDevelopers,
    "/hire-talent/full-stack-developers":
      HireFullStackDevelopers,
    "/hire-talent/frontend-developers": HireFrontendDevelopers,
    "/hire-talent/backend-developers": HireBackendDevelopers,
    "/hire-talent/ui-ux-designers": HireUIUXDesigners,
    "/hire-talent/qa-engineers": HireQAEngineers,
    "/dedicated-development-teams": DedicatedDevelopmentTeams,
    "/engagement-models": EngagementModels,
    "/team-augmentation-services": TeamAugmentationServices,

    // RESOURCES PAGES
    "/resources/blog": Blog,
    "/case-studies": CaseStudies,
    "/resources/client-testimonials": ClientTestimonials,
    "/resources/whitepapers-insights": WhitepapersInsights,
    "/resources/faqs": FAQs,

    // New hire pages
    "/hire-talent/ios-app-developers": HireiOSAppDevelopers,
    "/hire-talent/android-app-developers": HireAndroidAppDevelopers,
    "/hire-talent/cross-platform-developers": HireCrossPlatformDevelopers,
    "/hire-talent/native-app-developers": HireNativeAppDevelopers,
    "/hire-talent/pwa-developers": HirePWADevelopers,
    "/hire-talent/wearable-app-developers": HireWearableAppDevelopers,
    "/hire-talent/custom-web-app-developers": HireCustomWebAppDevelopers,
    "/hire-talent/saas-product-developers": HireSaaSProductDevelopers,
    "/hire-talent/ecommerce-platform-developers": HireEcommercePlatformDevelopers,
    "/hire-talent/admin-panel-developers": HireAdminPanelDevelopers,
    "/hire-talent/api-backend-developers": HireAPIBackendDevelopers,
    "/hire-talent/enterprise-software-developers": HireEnterpriseSoftwareDevelopers,
    "/hire-talent/system-architecture-developers": HireSystemArchitectureDevOpsDevelopers,
    "/hire-talent/third-party-integration-developers": HireThirdPartyIntegrationsDevelopers,
    "/hire-talent/product-modernization-developers": HireProductModernizationDevelopers,
    "/hire-talent/clickable-prototypes-developers": HireClickablePrototypesDevelopers,
    "/hire-talent/design-thinking-workshops-developers": HireDesignThinkingWorkshopsDevelopers,
    "/hire-talent/user-research-testing-developers": HireUserResearchTestingDevelopers,

    //Comming Soon / Placeholder Pages
    "/comming-soon": () => <CaseStudyComingSoon projectTitle="Coming Soon Project" />,

    // CONTACT PAGES - Updated to use proper main contact route
    "/contact-us": Contact, // Contact Us Now page
    "/contact-us-now": Contact, // Alternative URL for Contact Us Now page
    "/contact/request-a-proposal": RequestProposal,
    "/contact/schedule-a-discovery-call": ScheduleDiscoveryCall,
    "/contact/office-locations": OfficeLocations,
    "/contact/client-support": ClientSupport,
    "/contact/send-your-cv": SendYourCV,
    "/start-a-project": StartAProject,
    "/thank-you": ThankYou,

    // LEGACY CONTACT ROUTE SUPPORT
    "/contact/contact-form": ContactMain, // Support for contact form specific route

    // PROJECT PAGES
    "/projects/regroup": RegroupProject,
    "/projects/seezun": SeezunProject,
    "/projects/woka": WokaProject,
    "/projects/tanami": TanamiProject,
    "/projects/traderscircuit": TradersCircuitProject,
    "/projects/goodtimes": GoodTimesProject,
    "/projects/prosperty": ProspertyProject,
    "/projects/ranoutof": RanOutOfProject,
    "/projects/vib360": VIB360Project,
    "/projects/amble": AmbleProject,
    "/projects/amoz": AmozProject,
    "/projects/simpletend": SimpliTendProject,


    // ARTICLE PAGES
    "/articles/future-of-ai-healthcare": FutureOfAIHealthcare,
    "/articles/compliance-ready-systems-fintech":
      ComplianceReadyFintech,
    "/articles/legacy-system-scaling": LegacySystemScaling,
    "/articles/automation-reshaping-business":
      AutomationReshapingBusiness,

    // INSIGHT PAGES
    "/insights/ux-review-presentations": UXReviewPresentations,
    "/insights/migrating-to-linear-101": MigratingToLinear101,
    "/insights/building-your-api-stack": BuildingYourAPIStack,

  };

  // Check if current path matches any route
  const RouteComponent =
    routes[currentPath as keyof typeof routes];
  if (RouteComponent) {
    return (
      <div className="min-h-screen bg-background">
        <RouteComponent />
        <CookieConsent />
      </div>
    );
  }

  // Handle dynamic article routes
  if (currentPath.startsWith("/articles/")) {
    return (
      <div className="min-h-screen bg-background">
        <ArticleDetail />
        <CookieConsent />
      </div>
    );
  }

  // Handle dynamic insight routes
  if (currentPath.startsWith("/insights/")) {
    const slug = currentPath.replace("/insights/", "");
    let InsightComponent;

    switch (slug) {
      case "ux-review-presentations":
        InsightComponent = UXReviewPresentations;
        break;
      case "migrating-to-linear-101":
        InsightComponent = MigratingToLinear101;
        break;
      case "building-your-api-stack":
        InsightComponent = BuildingYourAPIStack;
        break;
      default:
        InsightComponent = null;
    }

    if (InsightComponent) {
      return (
        <div className="min-h-screen bg-background">
          <InsightComponent />
          <CookieConsent />
        </div>
      );
    }
  }

  // Default to homepage for root path and unmatched paths
  return (
    <div className="min-h-screen bg-background">
      <Homepage />
      <CookieConsent />
    </div>
  );
}