// Root App — hash routing, mounts everything.
(function () {
  const { useState } = React;
  const {
    Nav, Footer, QuoteDrawer, FloatingCTA, useHashRoute,
    HomePage, AboutPage, MissionPage, ChemicalsPage, CommoditiesPage,
    IndustriesPage, LogisticsPage, AdvantagesPage, ContactPage, NotFoundPage,
  } = window.GR;

  function App() {
    const [route] = useHashRoute();
    const [quoteOpen, setQuoteOpen] = useState(false);
    const openQuote = () => setQuoteOpen(true);
    const closeQuote = () => setQuoteOpen(false);

    let page;
    switch (route) {
      case '/':            page = <HomePage openQuote={openQuote} />; break;
      case '/about':       page = <AboutPage />; break;
      case '/mission':     page = <MissionPage />; break;
      case '/chemicals':   page = <ChemicalsPage openQuote={openQuote} />; break;
      case '/commodities': page = <CommoditiesPage openQuote={openQuote} />; break;
      case '/industries':  page = <IndustriesPage />; break;
      case '/logistics':   page = <LogisticsPage />; break;
      case '/advantages':  page = <AdvantagesPage />; break;
      case '/contact':     page = <ContactPage />; break;
      default:             page = <NotFoundPage />;
    }

    return (
      <React.Fragment>
        <Nav route={route} openQuote={openQuote} />
        <main key={route} className="gr-page" style={{ minHeight: '60vh' }}>
          {page}
        </main>
        <Footer />
        <FloatingCTA onOpen={openQuote} />
        <QuoteDrawer open={quoteOpen} onClose={closeQuote} />
      </React.Fragment>
    );
  }

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