feat(afluencia): el campo de interes muestra los modelos del desarrollo

'Al departamento o casa de interes' ahora es un select dependiente:
al elegir desarrollo se cargan sus modelos (MODELOS_POR_PROYECTO) y al
cambiar de desarrollo se resetea. En Monday la columna 'Tipo de
Propiedad' se renombro a 'Modelo de Interes' con los 16 modelos como
labels del status.

apps/alta-clientes/src/components/AltaAfluenciaForm.test.tsx

@@ -71,7 +71,19 @@ describe('AltaAfluenciaForm', () => {
     const opcionesDe = (label: RegExp) =>
       Array.from((screen.getByLabelText(label) as HTMLSelectElement).options).map((o) => o.value)
 
-    expect(opcionesDe(/Departamento o casa de interés/)).toEqual(['', 'Casa', 'Departamento'])
+    // El select de modelo arranca deshabilitado hasta elegir desarrollo
+    const selectModelo = screen.getByLabelText(/Departamento o casa de interés/) as HTMLSelectElement
+    expect(selectModelo.disabled).toBe(true)
+    fireEvent.change(screen.getByLabelText(/Desarrollo de interés/), { target: { value: 'SENDA' } })
+    expect(selectModelo.disabled).toBe(false)
+    expect(opcionesDe(/Departamento o casa de interés/)).toEqual([
+      '',
+      'HIMALAYA',
+      'SANTIAGO',
+      'ESMERALDA PA',
+      'ESMERALDA PB',
+      'SANTA CRUZ',
+    ])
     expect(opcionesDe(/^Estado civil/)).toEqual(['', 'Soltero(a)', 'Casado(a)', 'Unión libre', 'Divorciado(a)', 'Viudo(a)'])
     expect(opcionesDe(/Tipo de empleo/)).toEqual(['', 'Asalariado', 'Independiente'])
     expect(opcionesDe(/^Crédito/)).toEqual([
@@ -93,7 +105,8 @@ describe('AltaAfluenciaForm', () => {
     fetchMock.mockResolvedValueOnce(respuesta({ id: 'l-1', estado: 'NUEVO', oportunidadId: 'op-1' }))
     render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={() => undefined} />)
     llenarRequeridos()
-    fireEvent.change(screen.getByLabelText(/Departamento o casa de interés/), { target: { value: 'Casa' } })
+    fireEvent.change(screen.getByLabelText(/Desarrollo de interés/), { target: { value: 'SENDA' } })
+    fireEvent.change(screen.getByLabelText(/Departamento o casa de interés/), { target: { value: 'HIMALAYA' } })
     fireEvent.change(screen.getByLabelText(/Medio de contacto/), { target: { value: 'Llamada' } })
     fireEvent.change(screen.getByLabelText(/^Edad/), { target: { value: '35' } })
     fireEvent.change(screen.getByLabelText(/^Estado civil/), { target: { value: 'Casado(a)' } })
@@ -109,7 +122,7 @@ describe('AltaAfluenciaForm', () => {
     await screen.findByRole('status')
     const [, init] = fetchMock.mock.calls[0] as [string, RequestInit]
     expect(JSON.parse(String(init.body))).toMatchObject({
-      tipoPropiedad: 'Casa',
+      modelo: 'HIMALAYA',
       medioContacto: 'Llamada',
       edad: '35',
       estadoCivil: 'Casado(a)',

apps/alta-clientes/src/components/AltaAfluenciaForm.tsx

@@ -4,12 +4,12 @@ import { crearLead, type LeadResumen } from '../services/api'
 import {
   DESARROLLOS_LEAD,
   ESTADOS_CIVILES,
+  MODELOS_POR_PROYECTO,
   OPCIONES_CALIFICA,
   ORIGENES_LEAD,
   TIPOS_CREDITO,
   TIPOS_ECONOMIA,
   TIPOS_EMPLEO,
-  TIPOS_PROPIEDAD_LEAD,
 } from '../data/constantes'
 
 interface Props {
@@ -38,7 +38,7 @@ const FORM_INICIAL = {
   email: '',
   origen: '',
   desarrollo: '',
-  tipoPropiedad: '',
+  modelo: '',
   medioContacto: '',
   edad: '',
   estadoCivil: '',
@@ -69,6 +69,14 @@ export default function AltaAfluenciaForm({ onVolver, onPasarAAltaCliente }: Pro
     setErrores((prev) => ({ ...prev, [campo]: undefined }))
   }
 
+  // Al cambiar de desarrollo se resetea el modelo (las opciones dependen de él)
+  const cambiarDesarrollo = (e: { target: { value: string } }) => {
+    setForm((prev) => ({ ...prev, desarrollo: e.target.value, modelo: '' }))
+  }
+
+  const modelosDelDesarrollo =
+    MODELOS_POR_PROYECTO[form.desarrollo as keyof typeof MODELOS_POR_PROYECTO] ?? []
+
   const validar = (): boolean => {
     const nuevos: Errores = {}
     if (!form.nombre.trim()) nuevos.nombre = 'El nombre es obligatorio'
@@ -91,7 +99,7 @@ export default function AltaAfluenciaForm({ onVolver, onPasarAAltaCliente }: Pro
       ...(form.email.trim() ? { email: form.email.trim() } : {}),
       ...(form.origen ? { origen: form.origen } : {}),
       ...(form.desarrollo ? { desarrollo: form.desarrollo } : {}),
-      ...(form.tipoPropiedad ? { tipoPropiedad: form.tipoPropiedad } : {}),
+      ...(form.modelo ? { modelo: form.modelo } : {}),
       ...(form.medioContacto.trim() ? { medioContacto: form.medioContacto.trim() } : {}),
       ...(form.edad.trim() ? { edad: form.edad.trim() } : {}),
       ...(form.estadoCivil ? { estadoCivil: form.estadoCivil } : {}),
@@ -212,7 +220,7 @@ export default function AltaAfluenciaForm({ onVolver, onPasarAAltaCliente }: Pro
           <select
             id="afluencia-desarrollo"
             value={form.desarrollo}
-            onChange={cambiar('desarrollo')}
+            onChange={cambiarDesarrollo}
             className={inputClase}
           >
             <option value="">Sin especificar</option>
@@ -224,18 +232,21 @@ export default function AltaAfluenciaForm({ onVolver, onPasarAAltaCliente }: Pro
           </select>
         </label>
 
-        <label htmlFor="afluencia-tipo-propiedad" className="block">
+        <label htmlFor="afluencia-modelo" className="block">
           <span className={labelClase}>Departamento o casa de interés</span>
           <select
-            id="afluencia-tipo-propiedad"
-            value={form.tipoPropiedad}
-            onChange={cambiar('tipoPropiedad')}
-            className={inputClase}
+            id="afluencia-modelo"
+            value={form.modelo}
+            onChange={cambiar('modelo')}
+            disabled={form.desarrollo === ''}
+            className={`${inputClase} disabled:bg-neutral-100 disabled:text-neutral-400`}
           >
-            <option value="">— Selecciona —</option>
-            {TIPOS_PROPIEDAD_LEAD.map((t) => (
-              <option key={t} value={t}>
-                {t}
+            <option value="">
+              {form.desarrollo === '' ? 'Selecciona primero el desarrollo' : '— Selecciona —'}
+            </option>
+            {modelosDelDesarrollo.map((m) => (
+              <option key={m} value={m}>
+                {m}
               </option>
             ))}
           </select>