Source

// A tiny path router: the site is static, so every path serves index.html and the app reads the URL.
import { useEffect, useState } from "react";

/** Goes to a page. replace swaps the current history entry, so a link's secret does not stay in history. */
export function navigate(to: string, replace = false) {
  if (to === location.pathname + location.search + location.hash) return;
  if (replace) history.replaceState(null, "", to);
  else history.pushState(null, "", to);
  window.dispatchEvent(new PopStateEvent("popstate"));
  window.scrollTo(0, 0);
}

export function usePath(): string {
  const [path, setPath] = useState(location.pathname);
  useEffect(() => {
    const onPop = () => setPath(location.pathname);
    window.addEventListener("popstate", onPop);
    return () => window.removeEventListener("popstate", onPop);
  }, []);
  return path;
}