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.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>