// Top-level <Site/>. Reads the route, renders header + page + footer.

(function () {
  window.Site = function Site() {
    const { page, param } = window.useRoute();

    let body = null;
    if (page === 'home')     body = <window.HomePage />;
    else if (page === 'category') body = <window.CategoryPage slug={param} />;
    else if (page === 'product')  body = <window.ProductPage sku={param} />;
    else if (page === 'contact')  body = <window.ContactPage />;
    else                          body = <window.HomePage />;

    return (
      <>
        <window.TopBar />
        <window.SiteHeader />
        <main id="main">{body}</main>
        <window.SiteFooter />
      </>
    );
  };
})();
