// App bootstrap — route switch + document titles. Referenced by the SPA shell
// (index.html) and by every pre-rendered page (see tools/prerender.py), so it
// lives in its own file rather than inline in index.html.

const PAGE_TITLES = {
  home:          "Paediatric Occupational Therapy Melbourne | Kid Link OT Mitcham",
  parents:       "Child Occupational Therapy for Families | Kid Link OT Melbourne",
  clinicians:    "OT Supervision, Courses & Mentoring | Kid Link Occupational Therapy",
  educators:     "OT Services for Schools & Early Childhood | Kid Link Melbourne",
  organisations: "Paediatric OT Consulting & Speaking | Kid Link Occupational Therapy",
  team:          "Meet Our Occupational Therapists | Kid Link OT Melbourne",
  events:        "Workshops, Webinars & Events | Kid Link Occupational Therapy",
  fees:          "Fees & Funding: NDIS, Medicare, Private | Kid Link OT",
  policies:      "Policies & Procedures | Kid Link Occupational Therapy",
};

function App() {
  const { route } = useRoute();
  useEffect(() => { document.title = PAGE_TITLES[route] || PAGE_TITLES.home; }, [route]);
  let body;
  switch (route) {
    case "parents":       body = <ParentsPage />; break;
    case "clinicians":    body = <CliniciansPage />; break;
    case "educators":     body = <EducatorsPage />; break;
    case "organisations": body = <OrganisationsPage />; break;
    case "team":          body = <TeamPage />; break;
    case "events":        body = <EventsPage />; break;
    case "fees":          body = <FeesPage />; break;
    case "policies":      body = <PoliciesPage />; break;
    default:              body = <HomePage />;
  }
  return (
    <>
      <a href="#main-content" className="kl-skip">Skip to content</a>
      <Navbar />
      <main id="main-content">{body}</main>
      <Footer />
      <AccessibilityWidget />
    </>
  );
}

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