/* === APP SHELL — router + page transitions === */

const { useEffect: apEffect, useState: apState } = React;

function PageWrap({ children, routeKey }) {
  return (
    <main key={routeKey} style={{ minHeight: "60vh" }}>
      {children}
    </main>
  );
}

function App() {
  const route = window.useRoute();
  const { name, slug, path } = route;

  let page;
  switch (name) {
    case "home":       page = <window.HomePage />; break;
    case "services":   page = <window.ServicesPage slug={slug} />; break;
    case "work":       page = <window.WorkPage slug={slug} />; break;
    case "industries": page = <window.IndustriesPage slug={slug} />; break;
    case "logistics":  page = <window.LogisticsPage />; break;
    case "company":    page = <window.CompanyPage />; break;
    case "contact":    page = <window.ContactPage />; break;
    default:           page = <window.NotFoundPage label="Такой страницы нет" />;
  }

  return (
    <>
      <window.Nav />
      <PageWrap routeKey={path}>{page}</PageWrap>
      <window.Footer />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("app")).render(<App />);