// app.jsx — top-level router
const { useState: useAppState, useEffect: useAppEffect } = React;

function getRoute() {
  const m = window.location.pathname.match(/^\/invite\/([a-f0-9]+)$/i);
  if (m) return { name: "invite", token: m[1] };
  if (window.location.pathname.startsWith("/admin")) return { name: "admin" };
  return { name: "portal" };
}

function App() {
  const [user, setUser] = useAppState(undefined); // undefined = loading, null = logged out
  const [route, setRoute] = useAppState(getRoute());

  useAppEffect(() => {
    window.api.get("/auth/me")
      .then(({ user }) => {
        setUser(user);
        if (user && user.tenant) window.applyBrand(user.tenant);
      })
      .catch(() => setUser(null));

    const onPop = () => setRoute(getRoute());
    window.addEventListener("popstate", onPop);
    return () => window.removeEventListener("popstate", onPop);
  }, []);

  function navigate(path) {
    window.history.pushState({}, "", path);
    setRoute(getRoute());
  }

  async function logout() {
    await window.api.post("/auth/logout");
    setUser(null);
    navigate("/");
  }

  function handleLogin(u) {
    setUser(u);
    if (u && u.tenant) window.applyBrand(u.tenant);
    navigate("/");
  }

  if (user === undefined) {
    return <div className="loading-page"><div className="spinner" /></div>;
  }

  // /invite/:token — public, no auth required
  if (route.name === "invite") {
    return <window.InvitePage token={route.token} onClaim={handleLogin} />;
  }

  if (!user) {
    return <window.LoginPage onLogin={handleLogin} />;
  }

  if (route.name === "admin") {
    return <window.AdminShell user={user} onBack={() => navigate("/")} onLogout={logout} />;
  }

  return (
    <window.PortalShell
      user={user}
      onLogout={logout}
      onOpenAdmin={() => navigate("/admin")}
    />
  );
}

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