// SF Logistics — root app
const { useState: useAppState, useEffect: useAppEffect } = React;

function App() {
  const [page, setPage] = React.useState(() => {
    const hash = window.location.hash.replace("#","");
    return ["landing","apply","crm"].includes(hash) ? hash : "landing";
  });
  React.useEffect(() => {
    window.location.hash = page;
    window.scrollTo({ top: 0, behavior: "instant" });
  }, [page]);
  return (
    <div data-screen-label={`page-${page}`}>
      <TopNav page={page} setPage={setPage} />
      {page === "landing" && <Landing setPage={setPage} />}
      {page === "apply" && <ApplyFlow setPage={setPage} />}
      {page === "crm" && <CrmConsole />}
    </div>
  );
}

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