/* ============================================================
   AfricaMart Admin — auth gate
   Shows a login form until a Supabase session exists, then
   verifies the user has an active row in admin_users before
   rendering the console.
   ============================================================ */
const ROLE_LABELS = {
  super_admin: "Super admin",
  operations: "Operations",
  trust_safety: "Trust & safety",
  finance: "Finance",
  support: "Support",
};

function AdminScreen({ children }) {
  return React.createElement("div", { style: { height: "100vh", display: "flex", alignItems: "center", justifyContent: "center", background: "#F7F4F0", fontFamily: "'Figtree',sans-serif" } },
    React.createElement("div", { style: { width: "min(380px,90vw)", background: "#fff", borderRadius: 14, border: "1px solid #E4DED6", boxShadow: "0 16px 48px rgba(26,22,20,.08)", padding: "28px 28px 24px" } },
      React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 10, marginBottom: 22 } },
        React.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 2.5, width: 22, flexShrink: 0 } },
          React.createElement("div", { style: { width: 9, height: 9, borderRadius: 2, background: "#C5622C" } }),
          React.createElement("div", { style: { width: 9, height: 9, borderRadius: 2, background: "#1E3A4A" } }),
          React.createElement("div", { style: { width: 9, height: 9, borderRadius: 2, background: "#A09288" } }),
          React.createElement("div", { style: { width: 9, height: 9, borderRadius: 2, background: "#C5622C", opacity: .6 } })),
        React.createElement("div", null,
          React.createElement("div", { style: { fontFamily: "'Outfit',sans-serif", fontSize: 16, fontWeight: 700, color: "#1A1614", letterSpacing: "-.01em", lineHeight: 1 } }, "AfricaMart"),
          React.createElement("div", { style: { fontSize: 10, color: "#A09288", marginTop: 2, letterSpacing: ".08em", textTransform: "uppercase", fontWeight: 600 } }, "Admin console"))),
      children));
}

function AdminLoading() {
  return React.createElement(AdminScreen, null,
    React.createElement("div", { style: { fontSize: 13, color: "#857870" } }, "Checking your session…"));
}

function AdminLoginScreen({ onLogin, error, busy }) {
  const [email, setEmail] = aUseState("");
  const [password, setPassword] = aUseState("");
  const inputStyle = { width: "100%", border: "1.5px solid #E4DED6", borderRadius: 8, padding: "9px 12px", fontSize: 13, fontFamily: "'Figtree',sans-serif", color: "#1A1614", outline: "none", boxSizing: "border-box" };
  const labelStyle = { fontSize: 11, fontWeight: 600, color: "#857870", marginBottom: 5, textTransform: "uppercase", letterSpacing: ".04em" };

  const submit = e => {
    e.preventDefault();
    if (!busy) onLogin(email, password);
  };

  return React.createElement(AdminScreen, null,
    React.createElement("form", { onSubmit: submit },
      React.createElement("div", { style: { marginBottom: 12 } },
        React.createElement("div", { style: labelStyle }, "Email"),
        React.createElement("input", { type: "email", value: email, onChange: e => setEmail(e.target.value), required: true, style: inputStyle, placeholder: "you@africamart.com" })),
      React.createElement("div", { style: { marginBottom: 16 } },
        React.createElement("div", { style: labelStyle }, "Password"),
        React.createElement("input", { type: "password", value: password, onChange: e => setPassword(e.target.value), required: true, style: inputStyle, placeholder: "••••••••" })),
      error && React.createElement("div", { style: { fontSize: 12.5, color: "#B91C1C", marginBottom: 14 } }, error),
      React.createElement("button", { type: "submit", disabled: busy, style: { width: "100%", padding: "10px 14px", borderRadius: 8, border: "none", background: "#1E3A4A", color: "#fff", fontSize: 13, fontWeight: 600, cursor: busy ? "default" : "pointer", opacity: busy ? .7 : 1, fontFamily: "'Figtree',sans-serif" } }, busy ? "Signing in…" : "Sign in")));
}

function AdminDeniedScreen({ email, onSignOut }) {
  return React.createElement(AdminScreen, null,
    React.createElement("div", { style: { fontSize: 13, color: "#1A1614", fontWeight: 600, marginBottom: 6 } }, "Access restricted"),
    React.createElement("div", { style: { fontSize: 12.5, color: "#857870", lineHeight: 1.5, marginBottom: 18 } },
      "Signed in as ", React.createElement("strong", null, email), ". This account isn't registered as an admin, or its admin status isn't active yet."),
    React.createElement("button", { onClick: onSignOut, style: { padding: "9px 14px", borderRadius: 8, border: "1.5px solid #E4DED6", background: "#fff", color: "#524940", fontSize: 12.5, fontWeight: 600, cursor: "pointer", fontFamily: "'Figtree',sans-serif" } }, "Sign out"));
}

function AdminGate() {
  const [state, setState] = aUseState("loading"); // loading | login | denied | ready
  const [adminProfile, setAdminProfile] = aUseState(null);
  const [authEmail, setAuthEmail] = aUseState("");
  const [error, setError] = aUseState("");
  const [busy, setBusy] = aUseState(false);

  const check = async () => {
    const session = await window.DB.auth.getSession();
    if (!session) { setState("login"); return; }
    setAuthEmail(session.user.email);
    const profile = await window.DB.admin.getAdminProfile();
    if (!profile || profile.status !== "active") { setAdminProfile(null); setState("denied"); return; }
    setAdminProfile(profile);
    setState("ready");
  };

  aUseEffect(() => { check().catch(() => setState("login")); }, []);

  const handleLogin = async (email, password) => {
    setBusy(true); setError("");
    try {
      await window.DB.auth.signIn(email, password);
      await check();
    } catch (e) {
      setError(e.message || "Sign-in failed");
    } finally {
      setBusy(false);
    }
  };

  const handleSignOut = async () => {
    await window.DB.auth.signOut();
    setAdminProfile(null);
    setState("login");
  };

  if (state === "loading") return React.createElement(AdminLoading);
  if (state === "login") return React.createElement(AdminLoginScreen, { onLogin: handleLogin, error, busy });
  if (state === "denied") return React.createElement(AdminDeniedScreen, { email: authEmail, onSignOut: handleSignOut });
  return React.createElement(AdminApp, { adminProfile, onSignOut: handleSignOut });
}

ReactDOM.createRoot(document.getElementById("admin-root")).render(React.createElement(AdminGate));