/* global React, ReactDOM, Header, Footer, BackToTop, CookieConsent, HomePage, AboutPage, ServicesPage, FAQPage, ContactPage, MentionsLegalesPage, PolitiqueConfidentialitePage, ServiceEntreprisesPage, ServiceBatimentsPage, ServiceVitresPage, ServiceIndustrielPage, ServiceJardinsPage */

const PAGES = {
    home:                         { Component: HomePage,                      label: 'Accueil' },
    about:                        { Component: AboutPage,                     label: 'À propos' },
    services:                     { Component: ServicesPage,                  label: 'Services' },
    faq:                          { Component: FAQPage,                       label: 'FAQ' },
    contact:                      { Component: ContactPage,                   label: 'Contact' },
    'mentions-legales':           { Component: MentionsLegalesPage,           label: 'Mentions légales' },
    'politique-confidentialite':  { Component: PolitiqueConfidentialitePage,  label: 'Politique de confidentialité' },
    'service-entreprises':        { Component: ServiceEntreprisesPage,        label: 'Nettoyage d\'Entreprises' },
    'service-batiments':          { Component: ServiceBatimentsPage,          label: 'Nettoyage de Bâtiments' },
    'service-vitres':             { Component: ServiceVitresPage,             label: 'Nettoyage de Vitres' },
    'service-industriel':         { Component: ServiceIndustrielPage,         label: 'Nettoyage Industriel' },
    'service-jardins':            { Component: ServiceJardinsPage,            label: 'Jardins & Parcs' },
};

function App() {
    const [currentPage, setCurrentPage] = React.useState('home');

    // Scroll to top AFTER the new page has rendered (fixes mobile burger menu lag)
    React.useEffect(() => {
        window.scrollTo(0, 0);
    }, [currentPage]);

    const navigate = (page) => {
        if (!PAGES[page]) return;
        setCurrentPage(page);
    };

    const { Component } = PAGES[currentPage];

    return (
        <div data-screen-label={`${currentPage} — ${PAGES[currentPage].label}`}>
            <a href="#main" className="skip-link screen-reader-text">Aller au contenu</a>
            <Header currentPage={currentPage} navigate={navigate}/>
            <div id="main">
                <Component navigate={navigate}/>
            </div>
            <Footer navigate={navigate}/>
            <BackToTop/>
            <CookieConsent navigate={navigate}/>
        </div>
    );
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App/>);