/* ──────────────────────────────────────────────────────────────────────────
   IncompleteLiaModal.jsx — fenêtre « LIA incomplète : informer l'expéditeur ».
   Extraite de Notifications.jsx (dette D1, 2026-06-24). Portée globale
   (pas d'import/export). Rendue par NotificationsView (onglet Notifications).
   ────────────────────────────────────────────────────────────────────────── */

/* ── Modale : email LIA incomplète ──────────────────────────────────────────── */
function IncompleteLiaModal({state,onSent,onClose}){
  const {loading,emailData}=state;
  const [to,   setTo]   =React.useState("");
  const [cc,   setCc]   =React.useState("");
  const [subj, setSubj] =React.useState("");
  const [body, setBody] =React.useState("");
  const [sending,setSending]=React.useState(false);

  React.useEffect(()=>{
    if(!emailData) return;
    setTo(emailData.to||"");
    setCc(emailData.cc||"");
    setSubj(emailData.subject||"");
    setBody(emailData.body||"");
  },[emailData]);

  const inp={width:"100%",padding:"7px 10px",border:"1px solid #e2e8f0",borderRadius:6,fontSize:13,
    background:"#f8fafc",color:"#1e293b",boxSizing:"border-box"};
  const btnS=(bg)=>({background:bg,color:"#fff",border:"none",borderRadius:7,
    padding:"7px 18px",cursor:"pointer",fontSize:13,fontWeight:600});

  const handleSend=async()=>{
    if(!to.trim()){alert("Le destinataire (À) est requis.");return;}
    setSending(true);
    try{
      const payload={to:to.trim(),subject:subj.trim(),body:body.trim(),bodyType:"Text"};
      if(cc.trim()) payload.cc=cc.trim();
      if(emailData && emailData.attachment){
        payload.attachment={
          filename:    emailData.attachment.filename,
          contentType: emailData.attachment.contentType,
          content:     emailData.attachment.content,
        };
      }
      const r=await window.apiFetch("/api/email/send",{
        method:"POST",headers:{"Content-Type":"application/json"},
        body:JSON.stringify(payload)
      });
      const d=await r.json();
      if(!r.ok||d.error){alert("Erreur envoi : "+(d.error||r.statusText));setSending(false);return;}
      await onSent();
    }catch(e){alert("Erreur réseau : "+e.message);setSending(false);}
  };

  return(
    <div style={{position:"fixed",inset:0,background:"rgba(0,0,0,0.6)",zIndex:3100,display:"flex",
      alignItems:"center",justifyContent:"center"}}
      onClick={e=>{if(e.target===e.currentTarget&&!sending)onClose();}}>
      <div style={{background:"#fff",borderRadius:14,padding:24,width:"min(620px,96vw)",
        maxHeight:"92vh",overflowY:"auto",boxShadow:"0 8px 40px #0004"}}>

        <div style={{display:"flex",justifyContent:"space-between",alignItems:"center",marginBottom:16}}>
          <div style={{fontWeight:800,fontSize:16,color:"#1e293b"}}>⚠️ LIA incomplète — informer l’expéditeur</div>
          <button onClick={onClose} disabled={sending}
            style={{background:"none",border:"none",fontSize:20,cursor:"pointer",color:"#64748b"}}>✕</button>
        </div>

        {loading&&(
          <div style={{textAlign:"center",padding:"32px 0",color:"#64748b",fontSize:13}}>
            ⏳ Préparation de l’email…
          </div>
        )}

        {!loading&&emailData&&(
          <>
            <div style={{marginBottom:10}}>
              <label style={{display:"block",fontSize:11,fontWeight:700,color:"#64748b",marginBottom:3}}>À *</label>
              <input value={to} onChange={e=>setTo(e.target.value)} style={inp} placeholder="adresse@exemple.fr"/>
            </div>
            <div style={{marginBottom:10}}>
              <label style={{display:"block",fontSize:11,fontWeight:700,color:"#64748b",marginBottom:3}}>CC</label>
              <input value={cc} onChange={e=>setCc(e.target.value)} style={inp} placeholder="copie1@ex.fr, copie2@ex.fr"/>
            </div>
            <div style={{marginBottom:10}}>
              <label style={{display:"block",fontSize:11,fontWeight:700,color:"#64748b",marginBottom:3}}>Sujet</label>
              <input value={subj} onChange={e=>setSubj(e.target.value)} style={inp}/>
            </div>
            <div style={{marginBottom:12}}>
              <label style={{display:"block",fontSize:11,fontWeight:700,color:"#64748b",marginBottom:3}}>Corps du message</label>
              <textarea value={body} onChange={e=>setBody(e.target.value)} rows={10}
                style={{...inp,resize:"vertical",fontFamily:"inherit",lineHeight:1.55}}/>
            </div>
            <div style={{background:"#f0f9ff",border:"1px solid #bae6fd",borderRadius:8,
              padding:"8px 12px",marginBottom:16,fontSize:12,color:"#0369a1"}}>
              {emailData.hasAttachment
                ? <>📎 La LIA reçue sera jointe automatiquement ({emailData.attachment&&emailData.attachment.filename||"document"})</>
                : <>⚠ La pièce jointe originale est inaccessible — l’email sera envoyé sans PJ.</>
              }
            </div>
            <div style={{display:"flex",gap:8,justifyContent:"flex-end"}}>
              <button onClick={onClose} disabled={sending}
                style={{background:"#f1f5f9",border:"1px solid #e2e8f0",borderRadius:7,
                  padding:"6px 16px",fontSize:13,cursor:"pointer",color:"#475569",fontWeight:600}}>
                Annuler
              </button>
              <button onClick={handleSend} disabled={sending||!to.trim()} style={btnS(sending?"#94a3b8":"#f59e0b")}>
                {sending?"⏳ Envoi…":"📧 Envoyer"}
              </button>
            </div>
          </>
        )}
      </div>
    </div>
  );
}