import React, { useEffect, useState } from "react";
import ReactDOM from "react-dom/client";

import App from "./app/layout";
import Home from "./app/page";
import Careers from "./app/careers/page";
import Apply from "./app/apply/page";
import Submitted from "./app/submitted/page";


function Router() {
  const [hash, setHash] = useState(window.location.hash);

  useEffect(() => {
    const onHashChange = () => setHash(window.location.hash);

    window.addEventListener("hashchange", onHashChange);

    return () => {
      window.removeEventListener("hashchange", onHashChange);
    };
  }, []);


  if (hash === "#careers") {
    return  <Careers />;
  }

  if (hash === "#apply") {
    return  <Apply />;
  }

  if (hash === "#submitted") {
    return  <Submitted />;
  }

  return <Home />
}

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