/* LIA · Extras — Documentos, Creditos, Ley, Upload */

/* IndexedDB para PDFs grandes (hasta 500 MB, persiste al refrescar) */
const LIA_PDF_STORE = {
  _open() {
    return new Promise((res, rej) => {
      const r = indexedDB.open('lia_v1', 1);
      r.onupgradeneeded = e => e.target.result.createObjectStore('pdf');
      r.onsuccess = e => res(e.target.result);
      r.onerror = () => rej(r.error);
    });
  },
  async save(name, base64) {
    try {
      const db = await this._open();
      await new Promise((res, rej) => {
        const tx = db.transaction('pdf', 'readwrite');
        tx.objectStore('pdf').put({ name, base64 }, 'current');
        tx.oncomplete = res; tx.onerror = rej;
      });
      db.close(); return true;
    } catch(e) { return false; }
  },
  async load() {
    try {
      const db = await this._open();
      const result = await new Promise((res, rej) => {
        const tx = db.transaction('pdf', 'readonly');
        const q = tx.objectStore('pdf').get('current');
        q.onsuccess = () => res(q.result); q.onerror = rej;
      });
      db.close(); return result || null;
    } catch(e) { return null; }
  },
};
window.LIA_PDF_STORE = LIA_PDF_STORE;

function ViewDocumentos({userId, onOpen, onNav}) {
  const [docs,setDocs]=React.useState([]);
  const [load,setLoad]=React.useState(true);
  React.useEffect(()=>{cargar();},[userId]);

  async function cargar(){
    setLoad(true);
    if(!window._sb||!userId){setLoad(false);return;}
    const {data}=await window._sb.from('analyses')
      .select('id,analysis_type,prompt_used,result,created_at,licitacion_id')
      .eq('user_id',userId).order('created_at',{ascending:false}).limit(50);
    if(data) setDocs(data);
    setLoad(false);
  }

  async function eliminar(id,e){
    e.stopPropagation();
    if(!confirm('¿Eliminar este análisis?')) return;
    await window._sb.from('analyses').delete().eq('id',id);
    setDocs(prev=>prev.filter(d=>d.id!==id));
  }

  function descargar(doc,e){
    e.stopPropagation();
    const contenido = [
      'LIA Solutions — Análisis de Licitación',
      '='.repeat(50),
      'Tipo: ' + (doc.analysis_type||'').toUpperCase(),
      'Cartel: ' + (doc.prompt_used||'Sin nombre'),
      'Fecha: ' + new Date(doc.created_at).toLocaleDateString('es-CR'),
      '='.repeat(50),
      '',
      doc.result || '',
    ].join('\n');
    const blob = new Blob([contenido], {type:'text/plain;charset=utf-8'});
    const url = window.URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = 'LIA_' + (doc.analysis_type||'analisis') + '_' + new Date(doc.created_at).toISOString().split('T')[0] + '.txt';
    a.click();
    window.URL.revokeObjectURL(url);
  }

  async function abrirLicitacion(doc){
    if(!doc.licitacion_id||!window._sb||!onOpen) return;
    const {data}=await window._sb.from('licitaciones').select('*').eq('id',doc.licitacion_id).single();
    if(data){
      try{ sessionStorage.setItem('lia_open_analysis', doc.analysis_type); }catch(e){}
      onOpen(window.formatLic ? window.formatLic(data) : {id:data.id,_dbId:data.id,titulo:data.titulo||data.nombre_pdf||'Licitación',sicop:data.numero_sicop||'',inst:'otro',modalidad:'Licitación',monto:data.monto_estimado||0,estado:data.estado||'nueva',match:data.match_score||80,diasRestantes:30,paginas:'?',garantia:'Ver cartel',analizado:data.analizado||false,resumen:null,tags:[],pdfBase64:null,pdfName:data.nombre_pdf||null,nombre_pdf:data.nombre_pdf});
    }
  }

  if(load) return <div style={{textAlign:'center',padding:40,color:'var(--muted)'}}>Cargando…</div>;
  return (
    <div className="fade-up">
      <div style={{display:'flex',alignItems:'center',marginBottom:18,gap:14}}>
        <div>
          <div className="section-title" style={{fontSize:16}}>Historial de análisis</div>
          <div className="section-sub">Hacé clic en un análisis para abrirlo · Descargá como TXT</div>
        </div>
      </div>
      {docs.length===0
        ?<div className="card" style={{textAlign:'center',padding:40,color:'var(--muted)'}}>Aún no hay análisis. Subí un cartel y ejecutá una herramienta LIA.</div>
        :<div className="card" style={{padding:0,overflow:'hidden'}}>
          <div style={{display:'grid',gridTemplateColumns:'1fr 180px 90px 72px',gap:12,padding:'13px 20px',borderBottom:'1px solid var(--border)',fontSize:10.5,color:'var(--muted)',textTransform:'uppercase',letterSpacing:'.08em',fontWeight:600}}>
            <span>Análisis</span><span>Cartel</span><span>Fecha</span><span></span>
          </div>
          {docs.map((doc,k)=>(
            <div key={doc.id}
              onClick={()=>abrirLicitacion(doc)}
              style={{display:'grid',gridTemplateColumns:'1fr 180px 90px 72px',gap:12,padding:'13px 20px',alignItems:'center',borderBottom:k<docs.length-1?'1px solid var(--border)':'none',transition:'background .15s',cursor:doc.licitacion_id?'pointer':'default'}}
              onMouseEnter={e=>e.currentTarget.style.background='rgba(96,165,250,0.04)'}
              onMouseLeave={e=>e.currentTarget.style.background=''}>
              <div style={{display:'flex',alignItems:'center',gap:11,minWidth:0}}>
                <div style={{width:32,height:32,borderRadius:8,flex:'none',display:'grid',placeItems:'center',background:'rgba(96,165,250,0.08)',border:'1px solid var(--border)'}}>
                  <Icon name="spark" size={15} style={{color:'var(--accent-2)'}}/>
                </div>
                <div style={{minWidth:0}}>
                  <div style={{fontSize:13,fontWeight:500}}>{(doc.analysis_type||'análisis').toUpperCase()}</div>
                  <div style={{fontSize:10.5,color:'var(--muted)',overflow:'hidden',textOverflow:'ellipsis',whiteSpace:'nowrap',maxWidth:200}}>{(doc.result||'').substring(0,60)}…</div>
                </div>
              </div>
              <div style={{fontSize:11.5,color:'var(--silver)',overflow:'hidden',textOverflow:'ellipsis',whiteSpace:'nowrap'}}>{(doc.prompt_used||'Sin PDF').substring(0,25)}</div>
              <div className="mono" style={{fontSize:11.5,color:'var(--muted)'}}>{new Date(doc.created_at).toLocaleDateString('es-CR',{day:'2-digit',month:'short'})}</div>
              <div style={{display:'flex',gap:4}}>
                <button onClick={e=>descargar(doc,e)} title="Descargar TXT"
                  style={{background:'rgba(96,165,250,0.08)',border:'1px solid var(--border)',borderRadius:6,cursor:'pointer',color:'var(--accent-2)',padding:'3px 6px',fontSize:12}}>
                  <Icon name="download" size={13}/>
                </button>
                <button onClick={e=>{e.stopPropagation();eliminar(doc.id,e);}} title="Eliminar"
                  style={{background:'none',border:'none',cursor:'pointer',color:'#f87171',padding:'3px 4px',fontSize:13}}>✕</button>
              </div>
            </div>
          ))}
        </div>
      }
    </div>
  );
}

