Untitled

import React, { useEffect } from 'react';
import { BrowserRouter as Router, Routes, Route, useLocation } from 'react-router-dom';
import { Toaster } from 'sonner';
import { LanguageProvider, useLanguage } from '@/contexts/LanguageContext.jsx';
import Header from '@/components/Header.jsx';
import NewFooterDesign from '@/components/NewFooterDesign.jsx';
import NewFooterDesignEN from '@/components/NewFooterDesignEN.jsx';
import NewBookingButton from '@/components/NewBookingButton.jsx';
import ScrollToTop from '@/components/ScrollToTop.jsx';
import PageTransition from '@/components/PageTransition.jsx';

// Pages (FR)
import HomePage from '@/pages/HomePage.jsx';
import AboutPage from '@/pages/AboutPage.jsx';
import ServicesPage from '@/pages/ServicesPage.jsx';
import ContactPage from '@/pages/ContactPage.jsx';
import DentalTourismPage from '@/pages/DentalTourismPage.jsx';
import RabatTourismPage from '@/pages/RabatTourismPage.jsx';
import OffersPage from '@/pages/OffersPage.jsx';
import NewsPage from '@/pages/NewsPage.jsx';
import NewsDetailPage from '@/pages/NewsDetailPage.jsx';
import NewsDebugPage from '@/pages/NewsDebugPage.jsx';

// Service Detail Pages (FR)
import ImplantologiePage from '@/pages/ImplantologiePage.jsx';
import EsthetiqueDentairePage from '@/pages/EsthetiqueDentairePage.jsx';
import OrthodontiePage from '@/pages/OrthodontiePage.jsx';
import ParodontologiePage from '@/pages/ParodontologiePage.jsx';
import ProthesesDentairesPage from '@/pages/ProthesesDentairesPage.jsx';
import BlanchimentDentairePage from '@/pages/BlanchimentDentairePage.jsx';
import UrgencesDentairesPage from '@/pages/UrgencesDentairesPage.jsx';
import RadiographieDentairePage from '@/pages/RadiographieDentairePage.jsx';
import RadiographiePage from '@/pages/RadiographiePage.jsx';
import ChirurgieBuccalePage from '@/pages/ChirurgieBuccalePage.jsx';
import PedodontiePage from '@/pages/PedodontiePage.jsx';
import EndodontiePage from '@/pages/EndodontiePage.jsx';
import ProtheseEsthetiquePage from '@/pages/ProtheseEsthetiquePage.jsx';
import SoinDentairePage from '@/pages/SoinDentairePage.jsx';
import SoinDentaireEtEndodontie from '@/pages/SoinDentaireEtEndodontie.jsx';
import SoinsInclusifs from '@/pages/SoinsInclusifs.jsx';

// Pages (EN)
import HomePageEN from '@/pages/HomePageEN.jsx';
import AboutPageEN from '@/pages/AboutPageEN.jsx';
import ServicesPageEN from '@/pages/ServicesPageEN.jsx';
import ContactPageEN from '@/pages/ContactPageEN.jsx';
import DentalTourismPageEN from '@/pages/DentalTourismPageEN.jsx';
import RabatTourismPageEN from '@/pages/RabatTourismPageEN.jsx';
import OffersPageEN from '@/pages/OffersPageEN.jsx';
import NewsPageEN from '@/pages/NewsPageEN.jsx';
import NewsDetailPageEN from '@/pages/NewsDetailPageEN.jsx';

