// Fin45 — site router & main app
const {
  TickerStrip, TopNav, ScoreboardStrip, Footer,
  PageHome, PageToday, PageArchive, PagePortfolio, PageLookback, PageAbout,
  PageMethodology, PageChangelog, PageReportCard, Page404,
  PageTrackers, PageTrackerDetail,
  PageLegal, PagePrivacy, PageTerms,
} = window;

function useHashRoute() {
  const get = () => (window.location.hash || '#/').replace(/^#/, '') || '/';
  const [r, setR] = React.useState(get);
  React.useEffect(() => {
    const on = () => setR(get());
    window.addEventListener('hashchange', on);
    return () => window.removeEventListener('hashchange', on);
  }, []);
  return r;
}

function FinSite() {
  const route = useHashRoute();
  const path = route.split('#')[0];
  React.useEffect(() => { window.scrollTo({ top: 0, behavior: 'instant' }); }, [path]);

  let body;
  if      (path === '/' || path === '')        body = <PageHome />;
  else if (path.startsWith('/today'))           body = <PageToday />;
  else if (path.startsWith('/archive'))         body = <PageArchive />;
  else if (path.startsWith('/portfolio'))       body = <PagePortfolio />;
  else if (path.startsWith('/lookback'))        body = <PageLookback />;
  else if (path.startsWith('/methodology'))     body = <PageMethodology />;
  else if (path.startsWith('/changelog'))       body = <PageChangelog />;
  else if (path.startsWith('/report-card'))     body = <PageReportCard />;
  else if (path.startsWith('/tracker/')) {
    const slug = path.replace('/tracker/', '').split('/')[0];
    body = <PageTrackerDetail slug={slug} />;
  }
  else if (path.startsWith('/trackers'))        body = <PageTrackers />;
  else if (path.startsWith('/legal'))           body = <PageLegal />;
  else if (path.startsWith('/privacy'))         body = <PagePrivacy />;
  else if (path.startsWith('/terms'))           body = <PageTerms />;
  else if (path.startsWith('/about'))           body = <PageAbout />;
  else                                          body = <Page404 />;

  return (
    <>
      <TickerStrip />
      <TopNav />
      <ScoreboardStrip />
      {body}
      <Footer />
    </>
  );
}

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