/* ============================================================
   ONLYCLEAN — Router + mount (app/main.jsx)
   Rutas:  #/        → app del cliente (login email+contraseña)
           #/admin   → panel de administración (login protegido)
   La sesión se guarda en localStorage para sobrevivir refrescos.
   ============================================================ */
const SESSION_KEY = "onlyclean_session_v1";

function loadSession() {
  try { return JSON.parse(localStorage.getItem(SESSION_KEY)) || null; } catch (e) { return null; }
}
function saveSession(s) {
  if (s) localStorage.setItem(SESSION_KEY, JSON.stringify(s));
  else localStorage.removeItem(SESSION_KEY);
}

function Root() {
  const [hash, setHash] = useState(window.location.hash || "#/");
  const [session, setSession] = useState(loadSession);

  useEffect(() => {
    const onHash = () => setHash(window.location.hash || "#/");
    window.addEventListener("hashchange", onHash);
    return () => window.removeEventListener("hashchange", onHash);
  }, []);

  const isAdminRoute = hash.startsWith("#/admin");

  function handleLogin(res) {
    let s;
    if (res.role === "superadmin") s = { role: "superadmin" };
    else if (res.role === "coach") s = { role: "coach", coachId: res.coachId, blocked: res.blocked };
    else s = { role: "client", clientId: res.clientId };
    saveSession(s); setSession(s);
    const adminRole = res.role === "superadmin" || res.role === "coach";
    if (adminRole && !isAdminRoute) window.location.hash = "#/admin";
    if (res.role === "client" && isAdminRoute) window.location.hash = "#/";
  }
  function logout() { saveSession(null); setSession(null); }

  // ----- Admin area (coach + súper admin) -----
  if (isAdminRoute) {
    if (session?.role === "superadmin") return <SuperAdminApp onLogout={() => { logout(); window.location.hash = "#/admin"; }} />;
    if (session?.role === "coach") {
      if (session.blocked) return <CoachBlocked onLogout={() => { logout(); window.location.hash = "#/admin"; }} />;
      return <AdminApp coachId={session.coachId} onLogout={() => { logout(); window.location.hash = "#/admin"; }} />;
    }
    return <LoginScreen onLogin={handleLogin} />;
  }

  // ----- Client area -----
  if (session?.role === "client") return <ClientApp clientId={session.clientId} onLogout={logout} />;
  if (session?.role === "coach" || session?.role === "superadmin") {
    // admin landed on client root → send them to the panel
    return (
      <Phone><Screen><div className="pad" style={{ margin: "auto", textAlign: "center" }}>
        <p className="lead">Sesión de {session.role === "superadmin" ? "súper administrador" : "coach"} activa.</p>
        <Pill style={{ marginTop: 14 }} onClick={() => { window.location.hash = "#/admin"; }}>Ir al panel</Pill>
        <div style={{ marginTop: 10 }}><button className="back-pill" onClick={logout}>Cerrar sesión</button></div>
      </div></Screen></Phone>
    );
  }
  return <LoginScreen onLogin={handleLogin} />;
}

/* coach con acceso bloqueado por el súper admin */
function CoachBlocked({ onLogout }) {
  return (
    <Phone><Screen><div className="blocked">
      <img className="blocked-logo" src="assets/logo-word.svg" alt="ONLYCLEAN" />
      <div className="blocked-msg">
        <span className="blocked-ic"><Icon name="lock" /></span>
        <p>Tu acceso de coach está deshabilitado. Contacta al administrador.</p>
      </div>
      <button className="back-pill" onClick={onLogout}><Icon name="logout" style={{ width: 15, height: 15 }} /> Salir</button>
    </div></Screen></Phone>
  );
}

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