// Service Detail Pages (EN)
import DentalImplantPageEN from '@/pages/DentalImplantPageEN.jsx';
import CosmeticDentistryPageEN from '@/pages/CosmeticDentistryPageEN.jsx';
import OrthodonticsPageEN from '@/pages/OrthodonticsPageEN.jsx';
import PediatricDentistryPageEN from '@/pages/PediatricDentistryPageEN.jsx';
import PeriodontalPageEN from '@/pages/PeriodontalPageEN.jsx';
import RootCanalPageEN from '@/pages/RootCanalPageEN.jsx';
import DentalCleaningPageEN from '@/pages/DentalCleaningPageEN.jsx';
import EmergencyDentistryPageEN from '@/pages/EmergencyDentistryPageEN.jsx';
import OralSurgeryPageEN from '@/pages/OralSurgeryPageEN.jsx';
import DentalRadiographyPageEN from '@/pages/DentalRadiographyPageEN.jsx';
import DentalProthesesPageEN from '@/pages/DentalProthesesPageEN.jsx';
import ToothWhiteningPageEN from '@/pages/ToothWhiteningPageEN.jsx';
import AestheticProsthesesPageEN from '@/pages/AestheticProsthesesPageEN.jsx';
import DentalCareAndEndodonticsPageEN from '@/pages/DentalCareAndEndodonticsPageEN.jsx';
import ComprehensiveCarePageEN from '@/pages/ComprehensiveCarePageEN.jsx';

// Legal Pages
import PrivacyPage from '@/pages/PrivacyPage.jsx';
import TermsPage from '@/pages/TermsPage.jsx';
import SitemapPage from '@/pages/SitemapPage.jsx';

