// ═══════════════════════════════════════════════════════════════════
// ADMINISTRATION — platform-operator view.
// Tenants & their projects · members & roles · pipeline policy.
// ═══════════════════════════════════════════════════════════════════
(function () {
  const I = window.INTEL;
  const { useState } = React;

  const ROLE_TONE = { Owner: "accent", Analyst: "info", Reviewer: "warn", Viewer: "neutral" };
  const PLAN_TONE = { Enterprise: "accent", Growth: "info", Pilot: "neutral" };

  function TenantBlock({ t, onOpen }) {
    const projects = I.projectsFor(t.id);
    const members = I.MEMBERS.filter((m) => m.tenant === t.id).length;
    const ACLS = (window.REPORT_SCHEMA && window.REPORT_SCHEMA.ASSET_CLASSES) || [];
    const [, force] = useState(0);
    return (
      <div style={{ border: "1px solid var(--rule-hard)", borderRadius: "var(--r-3)", overflow: "hidden", marginBottom: 14 }}>
        <div style={{ display: "flex", alignItems: "center", gap: 10, padding: "11px 14px", background: "var(--bg-2)", borderBottom: "1px solid var(--rule-hard)" }}>
          <span style={{ width: 26, height: 26, borderRadius: 6, background: "var(--ink)", color: "#fff", display: "grid", placeItems: "center", fontFamily: "var(--ui-display)", fontWeight: 700, fontSize: 13, flex: "0 0 auto" }}>{t.short}</span>
          <span style={{ fontFamily: "var(--ui-display)", fontWeight: 600, fontSize: "var(--fs-base)", color: "var(--ink)", whiteSpace: "nowrap" }}>{t.name}</span>
          <window.Pill tone={PLAN_TONE[t.plan] || "neutral"}>{t.plan}</window.Pill>
          <span style={{ marginLeft: "auto", fontFamily: "var(--mono)", fontSize: "9px", letterSpacing: "0.08em", textTransform: "uppercase", color: "var(--ink-4)" }}>
            {t.domain} · {members} members · {t.seats} seats · {projects.length} {projects.length === 1 ? "project" : "projects"}
          </span>
        </div>
        <div style={{ display: "grid", gridTemplateColumns: "1.3fr 1fr 148px 92px 74px 60px 86px", gap: 1, background: "var(--rule)" }}>
          {["Project", "Subject", "Asset class", "Stage", "Artifacts", "Facts", "Last run"].map((h, i) => (
            <div key={i} style={{ background: "var(--bg-2)", padding: "7px 12px" }}><window.MonoLabel>{h}</window.MonoLabel></div>
          ))}
          {projects.map((p) => {
            const stage = I.STAGES[p.stage];
            const cls = window.AssetClass ? window.AssetClass.of(p) : "equity";
            return (
              <React.Fragment key={p.id}>
                <div style={{ background: "var(--bg)", padding: "9px 12px" }}>
                  <button onClick={() => onOpen(t.id, p.id)} title={"Open " + p.name} style={{ border: "none", background: "transparent", padding: 0, cursor: "pointer", textAlign: "left", fontFamily: "var(--ui-display)", fontWeight: 600, fontSize: "var(--fs-sm)", color: "var(--accent-lo)", lineHeight: 1.4 }}>{p.name}</button>
                </div>
                <div style={{ background: "var(--bg)", padding: "9px 12px", fontSize: "var(--fs-xs)", color: "var(--ink-3)", lineHeight: 1.5 }}>{p.subject}</div>
                <div style={{ background: "var(--bg)", padding: "6px 10px", display: "flex", alignItems: "center" }}>
                  <select value={cls} onChange={(e) => { if (window.AssetClass) window.AssetClass.set(p.id, e.target.value); force((x) => x + 1); }} title="Asset class drives this project's report structure (RS-10/11/12)" style={{ width: "100%", border: "1px solid var(--rule-hard)", borderRadius: "var(--r-1)", background: "var(--bg)", color: "var(--ink-2)", fontFamily: "var(--mono)", fontSize: "9.5px", fontWeight: 600, padding: "4px 6px", cursor: "pointer" }}>
                    {ACLS.map((c) => <option key={c.id} value={c.id}>{c.name}</option>)}
                  </select>
                </div>
                <div style={{ background: "var(--bg)", padding: "9px 12px" }}><window.Pill tone={stage.tone}>{stage.label}</window.Pill></div>
                <div style={{ background: "var(--bg)", padding: "9px 12px", fontFamily: "var(--mono)", fontSize: "11px", fontWeight: 600, color: "var(--ink-2)" }}>{p.stats.artifacts}</div>
                <div style={{ background: "var(--bg)", padding: "9px 12px", fontFamily: "var(--mono)", fontSize: "11px", fontWeight: 600, color: "var(--ink-2)" }}>{p.stats.datapoints}</div>
                <div style={{ background: "var(--bg)", padding: "9px 12px", fontSize: "var(--fs-xs)", color: "var(--ink-3)", whiteSpace: "nowrap" }}>{p.lastRun}</div>
              </React.Fragment>
            );
          })}
        </div>
      </div>
    );
  }

  function IntelAdmin({ proj, tenant, go, onSwitch }) {
    return (
      <div>
        <window.PageHead eyebrow="Platform administration" title="Administration"
          sub="Operator view across every tenant — workspaces, projects and their pipeline state, members and roles, and the pipeline policy every run obeys.">
        </window.PageHead>

        <window.SectionHead sub={I.TENANTS.length + " tenants · " + I.PROJECTS.length + " projects · assign each project's asset class — it drives the report structure (RS-10/11/12); isolation per tenant, knowledge never shared across workspaces"}>Tenants &amp; Projects</window.SectionHead>
        {I.TENANTS.map((t) => <TenantBlock key={t.id} t={t} onOpen={(tid, pid) => onSwitch(tid, pid, "report")}></TenantBlock>)}

        <window.SectionHead sub="role gates: Owner administers · Analyst runs the pipeline · Reviewer signs the publish gate · Viewer reads">Members &amp; Roles</window.SectionHead>
        <div style={{ border: "1px solid var(--rule-hard)", borderRadius: "var(--r-3)", overflow: "hidden", marginBottom: 22 }}>
          <div style={{ display: "grid", gridTemplateColumns: "1fr 1.3fr 130px 96px 64px 92px", gap: 1, background: "var(--rule)" }}>
            {["Member", "Email", "Tenant", "Role", "MFA", "Last active"].map((h) => (
              <div key={h} style={{ background: "var(--bg-2)", padding: "8px 12px" }}><window.MonoLabel>{h}</window.MonoLabel></div>
            ))}
            {I.MEMBERS.map((m) => {
              const t = I.TENANTS.find((x) => x.id === m.tenant);
              return (
                <React.Fragment key={m.email}>
                  <div style={{ background: "var(--bg)", padding: "9px 12px", fontSize: "var(--fs-sm)", fontWeight: 500, color: "var(--ink)" }}>{m.name}</div>
                  <div style={{ background: "var(--bg)", padding: "9px 12px", fontFamily: "var(--mono)", fontSize: "10px", color: "var(--ink-4)" }}>{m.email}</div>
                  <div style={{ background: "var(--bg)", padding: "9px 12px", fontSize: "var(--fs-xs)", color: "var(--ink-3)" }}>{t ? t.name : m.tenant}</div>
                  <div style={{ background: "var(--bg)", padding: "9px 12px" }}><window.Pill tone={ROLE_TONE[m.role] || "neutral"}>{m.role}</window.Pill></div>
                  <div style={{ background: "var(--bg)", padding: "9px 12px" }}><window.Pill tone={m.mfa ? "ok" : "err"}>{m.mfa ? "on" : "off"}</window.Pill></div>
                  <div style={{ background: "var(--bg)", padding: "9px 12px", fontSize: "var(--fs-xs)", color: "var(--ink-3)" }}>{m.active}</div>
                </React.Fragment>
              );
            })}
          </div>
        </div>

        <window.SectionHead sub="platform defaults · every tenant's runs obey these — overrides require an Owner + audit entry">Pipeline Policy</window.SectionHead>
        <div style={{ border: "1px solid var(--rule-hard)", borderRadius: "var(--r-3)", overflow: "hidden" }}>
          <div style={{ display: "grid", gridTemplateColumns: "180px 1fr 170px", gap: 1, background: "var(--rule)" }}>
            {["Stage", "Policy", "Assigned"].map((h) => (
              <div key={h} style={{ background: "var(--bg-2)", padding: "8px 12px" }}><window.MonoLabel>{h}</window.MonoLabel></div>
            ))}
            {I.PIPELINE_POLICY.map((r) => (
              <React.Fragment key={r.stage}>
                <div style={{ background: "var(--bg)", padding: "9px 12px", fontSize: "var(--fs-sm)", fontWeight: 500, color: "var(--ink)" }}>{r.stage}</div>
                <div style={{ background: "var(--bg)", padding: "9px 12px", fontSize: "var(--fs-xs)", color: "var(--ink-2)", lineHeight: 1.55 }}>{r.policy}</div>
                <div style={{ background: "var(--bg)", padding: "9px 12px", fontFamily: "var(--mono)", fontSize: "10px", color: "var(--ink-4)" }}>{r.agent}</div>
              </React.Fragment>
            ))}
          </div>
        </div>
      </div>
    );
  }

  window.IntelAdmin = IntelAdmin;
})();
