// ─── Directorio · Entidad — sub-recursos Contactos y Convenios ─────────────
// DECISIÓN 1 (ARBITRAJES.md ítem 1, 06/07/2026 — CRUD real de los sub-recursos del
// directorio): `EntidadSubrecursos` es el componente dueño del fetch/POST/PATCH/DELETE
// reales contra las rutas nuevas (src/app/api/entidad-contactos, entidad-convenios) — antes
// los botones "Agregar contacto"/"Subir convenio" quedaban disabled-honesto
// (AUDITORIA-ui-decorativa-05-07-2026.md MEDIA) porque esas tablas no tenían ruta.
// Partido de screens/directorio/entidades.jsx (que ya rondaba el techo de líneas) por tema:
// layout de solo-lectura de la ficha vs. CRUD de estos 2 sub-recursos — AGENTS.md "un
// archivo = un tema". Expone a window: EntidadSubrecursos. Consume window.DirCard/
// DirContactoRow (ui/dir-kit.jsx), DirRowActions/DirSubResourceModal
// (ui/dir-subresource-modal.jsx), ConfirmDeleteModal/FileUploadCard (ui/doc-kit-edit.jsx),
// DirToast (ui/dir-kit.jsx), formatDate (dominio/formato.js), Icon* (ui/icons.jsx).
//
// "Ver PDF" (convenios) queda DISABLED-HONESTO a propósito: `entidad_convenio` no tiene
// columna de archivo — la persistencia real de adjuntos es la Decisión 9 (ARBITRAJES.md),
// paquete en paralelo. El PDF se puede adjuntar EN el modal de alta/edición (FileUploadCard,
// mismo patrón `realUpload` que el resto del bundle: sesión del navegador) para
// previsualizarlo ahí mismo — no persiste al cerrar el modal, así que reabrir el convenio no
// lo trae de vuelta (honesto: no hay dónde guardarlo todavía; el conector post-merge lo
// cablea cuando la Decisión 9 aterrice, ver notasMerge del paquete).

const { useState: _useStateEntSub, useEffect: _useEffectEntSub } = React;

