/* App.jsx — root router. Brand-agnostic; reads window.Portal.
   Routes (hash):
     #/apply                  Stage 1 (summary → form → success)
     #/apply/property/:slug   Stage 1 for a property
     #/apply/2/:applicationId Stage 2 wizard (magic-link auth)
     #/admin[...]             Admin dashboard
*/
/* eslint-disable */
const { useState: useApp, useEffect: useAppE } = React;

function PublicShell({ children, light }) {
  return (
    <div className="app-shell">
      <Nav light={light} />
      <main className="app-main">{children}</main>
      <Footer />
    </div>
  );
}

function Stage1Flow({ slug }) {
  const [view, setView] = useApp("summary"); // summary | form | success
  const [submitted, setSubmitted] = useApp(null);

  function start() {
    setView("form");
    setTimeout(() => { const el = document.querySelector(".form-stage"); if (el) el.scrollIntoView({ behavior: "smooth" }); }, 40);
  }
  function done(info) { setSubmitted(info); setView("success"); window.scrollTo({ top: 0, behavior: "smooth" }); }

  if (view === "summary") return <PublicShell><PropertySummary slug={slug} onStart={start} /></PublicShell>;
  if (view === "form") return <PublicShell light><Stage1Form slug={slug} onSubmitted={done} /></PublicShell>;
  const first = (submitted && submitted.full_name ? submitted.full_name.split(" ")[0] : "");
  return <PublicShell light><SuccessState firstName={first} email={submitted && submitted.email} /></PublicShell>;
}

function App() {
  const route = Portal.useRoute();

  // Handle Supabase magic-link return: it lands with #access_token=…;
  // once the session resolves, send the user to their stored Stage-2 app.
  useAppE(() => {
    if (route.route !== "stage2-auth") return;
    const sb = window.portalSupabase;
    const dest = localStorage.getItem("portal_post_login") || "#/apply";
    if (!sb) { Portal.navigate(dest); return; }
    sb.auth.getSession().then(() => { localStorage.removeItem("portal_post_login"); Portal.navigate(dest); });
  }, [route.route]);

  switch (route.route) {
    case "stage1":
      return <Stage1Flow slug={route.params.slug} />;
    case "stage2":
      return typeof Stage2Wizard !== "undefined"
        ? <Stage2Wizard applicationId={route.params.applicationId} />
        : <PublicShell light><div className="center-load">Stage 2 unavailable</div></PublicShell>;
    case "admin":
    case "admin-detail":
    case "admin-users":
      return typeof Admin !== "undefined"
        ? <Admin route={route} />
        : <div className="center-load">Admin unavailable</div>;
    case "stage2-auth":
      return <div className="center-load"><span className="spinner" />Signing you in…</div>;
    default:
      return <Stage1Flow />;
  }
}

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