function App() {
  const { path, query } = useRoute();
  const pageLabel =
    path === "/" ? "01 Home"
    : path === "/about" ? "02 About"
    : path === "/packages" ? "03 Packages"
    : path === "/how-it-works" ? "04 How It Works"
    : path === "/quote" ? "05 Quote Request"
    : path === "/contact" ? "06 Contact"
    : path.startsWith("/services") ? "07 Service Detail"
    : "X Misc";

  let page;
  if (path === "/") page = <HomePage />;
  else if (path === "/about") page = <AboutPage />;
  else if (path === "/packages") page = <PackagesPage />;
  else if (path === "/quote") page = <QuoteRequestPage initial={query} />;
  else if (path === "/contact") page = <ContactPage />;
  else if (path === "/how-it-works") page = <HowItWorksPage />;
  else if (path.startsWith("/services/garage-reset")) page = <GarageResetServicePage />;
  else if (path.startsWith("/services/garage-clean-out")) page = <GarageCleanOutServicePage />;
  else if (path.startsWith("/services/donation-recycling")) page = <DonationRecyclingPage />;
  else if (path === "/terms") page = <StubPage title="Terms & Conditions" />;
  else if (path === "/privacy") page = <StubPage title="Privacy Policy" />;
  else page = <StubPage title="Page not found" />;

  return <div data-screen-label={pageLabel}><Header currentPath={path} /><main>{page}</main><Footer /><MobileCTABar /></div>;
}

if (!window.location.hash) window.location.hash = "#/";
ReactDOM.createRoot(document.getElementById("root")).render(<App />);