function EntidadSubrecursos({ entidadId }) {
  const [contactos, setContactos] = _useStateEntSub([]);
  const [convenios, setConvenios] = _useStateEntSub([]);
  const [contactoModal, setContactoModal] = _useStateEntSub(null); // null | {mode:'new'} | {mode:'edit', row}
  const [convenioModal, setConvenioModal] = _useStateEntSub(null);
  const [confirmDel, setConfirmDel] = _useStateEntSub(null); // {tipo:'contacto'|'convenio', id, nombre}
  const [saving, setSaving] = _useStateEntSub(false);
  const [formError, setFormError] = _useStateEntSub(null);
  const [toast, setToast] = _useStateEntSub(null);

  // Sub-recursos con ruta propia — se fetchean acá (escopeados por `?entidadId=`), NO vía
  // el GET de /api/entidades (ese archivo no es de este paquete: se evita tocarlo para no
  // pisar trabajo en paralelo de otros writers).
  // FIX id-race (regresión cazada por el tripwire de entidad-convenio-telefono-email.spec.ts):
  // justo después de crear una entidad, `entidadId` es el `_tmp-…` optimista (MicosStore.
  // create, ver ui/record-form.jsx) hasta que el POST reconcilia — un fetch con ESE valor
  // como `?entidadId=` no es un uuid válido y Postgres lo rechaza con 500 (ruido real en la
  // consola/red, no solo un catch mudo). Se guarda hasta que `entidadId` reconcilie al uuid
  // real (mismo criterio `/^_tmp-/` que ya usa screens/expedientes/partes-editor.js); cuando
  // reconcilia, app.jsx actualiza `selectedEntidadId` y este efecto vuelve a correr solo.
  _useEffectEntSub(() => {
    if (!entidadId || /^_tmp-/.test(entidadId)) return undefined;
    let cancelled = false;
    Promise.all([
      fetch(`/api/entidad-contactos?entidadId=${encodeURIComponent(entidadId)}`, { credentials: 'same-origin' }).then((r) => (r.ok ? r.json() : [])),
      fetch(`/api/entidad-convenios?entidadId=${encodeURIComponent(entidadId)}`, { credentials: 'same-origin' }).then((r) => (r.ok ? r.json() : [])),
    ]).then(([cs, cvs]) => { if (!cancelled) { setContactos(cs || []); setConvenios(cvs || []); } });
    return () => { cancelled = true; };
  }, [entidadId]);

  function avisar(msg) { setToast(msg); setTimeout(() => setToast(null), 3600); }

  // Alta/edición de contacto — POST/PATCH reales contra entidad-contactos.
  function guardarContacto(form) {
    const editing = contactoModal && contactoModal.mode === 'edit';
    setSaving(true); setFormError(null);
    const url = editing ? `/api/entidad-contactos/${contactoModal.row.id}` : '/api/entidad-contactos';
    const body = editing
      ? { nombre: form.nombre, rol: form.rol || null, telefono: form.telefono || null, email: form.email || null }
      : { entidadId, nombre: form.nombre, rol: form.rol || null, telefono: form.telefono || null, email: form.email || null };
    fetch(url, { method: editing ? 'PATCH' : 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) })
      .then(async (r) => {
        if (!r.ok) throw new Error(((await r.json().catch(() => ({}))).error) || 'No se pudo guardar el contacto');
        return r.json();
      })
      .then((saved) => {
        setContactos((arr) => (editing ? arr.map((c) => (c.id === saved.id ? saved : c)) : [saved, ...arr]));
        setContactoModal(null);
        avisar(editing ? 'Contacto actualizado' : 'Contacto agregado');
      })
      .catch((err) => setFormError(err.message))
      .finally(() => setSaving(false));
  }

  // Alta/edición de convenio — POST/PATCH reales contra entidad-convenios.
  function guardarConvenio(form) {
    const editing = convenioModal && convenioModal.mode === 'edit';
    setSaving(true); setFormError(null);
    const url = editing ? `/api/entidad-convenios/${convenioModal.row.id}` : '/api/entidad-convenios';
    const body = editing
      ? { descripcion: form.descripcion, vigenciaDesde: form.vigenciaDesde || '', vigenciaHasta: form.vigenciaHasta || '', condiciones: form.condiciones || null }
      : { entidadId, descripcion: form.descripcion, vigenciaDesde: form.vigenciaDesde || '', vigenciaHasta: form.vigenciaHasta || '', condiciones: form.condiciones || null };
    fetch(url, { method: editing ? 'PATCH' : 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) })
      .then(async (r) => {
        if (!r.ok) throw new Error(((await r.json().catch(() => ({}))).error) || 'No se pudo guardar el convenio');
        return r.json();
      })
      .then((saved) => {
        setConvenios((arr) => (editing ? arr.map((c) => (c.id === saved.id ? saved : c)) : [saved, ...arr]));
        setConvenioModal(null);
        avisar(editing ? 'Convenio actualizado' : 'Convenio agregado');
      })
      .catch((err) => setFormError(err.message))
      .finally(() => setSaving(false));
  }

  // Borrado (soft-delete) compartido — mismo `ConfirmDeleteModal` que el resto del bundle.
  function confirmarEliminar() {
    if (!confirmDel) return;
    const { tipo, id } = confirmDel;
    const url = tipo === 'contacto' ? `/api/entidad-contactos/${id}` : `/api/entidad-convenios/${id}`;
    fetch(url, { method: 'DELETE', credentials: 'same-origin' })
      .then((r) => { if (!r.ok) throw new Error('No se pudo eliminar'); })
      .then(() => {
        if (tipo === 'contacto') setContactos((arr) => arr.filter((c) => c.id !== id));
        else setConvenios((arr) => arr.filter((c) => c.id !== id));
        avisar(tipo === 'contacto' ? 'Contacto eliminado' : 'Convenio eliminado');
      })
      .catch(() => avisar('No se pudo eliminar'))
      .finally(() => setConfirmDel(null));
  }

  return (
    <>
      {/* Contactos */}
      <DirCard eyebrow={`Contactos · ${contactos.length}`}
        action={
          <button onClick={() => setContactoModal({ mode: 'new' })} className="btn btn-outline" style={{ height: 32, fontSize: 12, padding: '0 12px' }}>
            <IconPlus size={12} /> Agregar contacto
          </button>
        }>
        {contactos.length > 0 ? (
          <div className="rounded-xl overflow-hidden" style={{ border: '1px solid color-mix(in oklab, var(--border) 55%, transparent)' }}>
            <div className="grid items-center gap-4 px-4 py-3 text-[10.5px] font-bold uppercase tracking-[0.08em]"
              style={{ gridTemplateColumns: '1.6fr 1.4fr 1fr auto', color: 'var(--muted-foreground)', borderBottom: '1px solid color-mix(in oklab, var(--border) 55%, transparent)', background: 'color-mix(in oklab, var(--surface) 50%, transparent)' }}>
              <div>Nombre · Rol</div>
              <div>Teléfono</div>
              <div>Email</div>
              <div />
            </div>
            {contactos.map((c, idx) => (
              <DirContactoRow key={c.id} c={c} isLast={idx === contactos.length - 1}
                actions={
                  <DirRowActions
                    editTitle="Editar contacto"
                    deleteTitle="Eliminar contacto"
                    onEdit={() => setContactoModal({ mode: 'edit', row: c })}
                    onDelete={() => setConfirmDel({ tipo: 'contacto', id: c.id, nombre: c.nombre })}
                  />
                } />
            ))}
          </div>
        ) : (
          <p className="text-[13px] italic" style={{ color: 'var(--muted-foreground)' }}>Sin contactos cargados.</p>
        )}
      </DirCard>

      {/* Convenios vigentes */}
      <DirCard eyebrow={`Convenios vigentes · ${convenios.length}`}
        action={
          <button onClick={() => setConvenioModal({ mode: 'new' })} className="btn btn-outline" style={{ height: 32, fontSize: 12, padding: '0 12px' }}>
            <IconPlus size={12} /> Subir convenio
          </button>
        }>
        {convenios.length > 0 ? (
          <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
            {convenios.map(cv => (
              <div key={cv.id} className="flex items-center gap-3 p-4 rounded-xl"
                style={{ background: 'color-mix(in oklab, var(--surface) 50%, transparent)', border: '1px solid color-mix(in oklab, var(--border) 55%, transparent)' }}>
                <div className="flex h-10 w-10 items-center justify-center rounded-lg flex-shrink-0"
                  style={{ background: 'color-mix(in oklab, var(--accent) 12%, transparent)', color: 'var(--accent)' }}>
                  <IconFileText size={18} />
                </div>
                <div className="flex-1 min-w-0">
                  <p className="text-[13px] font-bold truncate" style={{ color: 'var(--foreground)' }}>{cv.descripcion || 'Convenio sin descripción'}</p>
                  <p className="text-[11.5px] tabular-nums mt-0.5" style={{ color: 'var(--muted-foreground)' }}>
                    {formatDate(cv.vigenciaDesde)} → {formatDate(cv.vigenciaHasta)}
                  </p>
                </div>
                <button disabled title="Ver PDF — depende de la persistencia de adjuntos (Decisión 9, ARBITRAJES.md, paquete en paralelo)" className="inline-flex items-center gap-1 text-[11.5px] font-bold uppercase tracking-[0.08em] flex-shrink-0"
                  style={{ color: 'var(--muted-foreground)', cursor: 'not-allowed' }}>
                  Ver PDF
                  <IconArrowUpRight size={12} />
                </button>
                <DirRowActions
                  editTitle="Editar convenio"
                  deleteTitle="Eliminar convenio"
                  onEdit={() => setConvenioModal({ mode: 'edit', row: cv })}
                  onDelete={() => setConfirmDel({ tipo: 'convenio', id: cv.id, nombre: cv.descripcion || 'este convenio' })}
                />
              </div>
            ))}
          </div>
        ) : (
          <p className="text-[13px] italic" style={{ color: 'var(--muted-foreground)' }}>Sin convenios cargados.</p>
        )}
      </DirCard>

      {/* Modales de alta/edición + confirmación de borrado compartida. */}
      <DirSubResourceModal
        open={!!contactoModal}
        onClose={() => { setContactoModal(null); setFormError(null); }}
        icon={IconUser}
        eyebrow={contactoModal && contactoModal.mode === 'edit' ? 'Editar' : 'Agregar'}
        title="Contacto"
        saving={saving}
        error={formError}
        initial={contactoModal && contactoModal.mode === 'edit' ? contactoModal.row : { nombre: '', rol: '', telefono: '', email: '' }}
        onSave={guardarContacto}
        fields={[
          { key: 'nombre', label: 'Nombre', required: true, span: true, placeholder: 'Ej: María López' },
          { key: 'rol', label: 'Rol / cargo', placeholder: 'Ej: Gerente de Convenios' },
          { key: 'telefono', label: 'Teléfono', mono: true, placeholder: '+54 …' },
          { key: 'email', label: 'Email', placeholder: 'nombre@correo.com' },
        ]}
      />

      <DirSubResourceModal
        open={!!convenioModal}
        onClose={() => { setConvenioModal(null); setFormError(null); }}
        icon={IconFileText}
        eyebrow={convenioModal && convenioModal.mode === 'edit' ? 'Editar' : 'Subir'}
        title="Convenio"
        saving={saving}
        error={formError}
        initial={convenioModal && convenioModal.mode === 'edit' ? convenioModal.row : { descripcion: '', vigenciaDesde: '', vigenciaHasta: '', condiciones: '' }}
        onSave={guardarConvenio}
        fields={[
          { key: 'descripcion', label: 'Descripción', required: true, span: true, placeholder: 'Ej: Convenio anual de cobertura 2026' },
          { key: 'vigenciaDesde', label: 'Vigencia desde', type: 'date', mono: true },
          { key: 'vigenciaHasta', label: 'Vigencia hasta', type: 'date', mono: true },
          { key: 'condiciones', label: 'Condiciones', type: 'textarea', span: true, placeholder: 'Coseguros, topes, exclusiones…' },
        ]}
        extra={
          <div style={{ gridColumn: '1 / -1' }}>
            <FileUploadCard
              eyebrow="Documento del convenio"
              title="PDF del convenio (opcional)"
              description="Adjuntalo para revisarlo ahora — todavía no persiste al cerrar (depende de la Decisión 9, adjuntos)."
              files={[]}
              editing
              realUpload
            />
          </div>
        }
      />

      {confirmDel && (
        <ConfirmDeleteModal
          title={confirmDel.tipo === 'contacto' ? '¿Eliminar contacto?' : '¿Eliminar convenio?'}
          itemName={confirmDel.nombre}
          onCancel={() => setConfirmDel(null)}
          onConfirm={confirmarEliminar}
        />
      )}

      <DirToast message={toast} />
    </>
  );
}

Object.assign(window, { EntidadSubrecursos });