/* =========== App root =========== */
function App(){
  useCursor();
  const route = useRoute();

  let page;
  if(route==='/' || route==='') page = <Home/>;
  else if(route.startsWith('/portfolio/')){
    const slug = route.replace('/portfolio/', '').replace(/\/$/,'');
    page = <PortfolioDetail slug={slug} key={slug}/>;
  }
  else if(route==='/portfolio') page = <Portfolio/>;
  else if(route==='/diensten') page = <Services/>;
  else if(route==='/album') page = <Album/>;
  else if(route==='/digitale-brochure' || route==='/brochure-export') page = <Brochure/>;
  else if(route==='/werkwijze') page = <Werkwijze/>;
  else if(route==='/team') page = <About/>;
  else if(route==='/contact') page = <Contact/>;
  else if(route==='/voorwaarden' || route==='/algemene-voorwaarden') page = <Voorwaarden/>;
  else page = <Home/>;

  return (
    <div key={route}>
      {page}
      <ScrollTopButton/>
      <CookieBanner/>
    </div>
  );
}

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