/* App entry with router */

function App() {
  const [route, setRoute] = useState(() => {
    const h = window.location.hash.replace("#", "");
    if (h === "start" || h === "hackathon") return h;
    return "home";
  });

  const navigate = (r) => {
    setRoute(r);
    window.location.hash = r === "home" ? "" : r;
  };

  useEffect(() => {
    const onHash = () => {
      const h = window.location.hash.replace("#", "");
      if (h === "start" || h === "hackathon") setRoute(h);
      else if (h === "" || h === "home") setRoute("home");
    };
    window.addEventListener("hashchange", onHash);
    return () => window.removeEventListener("hashchange", onHash);
  }, []);

  return (
    <LangProvider>
      <Cursor />
      <Nav route={route} navigate={navigate} />
      {route === "home" && (
        <>
          <Hero navigate={navigate} />
          <Marquee />
          <Metrics />
          <Services />
          <Process />
          <About />
          <Industries />
          <FAQ />
          <CTA navigate={navigate} />
        </>
      )}
      {route === "start" && <GetStartedPage />}
      {route === "hackathon" && <HackathonPage />}
      <Footer navigate={navigate} />
    </LangProvider>
  );
}

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