/* SkyOps — New inspection wizard + global modal host.
   3 steps: Site & date → Inherit from last cycle → Confirm. Creates a draft MIC and opens Plan. */

const { useState: uSNI, useEffect: uENI } = React;

(() => { try { const s = JSON.parse(localStorage.getItem("skyops_new_insps") || "[]"); s.forEach(i => { if (!(window.INSPECTIONS || []).find(x => x.id === i.id)) window.INSPECTIONS.push(i); }); } catch {} })();

(() => { try { const o = JSON.parse(localStorage.getItem("skyops_mic_state") || "{}"); (window.INSPECTIONS || []).forEach(m => { if (o[m.id]) Object.assign(m, o[m.id]); }); } catch {} })();
window.saveMicState = (m) => { try { const o = JSON.parse(localStorage.getItem("skyops_mic_state") || "{}"); o[m.id] = { status: m.status, progress: m.progress, zones: m.zones, area_ha: m.area_ha, flights: m.flights, committedAt: m.committedAt, detections: m.detections, critical: m.critical, coverage: m.coverage, gsd: m.gsd, images: m.images, bytes: m.bytes, startedAt: m.startedAt }; localStorage.setItem("skyops_mic_state", JSON.stringify(o)); } catch {} };
function niAddDays(d, n) { const t = new Date(d + "T00:00:00"); t.setDate(t.getDate() + n); return t.toISOString().slice(0, 10); }
function niCycle(d) { const [y, m] = d.split("-").map(Number); return `Q${Math.ceil(m / 3)} ${y}`; }

function NewInspectionModal({ prefill, onClose, onCreated }) {
  const sites = window.SITES || [];
  const [step, setStep] = uSNI(0);
  const [siteId, setSiteId] = uSNI(prefill.siteId || sites[0]?.id);
  const prev = (window.INSPECTIONS || []).filter(i => i.siteId === siteId && i.status !== "draft" && i.status !== "scheduled")
    .sort((a, b) => (b.startedAt || "").localeCompare(a.startedAt || ""))[0];
  const rec = prev?.startedAt ? niAddDays(prev.startedAt, 90) : "2026-05-15";
  const sched = (window.INSPECTIONS || []).find(i => i.siteId === siteId && (i.status === "scheduled" || i.status === "draft") && i.plannedFor);
  const [date, setDate] = uSNI(prefill.date || rec);
  uENI(() => { if (!prefill.date) setDate(rec); }, [siteId]);
  const [purpose, setPurpose] = uSNI("Routine");
  const [pilot, setPilot] = uSNI("T. Aragón");
  const [drone, setDrone] = uSNI(() => { const d = (window.resDrones ? window.resDrones() : []).find(x => x.status === "available"); return d ? window.droneLabel(d) : "DJI M350 RTK · H30T"; });
  const openWos = (window.woStore?.list || []).filter(w => w.siteId === siteId && w.status !== "verified");
  const [inh, setInh] = uSNI({ thresholds: true, aoi: true, wos: true, gaps: true });
  const site = sites.find(s => s.id === siteId);

  const create = () => {
    const [y, m] = date.split("-");
    const n = 41 + (window.INSPECTIONS || []).filter(i => i.id.startsWith(`MIC-${y}`)).length;
    const mic = {
      id: `MIC-${y}-${m}-${String(n).padStart(3, "0")}`, siteId, cycle: niCycle(date), status: "draft",
      startedAt: null, plannedFor: date, baseline: prev?.id || null, purpose,
      coverage: 0, detections: 0, critical: 0, lead: pilot, drone,
      progress: { draft: 1, scheduled: 0, flying: 0, processing: 0, review: 0, reported: 0, closed: 0 },
      flights: 0, images: 0, bytes: 0, gsd: null, area_ha: prev?.area_ha || 400,
      verifyWos: inh.wos ? openWos.map(w => w.id) : [],
    };
    window.INSPECTIONS.push(mic);
    try { const s = JSON.parse(localStorage.getItem("skyops_new_insps") || "[]"); s.push(mic); localStorage.setItem("skyops_new_insps", JSON.stringify(s)); } catch {}
    onCreated(mic);
  };

  const steps = ["Site & date", "Inherit", "Confirm"];
  return (
    <div className="ni-scrim" onClick={() => onClose()}>
      <div className="ni-modal" onClick={e => e.stopPropagation()} role="dialog" aria-label="New inspection">
        <div className="ni-hd"><div><div className="kicker">New inspection</div><h3>{site?.name}</h3></div><button className="ask-hd-btn" onClick={() => onClose()}><Icon name="x" size={13}/></button></div>
        <div className="ni-steps">{steps.map((s, i) => <span key={s} className={`ni-step ${i === step ? "on" : ""} ${i < step ? "done" : ""}`}><i>{i < step ? <Icon name="check" size={9}/> : i + 1}</i>{s}</span>)}</div>

        {step === 0 && <div className="ni-body ni-grid">
          <label className="field ni-span"><span>Site</span><select className="sel" value={siteId} onChange={e => setSiteId(e.target.value)}>{sites.map(s => <option key={s.id} value={s.id}>{s.name} · {s.region}</option>)}</select></label>
          <div className="field ni-span"><span>Purpose</span><div className="ps-seg">{["Routine", "Warranty claim", "Post-incident", "Commissioning"].map(p => <button key={p} className={purpose === p ? "on" : ""} onClick={() => setPurpose(p)}>{p}</button>)}</div></div>
          <label className="field"><span>Flight date</span><input className="inp" type="date" value={date} onChange={e => setDate(e.target.value)}/>
            <span className="hint">{date === rec ? "Recommended · 90-day cadence from last cycle" : `Recommended ${rec}`}</span>
            {sched && <span className="ni-warn"><Icon name="alert" size={10}/>{sched.id} already planned for {sched.plannedFor} — <a href="#" onClick={(e) => { e.preventDefault(); onClose(); window.dispatchEvent(new CustomEvent("skyops:open-mic", { detail: sched })); }}>open it instead</a></span>}</label>
          <label className="field"><span>Pilot</span><select className="sel" value={pilot} onChange={e => setPilot(e.target.value)}>{(window.resPilots ? window.resPilots() : []).map(p => <option key={p.id} value={p.name}>{p.name} · {window.RES_KIND[p.kind]}{p.kind === "contractor" ? " (" + p.org + ")" : ""} · {p.status.replace("_", " ")}</option>)}</select></label>
          <label className="field"><span>Platform</span><select className="sel" value={drone} onChange={e => setDrone(e.target.value)}>{(window.resDrones ? window.resDrones() : []).map(d => <option key={d.id} value={window.droneLabel(d)} disabled={["maintenance","grounded","retired"].includes(d.status)}>{window.droneLabel(d)} · {d.status}</option>)}</select></label>
          <div className="field"><span>Cycle</span><div className="inp mono">{niCycle(date)}</div></div>
        </div>}

        {step === 1 && <div className="ni-body">
          <div className="ni-base">{prev ? <>Baseline <b className="mono">{prev.id}</b> · {prev.cycle} · {prev.detections.toLocaleString()} detections · {prev.coverage}% coverage</> : "No previous inspection — this will be the first baseline."}</div>
          {[
            ["thresholds", "Thresholds", "Hot-cell ΔT, soiling index, coverage target from the last MIC"],
            ["aoi", "Area & flight plan", `AOI polygon and routes · ${prev?.flights || 12} sorties`],
            ["wos", "Verify open work orders", `${openWos.length} work orders to confirm in this flight`],
            ["gaps", "Re-fly coverage gaps", "Sectors below coverage target last cycle"],
          ].map(([k, t, d]) => (
            <label key={k} className={`ni-inh ${inh[k] ? "on" : ""}`}>
              <input type="checkbox" checked={inh[k]} onChange={() => setInh(x => ({ ...x, [k]: !x[k] }))}/>
              <span><b>{t}</b><em>{d}</em></span>
            </label>
          ))}
          {inh.wos && openWos.length > 0 && <div className="ni-wos">{openWos.slice(0, 4).map(w => <span key={w.id} className="mono">{w.id} · {w.title.split(" — ")[0]}</span>)}</div>}
        </div>}

        {step === 2 && <div className="ni-body">
          <div className="ni-sum">
            {[["Site", site?.name], ["Purpose", purpose], ["Flight date", date], ["Cycle", niCycle(date)], ["Pilot · platform", `${pilot} · ${drone}`], ["Baseline", prev?.id || "none"],
              ["Inherited", Object.entries(inh).filter(([, v]) => v).map(([k]) => ({ thresholds: "thresholds", aoi: "AOI & routes", wos: `${openWos.length} WOs to verify`, gaps: "gap re-fly" })[k]).join(" · ") || "nothing"]].map(([k, v]) => (
              <div key={k} className="ps-kv"><span>{k}</span><b>{v}</b></div>
            ))}
          </div>
          <p className="sec ni-note">Creates a draft inspection and opens stage 1 · Plan. It appears in the site calendar and inspection list.</p>
        </div>}

        <div className="ni-ft">
          {step > 0 && <button className="btn btn-ghost" onClick={() => setStep(step - 1)}>Back</button>}
          <span className="grow"/>
          <button className="btn btn-ghost" onClick={() => onClose()}>Cancel</button>
          {step < 2 ? <button className="btn btn-primary" onClick={() => setStep(step + 1)}>Next<Icon name="arrow_right" size={12}/></button>
            : <button className="btn btn-primary" onClick={create}><Icon name="check" size={12}/>Create & open plan</button>}
        </div>
      </div>
    </div>
  );
}