function ViewCreditos({credits,userId}) {
  const D=window.LIA_DATA;
  const [hist,setHist]=React.useState([]);
  React.useEffect(()=>{
    if(!window._sb||!userId) return;
    window._sb.from('analyses').select('analysis_type,created_at,credits_used').eq('user_id',userId).order('created_at',{ascending:false}).limit(10)
      .then(({data})=>{ if(data) setHist(data.map(a=>({t:a.analysis_type+' · análisis',f:new Date(a.created_at).toLocaleDateString('es-CR',{day:'2-digit',month:'short'}),d:-(a.credits_used||1)})));});
  },[]);
  return (
    <div className="fade-up">
      <div className="row" style={{alignItems:'flex-start'}}>
        <div style={{flex:'1',minWidth:0,display:'flex',flexDirection:'column',gap:'var(--gap-grid)'}}>
          <div className="card" style={{background:'linear-gradient(135deg,rgba(245,158,11,0.12),rgba(245,158,11,0.02))',borderColor:'rgba(245,158,11,0.25)'}}>
            <div style={{fontSize:11.5,color:'var(--muted)',textTransform:'uppercase',letterSpacing:'.09em',fontWeight:600}}>Saldo disponible</div>
            <div style={{display:'flex',alignItems:'baseline',gap:10,marginTop:8}}>
              <span className="font-display" style={{fontSize:46,fontWeight:800,color:'var(--gold)',letterSpacing:'-0.02em'}}>{credits}</span>
              <span className="muted" style={{fontSize:14}}>créditos</span>
            </div>
            <p className="muted" style={{fontSize:12.5,marginTop:6}}>Cada análisis consume 1 crédito. Disponibles para ≈ {credits} análisis.</p>
          </div>
          <div className="card">
            <div className="section-title" style={{marginBottom:14}}>Movimientos recientes</div>
            {hist.length===0?<p className="muted" style={{fontSize:12.5}}>Sin movimientos aún.</p>
              :hist.map((h,k)=>(
              <div key={k} style={{display:'flex',alignItems:'center',gap:12,padding:'11px 0',borderBottom:k<hist.length-1?'1px solid var(--border)':'none'}}>
                <div style={{width:30,height:30,borderRadius:8,flex:'none',display:'grid',placeItems:'center',background:'rgba(96,165,250,0.08)'}}>
                  <Icon name="spark" size={14} style={{color:'var(--accent-2)'}}/>
                </div>
                <div style={{flex:1,fontSize:12.5}}>{h.t}</div>
                <div className="mono muted" style={{fontSize:11.5}}>{h.f}</div>
                <div className="font-display" style={{fontSize:13,fontWeight:700,color:'var(--silver)'}}>{h.d}</div>
              </div>
            ))}
          </div>
        </div>
        <div style={{flex:'1.3',minWidth:0}}>
          <div className="section-head"><div className="section-title">Recargar créditos</div><div className="spacer"></div><span className="chip">SINPE Móvil</span></div>
          <div className="grid" style={{gridTemplateColumns:'repeat(3,1fr)'}}>
            {D.paquetes.map((p,k)=>(
              <div key={k} className="card" style={{textAlign:'center',position:'relative',borderColor:p.destacado?'var(--border-hover)':'var(--border)',background:p.destacado?'linear-gradient(180deg,rgba(37,99,235,0.14),var(--surface))':''}}>
                {p.destacado&&<div style={{position:'absolute',top:-10,left:'50%',transform:'translateX(-50%)',fontSize:9.5,fontWeight:700,textTransform:'uppercase',background:'var(--accent)',color:'#fff',padding:'3px 12px',borderRadius:99,fontFamily:'Syne'}}>Popular</div>}
                <div className="font-display" style={{fontSize:14,fontWeight:700,marginTop:4}}>{p.nombre}</div>
                <div className="font-display" style={{fontSize:34,fontWeight:800,margin:'10px 0 2px',color:p.destacado?'var(--accent-2)':'var(--text)'}}>{p.creditos}</div>
                <div className="muted" style={{fontSize:11}}>créditos</div>
                <div className="amt" style={{fontSize:18,marginTop:14}}>{'\u20a1'}{p.precio.toLocaleString('es-CR')}</div>
                <button className={'btn '+(p.destacado?'btn-primary':'btn-ghost')} style={{width:'100%',justifyContent:'center',marginTop:16}}>Recargar</button>
              </div>
            ))}
          </div>
          <div className="card" style={{marginTop:'var(--gap-grid)',display:'flex',gap:14,alignItems:'center'}}>
            <span style={{fontSize:24}}>📱</span>
            <div style={{fontSize:12.5,color:'var(--silver)',lineHeight:1.6}}>
              SINPE Móvil al <b style={{color:'var(--accent-2)'}}>8888-8888</b> (LIA Solutions). Incluí tu correo y el paquete. Activación en máx. 24 h hábiles.
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}

function ViewLey({userId}) {
  const sugeridas=[
    '¿Cuál es el plazo para presentar un recurso de objeción?',
    '¿Qué procede si la institución no responde mis consultas a tiempo?',
    '¿Cuándo aplica licitación pública vs. licitación reducida?',
    '¿Cómo se calcula la garantía de cumplimiento según la Ley 9986?',
  ];
  const [q,setQ]=React.useState('');
  const [resp,setResp]=React.useState('');
  const [load,setLoad]=React.useState(false);

  async function consultar(){
    if(!q.trim()||load) return;
    setLoad(true); setResp('');
    try {
      const prompt='Sos un abogado especialista en contratacion publica costarricense con 20 anos de experiencia. Normativa: Ley 9986 y Reglamento Decreto 43808. REGLAS: maximo 300 palabras, cita el articulo exacto, conclusion practica.\n\nConsulta: '+q;
      const resultado=await window.LIA_CONFIG.analyze(prompt,null,1000);
      setResp(resultado);
      if(window._sb&&userId){
        await window._sb.from('analyses').insert({
          user_id:userId,licitacion_id:null,
          analysis_type:'ley9986',prompt_used:q.substring(0,100),
          result:resultado.substring(0,8000),credits_used:1
        });
      }
    } catch(e){ setResp('Error: '+e.message); }
    finally{ setLoad(false); }
  }

  return (
    <div className="fade-up" style={{maxWidth:820,margin:'0 auto'}}>
      <div style={{textAlign:'center',marginBottom:24}}>
        <div style={{width:52,height:52,borderRadius:14,margin:'0 auto 14px',display:'grid',placeItems:'center',background:'rgba(37,99,235,0.12)',border:'1px solid var(--border-2)'}}>
          <Icon name="ley" size={24} style={{color:'var(--accent-2)'}}/>
        </div>
        <h1 className="font-display" style={{fontSize:23,fontWeight:800,letterSpacing:'-0.02em'}}>Asistente legal LIA</h1>
        <p className="muted" style={{fontSize:13.5,marginTop:6}}>Ley General de Contratación Pública 9986 · Reglamento Decreto 43808 · directrices CGR — incorporadas.</p>
      </div>
      <div className="card" style={{padding:8,marginBottom:18}}>
        <div style={{display:'flex',gap:9,alignItems:'center',padding:4}}>
          <Icon name="spark" size={17} style={{color:'var(--accent-2)',flex:'none',marginLeft:6}}/>
          <input value={q} onChange={e=>setQ(e.target.value)} onKeyDown={e=>e.key==='Enter'&&consultar()}
            placeholder="Consultá cualquier artículo, plazo o procedimiento legal…"
            style={{flex:1,background:'none',border:'none',outline:'none',color:'var(--text)',fontSize:14,fontFamily:'inherit',padding:'10px 0'}}/>
          <button className="btn btn-primary btn-sm" onClick={consultar} disabled={load||!q.trim()}>
            {load?'…':'Consultar · 1 crédito'}
          </button>
        </div>
      </div>
      {load&&<div className="card" style={{textAlign:'center',padding:28}}>
        <div className="lia-spin" style={{width:32,height:32,margin:'0 auto 12px',border:'2.5px solid rgba(96,165,250,0.18)',borderTopColor:'var(--accent-2)',borderRadius:'99px'}}/>
        <div style={{color:'var(--muted)',fontSize:13}}>Consultando la Ley 9986…</div>
      </div>}
      {resp&&!load&&<div className="card fade-up" style={{whiteSpace:'pre-wrap',fontSize:13.5,lineHeight:1.75,color:'var(--silver-2)',marginBottom:18}}>
        {resp}
        <div style={{marginTop:14,paddingTop:12,borderTop:'1px solid var(--border)'}}>
          <button className="btn btn-ghost btn-sm" onClick={()=>navigator.clipboard.writeText(resp)}><Icon name="download" size={13}/>Copiar</button>
        </div>
      </div>}
      {!resp&&!load&&<>
        <div style={{fontSize:11.5,color:'var(--muted)',textTransform:'uppercase',letterSpacing:'.08em',fontWeight:600,marginBottom:10}}>Consultas frecuentes</div>
        <div className="grid" style={{gridTemplateColumns:'1fr 1fr'}}>
          {sugeridas.map((s,k)=>(
            <div key={k} onClick={()=>setQ(s)} className="card" style={{cursor:'pointer',display:'flex',alignItems:'center',gap:12,transition:'all .15s'}}
              onMouseEnter={e=>e.currentTarget.style.borderColor='var(--border-hover)'}
              onMouseLeave={e=>e.currentTarget.style.borderColor=''}>
              <span style={{fontFamily:'Syne',fontSize:16,color:'var(--accent-2)'}}>§</span>
              <span style={{fontSize:13,color:'var(--silver-2)',lineHeight:1.5}}>{s}</span>
            </div>
          ))}
        </div>
      </>}
    </div>
  );
}

function UploadModal({open,onClose,onDone,userId}) {
  const [drag,setDrag]=React.useState(false);
  const [file,setFile]=React.useState(null);
  const [saving,setSaving]=React.useState(false);

  React.useEffect(()=>{
    if(!open) return;
    const n=localStorage.getItem('lia_pdf_name');
    const b=localStorage.getItem('lia_pdf_b64');
    if(n&&b&&!window.LIA_PDF){ window.LIA_PDF={base64:b,name:n}; setFile({name:n,size:localStorage.getItem('lia_pdf_size')||'?'}); }
  },[open]);

  if(!open) return null;

  function handleFile(f){
    if(!f||f.type!=='application/pdf'){alert('Solo se aceptan archivos PDF.');return;}
    if(f.size>33554432){alert('El PDF no puede superar 32 MB.');return;}
    const reader=new FileReader();
    reader.onload=async function(e){
      const b64=e.target.result.split(',')[1];
      window.LIA_PDF={base64:b64,name:f.name};
      /* Guardar en IndexedDB (soporta archivos grandes) */
      await window.LIA_PDF_STORE.save(f.name, b64);
      /* Guardar nombre en localStorage como referencia rápida */
      try{
        localStorage.setItem('lia_pdf_name',f.name);
        localStorage.setItem('lia_pdf_size',(f.size/1024).toFixed(0));
        /* Solo intentar b64 en localStorage si es pequeño (<4MB) */
        if(f.size < 4194304) localStorage.setItem('lia_pdf_b64',b64);
      }catch(e){}
      setFile({name:f.name,size:(f.size/1024).toFixed(0)});
    };
    reader.readAsDataURL(f);
  }

  async function handleAnalizar(){
    if(!file||saving) return;
    setSaving(true);
    try{
      let licId=null;
      if(userId){
        try{
          const titulo=file.name.replace(/\.pdf$/i,'').replace(/[_-]/g,' ');
          const resp=await window.LIA_CONFIG.serverCall('/api/save-licitacion',{
            nombre_pdf:file.name, titulo,
          });
          if(resp.id) licId=resp.id;
        }catch(e){
          console.error('DB save-licitacion:', e.message);
          // No bloquear al usuario pero guardar el error para mostrarlo
          window._liaLastDbError = e.message;
        }
      }
      const lic={
        id:licId||('local-'+Date.now()),_dbId:licId,
        titulo:file.name.replace(/\.pdf$/i,'').replace(/[_-]/g,' '),
        nombre_pdf:file.name,
        sicop:'Cargado manualmente',inst:'otro',modalidad:'Licitación',
        monto:0,estado:'nueva',match:80,diasRestantes:30,
        paginas:'?',garantia:'Ver cartel',analizado:false,resumen:null,tags:[],
        pdfBase64:window.LIA_PDF?.base64||null,pdfName:file.name,
      };
      onDone(lic);
    }catch(e){console.error(e);onDone(null);}
    finally{setSaving(false);}
  }

  return (
    <div onClick={onClose} style={{position:'fixed',inset:0,zIndex:200,background:'rgba(2,8,22,0.78)',backdropFilter:'blur(8px)',display:'grid',placeItems:'center',padding:20}}>
      <div onClick={e=>e.stopPropagation()} className="fade-up"
        style={{width:'100%',maxWidth:520,background:'var(--surface)',border:'1px solid var(--border-2)',borderRadius:20,padding:28}}>
        <div style={{display:'flex',alignItems:'center',gap:12,marginBottom:6}}>
          <div style={{width:38,height:38,borderRadius:11,display:'grid',placeItems:'center',background:'linear-gradient(140deg,var(--accent),#1d4ed8)'}}>
            <Icon name="upload" size={18} style={{color:'#fff'}}/>
          </div>
          <div style={{flex:1}}>
            <div className="font-display" style={{fontWeight:700,fontSize:17}}>Analizar nuevo cartel</div>
            <div className="muted" style={{fontSize:12}}>Subí el PDF del cartel y LIA lo procesa al instante</div>
          </div>
          <button onClick={onClose} style={{background:'none',border:'none',color:'var(--muted)',cursor:'pointer',fontSize:22,lineHeight:1}}>×</button>
        </div>
        <label onDragOver={e=>{e.preventDefault();setDrag(true);}} onDragLeave={()=>setDrag(false)}
          onDrop={e=>{e.preventDefault();setDrag(false);const f=e.dataTransfer.files[0];if(f)handleFile(f);}}
          style={{display:'block',marginTop:18,padding:'38px 20px',borderRadius:14,textAlign:'center',cursor:'pointer',
            border:'1.5px dashed '+(drag?'var(--accent-2)':file?'var(--success)':'var(--border-2)'),
            background:drag?'rgba(37,99,235,0.08)':file?'rgba(34,197,94,0.04)':'var(--surface-2)',transition:'all .15s'}}>
          <input type="file" accept=".pdf" style={{display:'none'}} onChange={e=>{if(e.target.files[0])handleFile(e.target.files[0]);}}/>
          <Icon name="upload" size={30} style={{color:file?'var(--success)':'var(--accent-2)',margin:'0 auto'}}/>
          <div className="font-display" style={{fontWeight:700,fontSize:14,marginTop:12}}>{file?file.name:'Arrastrá o hacé clic para subir el PDF'}</div>
          <div className="muted" style={{fontSize:11.5,marginTop:5}}>{file?'\u2713 '+file.size+' KB · Listo para analizar':'PDF hasta 32 MB · de 2 a 200 páginas'}</div>
        </label>
        <div style={{display:'flex',gap:10,marginTop:20,justifyContent:'flex-end'}}>
          <button className="btn btn-ghost" onClick={onClose}>Cancelar</button>
          <button className="btn btn-primary" disabled={!file||saving} onClick={handleAnalizar}>
            <Icon name="spark" size={15}/>{saving?'Guardando…':'Analizar con LIA'}
          </button>
        </div>
      </div>
    </div>
  );
}

Object.assign(window,{ViewDocumentos,ViewCreditos,ViewLey,UploadModal});