const AppLayout = () => {
  const location = useLocation();
  const { language, setLang } = useLanguage();
  const isDentalTourismPage = location.pathname === '/tourisme-dentaire-maroc' || location.pathname === '/dental-tourism' || location.pathname === '/en/tourisme-dentaire-maroc' || location.pathname === '/en/dental-tourism';
  const isContactPage = location.pathname === '/contact' || location.pathname === '/en/contact';
  const isEnglishRoute = location.pathname.startsWith('/en');

  useEffect(() => {
    const routeLanguage = isEnglishRoute ? 'en' : 'fr';
    if (language !== routeLanguage) {
      setLang(routeLanguage);
    }
  }, [isEnglishRoute, language, setLang]);

  return (
    <div className="flex flex-col min-h-screen bg-background text-foreground font-sans antialiased selection:bg-primary/20 selection:text-primary">
      <Header />
      <main className="flex-grow flex flex-col relative z-0 mt-[74px] md:mt-[82px] lg:mt-[92px]">
        <Routes>
          {/* French Routes */}
          <Route path="/" element={<PageTransition><HomePage /></PageTransition>} />
          <Route path="/about" element={<PageTransition><AboutPage /></PageTransition>} />
          <Route path="/nos-services" element={<PageTransition><ServicesPage /></PageTransition>} />
          <Route path="/services" element={<PageTransition><ServicesPage /></PageTransition>} />
          <Route path="/contact" element={<PageTransition><ContactPage /></PageTransition>} />
          <Route path="/dental-tourism" element={<PageTransition><DentalTourismPage /></PageTransition>} />
          <Route path="/tourisme-dentaire-maroc" element={<PageTransition><DentalTourismPage /></PageTransition>} />
          <Route path="/rabat-tourism" element={<PageTransition><RabatTourismPage /></PageTransition>} />
          <Route path="/offers" element={<PageTransition><OffersPage /></PageTransition>} />
          <Route path="/actualites" element={<PageTransition><NewsPage /></PageTransition>} />
          <Route path="/actualites/:id" element={<PageTransition><NewsDetailPage /></PageTransition>} />
          <Route path="/news" element={<PageTransition><NewsPage /></PageTransition>} />
          <Route path="/news/:id" element={<PageTransition><NewsDetailPage /></PageTransition>} />
          <Route path="/news-debug" element={<PageTransition><NewsDebugPage /></PageTransition>} />

          {/* English Routes */}
          <Route path="/en" element={<PageTransition><HomePageEN /></PageTransition>} />
          <Route path="/en/about" element={<PageTransition><AboutPageEN /></PageTransition>} />
          <Route path="/en/services" element={<PageTransition><ServicesPageEN /></PageTransition>} />
          <Route path="/en/nos-services" element={<PageTransition><ServicesPageEN /></PageTransition>} />
          <Route path="/en/contact" element={<PageTransition><ContactPageEN /></PageTransition>} />
          <Route path="/en/dental-tourism" element={<PageTransition><DentalTourismPageEN /></PageTransition>} />
          <Route path="/en/tourisme-dentaire-maroc" element={<PageTransition><DentalTourismPageEN /></PageTransition>} />
          <Route path="/en/rabat-tourism" element={<PageTransition><RabatTourismPageEN /></PageTransition>} />
          <Route path="/en/offers" element={<PageTransition><OffersPageEN /></PageTransition>} />
          <Route path="/en/news" element={<PageTransition><NewsPageEN /></PageTransition>} />
          <Route path="/en/actualites" element={<PageTransition><NewsPageEN /></PageTransition>} />
          <Route path="/en/news/:id" element={<PageTransition><NewsDetailPageEN /></PageTransition>} />
          <Route path="/en/actualites/:id" element={<PageTransition><NewsDetailPageEN /></PageTransition>} />

          {/* Service Detail Routes (FR) */}
          <Route path="/implantologie" element={<PageTransition><ImplantologiePage /></PageTransition>} />
          <Route path="/esthetique-dentaire" element={<PageTransition><EsthetiqueDentairePage /></PageTransition>} />
          <Route path="/orthodontie" element={<PageTransition><OrthodontiePage /></PageTransition>} />
          <Route path="/parodontologie" element={<PageTransition><ParodontologiePage /></PageTransition>} />
          <Route path="/protheses-dentaires" element={<PageTransition><ProthesesDentairesPage /></PageTransition>} />
          <Route path="/blanchiment-dentaire" element={<PageTransition><BlanchimentDentairePage /></PageTransition>} />
          <Route path="/urgences-dentaires" element={<PageTransition><UrgencesDentairesPage /></PageTransition>} />
          <Route path="/radiographie-dentaire" element={<PageTransition><RadiographieDentairePage /></PageTransition>} />
          <Route path="/radiographie" element={<PageTransition><RadiographiePage /></PageTransition>} />
          <Route path="/chirurgie-buccale" element={<PageTransition><ChirurgieBuccalePage /></PageTransition>} />
          <Route path="/pedodontie" element={<PageTransition><PedodontiePage /></PageTransition>} />
          <Route path="/endodontie" element={<PageTransition><EndodontiePage /></PageTransition>} />
          <Route path="/prothese-esthetique" element={<PageTransition><ProtheseEsthetiquePage /></PageTransition>} />
          <Route path="/soin-dentaire" element={<PageTransition><SoinDentairePage /></PageTransition>} />
          <Route path="/soin-dentaire-et-endodontie" element={<PageTransition><SoinDentaireEtEndodontie /></PageTransition>} />
          <Route path="/soins-inclusifs" element={<PageTransition><SoinsInclusifs /></PageTransition>} />

          {/* Service Detail Routes (EN) */}
          <Route path="/en/services/dental-implants" element={<PageTransition><DentalImplantPageEN /></PageTransition>} />
          <Route path="/en/implantologie" element={<PageTransition><DentalImplantPageEN /></PageTransition>} />
          <Route path="/en/services/cosmetic-dentistry" element={<PageTransition><CosmeticDentistryPageEN /></PageTransition>} />
          <Route path="/en/esthetique-dentaire" element={<PageTransition><CosmeticDentistryPageEN /></PageTransition>} />
          <Route path="/en/services/orthodontics" element={<PageTransition><OrthodonticsPageEN /></PageTransition>} />
          <Route path="/en/orthodontie" element={<PageTransition><OrthodonticsPageEN /></PageTransition>} />
          <Route path="/en/services/pediatric-dentistry" element={<PageTransition><PediatricDentistryPageEN /></PageTransition>} />
          <Route path="/en/pedodontie" element={<PageTransition><PediatricDentistryPageEN /></PageTransition>} />
          <Route path="/en/services/periodontal" element={<PageTransition><PeriodontalPageEN /></PageTransition>} />
          <Route path="/en/parodontologie" element={<PageTransition><PeriodontalPageEN /></PageTransition>} />
          <Route path="/en/services/root-canal" element={<PageTransition><RootCanalPageEN /></PageTransition>} />
          <Route path="/en/endodontie" element={<PageTransition><RootCanalPageEN /></PageTransition>} />
          <Route path="/en/services/dental-cleaning" element={<PageTransition><DentalCleaningPageEN /></PageTransition>} />
          <Route path="/en/soin-dentaire" element={<PageTransition><DentalCleaningPageEN /></PageTransition>} />
          <Route path="/en/services/emergency-dentistry" element={<PageTransition><EmergencyDentistryPageEN /></PageTransition>} />
          <Route path="/en/urgences-dentaires" element={<PageTransition><EmergencyDentistryPageEN /></PageTransition>} />
          <Route path="/en/services/oral-surgery" element={<PageTransition><OralSurgeryPageEN /></PageTransition>} />
          <Route path="/en/chirurgie-buccale" element={<PageTransition><OralSurgeryPageEN /></PageTransition>} />
          <Route path="/en/services/dental-radiography" element={<PageTransition><DentalRadiographyPageEN /></PageTransition>} />
          <Route path="/en/radiographie" element={<PageTransition><DentalRadiographyPageEN /></PageTransition>} />
          <Route path="/en/services/dental-prostheses" element={<PageTransition><DentalProthesesPageEN /></PageTransition>} />
          <Route path="/en/protheses-dentaires" element={<PageTransition><DentalProthesesPageEN /></PageTransition>} />
          <Route path="/en/services/tooth-whitening" element={<PageTransition><ToothWhiteningPageEN /></PageTransition>} />
          <Route path="/en/blanchiment-dentaire" element={<PageTransition><ToothWhiteningPageEN /></PageTransition>} />
          <Route path="/en/services/aesthetic-prostheses" element={<PageTransition><AestheticProsthesesPageEN /></PageTransition>} />
          <Route path="/en/prothese-esthetique" element={<PageTransition><AestheticProsthesesPageEN /></PageTransition>} />
          <Route path="/en/services/dental-care-and-endodontics" element={<PageTransition><DentalCareAndEndodonticsPageEN /></PageTransition>} />
          <Route path="/en/soin-dentaire-et-endodontie" element={<PageTransition><DentalCareAndEndodonticsPageEN /></PageTransition>} />
          <Route path="/en/services/comprehensive-care" element={<PageTransition><ComprehensiveCarePageEN /></PageTransition>} />
          <Route path="/en/soins-inclusifs" element={<PageTransition><ComprehensiveCarePageEN /></PageTransition>} />

          {/* Legal Routes */}
          <Route path="/privacy" element={<PageTransition><PrivacyPage /></PageTransition>} />
          <Route path="/terms" element={<PageTransition><TermsPage /></PageTransition>} />
          <Route path="/sitemap" element={<PageTransition><SitemapPage /></PageTransition>} />

          {/* 404 Catch-all */}
          <Route path="*" element={
            <PageTransition>
              <div className="flex-1 flex flex-col items-center justify-center py-32 px-4 text-center">
                <h1 className="text-6xl font-bold text-primary mb-4">404</h1>
                <h2 className="text-2xl font-semibold mb-6">{isEnglishRoute ? "Page Not Found" : "Page introuvable"}</h2>
                <p className="text-muted-foreground mb-8 max-w-md">
                  {isEnglishRoute ? "The page you are looking for does not exist or has been moved." : "La page que vous recherchez n'existe pas ou a été déplacée."}
                </p>
                <a href={isEnglishRoute ? "/en" : "/"} className="inline-flex items-center justify-center px-8 py-3 bg-primary text-primary-foreground rounded-full font-medium hover:bg-primary/90 transition-colors">
                  {isEnglishRoute ? "Back to Home" : "Retour à l'accueil"}
                </a>
              </div>
            </PageTransition>
          } />
        </Routes>
      </main>

      {!isContactPage && (isEnglishRoute ? <NewFooterDesignEN /> : <NewFooterDesign />)}

      {!isDentalTourismPage && <NewBookingButton />}
    </div>
  );
};

function App() {
  return (
    <LanguageProvider>
      <Router>
        <ScrollToTop />
        <AppLayout />
        <Toaster position="top-center" richColors />
      </Router>
    </LanguageProvider>
  );
}

export default App;