/* Global host — listens to skyops:new-insp / skyops:new-wo events from anywhere */
function GlobalModals({ go, setActiveSite, setActiveMic, setWsStage }) {
  const [ni, setNi] = uSNI(null);
  const [wo, setWo] = uSNI(null);
  const [toast, setToast] = uSNI(null);
  uENI(() => {
    const a = (e) => setNi(e.detail || {});
    const b = (e) => setWo(e.detail || {});
    window.addEventListener("skyops:new-insp", a);
    window.addEventListener("skyops:new-wo", b);
    const c = (e) => { const m = e.detail; setActiveSite(m.siteId); setActiveMic(m.id); setWsStage("plan"); go("workspace"); };
    window.addEventListener("skyops:open-mic", c);
    const tst = (e) => { setToast(e.detail); setTimeout(() => setToast(null), 2600); };
    window.addEventListener("skyops:toast", tst);
    return () => { window.removeEventListener("skyops:new-insp", a); window.removeEventListener("skyops:new-wo", b); window.removeEventListener("skyops:open-mic", c); window.removeEventListener("skyops:toast", tst); };
  }, []);
  const flash = (m) => { setToast(m); setTimeout(() => setToast(null), 2400); };
  return (
    <>
      {ni && <NewInspectionModal prefill={ni} onClose={() => setNi(null)} onCreated={(mic) => {
        setNi(null); setActiveSite(mic.siteId); setActiveMic(mic.id); setWsStage("plan"); go("workspace"); flash(`${mic.id} created · draft`);
      }}/>}
      {wo && <WoCreateModal prefill={wo} onClose={(created) => { setWo(null); if (created) flash(`${created.id} created`); }}/>}
      {toast && <div className="ni-toast" role="status"><Icon name="check_circle" size={13}/>{toast}</div>}
    </>
  );
}

window.GlobalModals = GlobalModals;
