feat(alta): conversión directa afluencia → alta de cliente

Tras registrar la afluencia, la pantalla de éxito ofrece 'Pasar a Alta
de Cliente': abre el wizard prellenado con los datos recién capturados
(nombre, email, celular) y el leadMondayId ya ligado, sin rebuscar el
lead. Quedan también 'Capturar otro' y 'Volver'.

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

@@ -26,7 +26,7 @@ const llenarRequeridos = () => {
 
 describe('AltaAfluenciaForm', () => {
   it('sin nombre ni teléfono no llama al API y muestra los errores', () => {
-    render(<AltaAfluenciaForm onVolver={() => undefined} />)
+    render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={() => undefined} />)
     fireEvent.click(screen.getByRole('button', { name: /Registrar en afluencia/ }))
 
     expect(fetchMock).not.toHaveBeenCalled()
@@ -35,7 +35,7 @@ describe('AltaAfluenciaForm', () => {
   })
 
   it('con email inválido no llama al API', () => {
-    render(<AltaAfluenciaForm onVolver={() => undefined} />)
+    render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={() => undefined} />)
     llenarRequeridos()
     fireEvent.change(screen.getByLabelText(/^Email/), { target: { value: 'correo-malo' } })
     fireEvent.click(screen.getByRole('button', { name: /Registrar en afluencia/ }))
@@ -46,7 +46,7 @@ describe('AltaAfluenciaForm', () => {
 
   it('al registrar (201) muestra el mensaje de éxito', async () => {
     fetchMock.mockResolvedValueOnce(respuesta({ id: 'l-1', estado: 'NUEVO', oportunidadId: 'op-1' }))
-    render(<AltaAfluenciaForm onVolver={() => undefined} />)
+    render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={() => undefined} />)
     llenarRequeridos()
     fireEvent.change(screen.getByLabelText(/^Origen/), { target: { value: 'Web' } })
     fireEvent.change(screen.getByLabelText(/Desarrollo de interés/), { target: { value: 'SENDA' } })
@@ -69,7 +69,7 @@ describe('AltaAfluenciaForm', () => {
     fetchMock.mockResolvedValueOnce(
       respuesta({ error: 'Ya existe un lead con ese teléfono', leadId: 'l-9', nombre: 'ANA DEMO' }, 409),
     )
-    render(<AltaAfluenciaForm onVolver={() => undefined} />)
+    render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={() => undefined} />)
     llenarRequeridos()
     fireEvent.click(screen.getByRole('button', { name: /Registrar en afluencia/ }))
 
@@ -80,7 +80,7 @@ describe('AltaAfluenciaForm', () => {
 
   it('con error de red muestra un mensaje reintentable', async () => {
     fetchMock.mockRejectedValueOnce(new Error('red caída'))
-    render(<AltaAfluenciaForm onVolver={() => undefined} />)
+    render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={() => undefined} />)
     llenarRequeridos()
     fireEvent.click(screen.getByRole('button', { name: /Registrar en afluencia/ }))
 
@@ -91,7 +91,7 @@ describe('AltaAfluenciaForm', () => {
 
   it('"Capturar otro" limpia el formulario tras el éxito', async () => {
     fetchMock.mockResolvedValueOnce(respuesta({ id: 'l-1', estado: 'NUEVO', oportunidadId: 'op-1' }))
-    render(<AltaAfluenciaForm onVolver={() => undefined} />)
+    render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={() => undefined} />)
     llenarRequeridos()
     fireEvent.click(screen.getByRole('button', { name: /Registrar en afluencia/ }))
 
@@ -104,8 +104,28 @@ describe('AltaAfluenciaForm', () => {
 
   it('"Volver" avisa a la pantalla de entrada', () => {
     const onVolver = vi.fn()
-    render(<AltaAfluenciaForm onVolver={onVolver} />)
+    render(<AltaAfluenciaForm onVolver={onVolver} onPasarAAltaCliente={() => undefined} />)
     fireEvent.click(screen.getByRole('button', { name: 'Volver' }))
     expect(onVolver).toHaveBeenCalled()
   })
+
+  it('tras el éxito, "Pasar a Alta de Cliente" entrega el lead recién creado', async () => {
+    fetchMock.mockResolvedValueOnce(respuesta({ id: 'l-1', estado: 'NUEVO', oportunidadId: 'op-1' }))
+    const onPasar = vi.fn()
+    render(<AltaAfluenciaForm onVolver={() => undefined} onPasarAAltaCliente={onPasar} />)
+    llenarRequeridos()
+    fireEvent.change(screen.getByLabelText(/^Email/), { target: { value: 'ana@correo.com' } })
+    fireEvent.click(screen.getByRole('button', { name: /Registrar en afluencia/ }))
+
+    fireEvent.click(await screen.findByRole('button', { name: /Pasar a Alta de Cliente/ }))
+
+    expect(onPasar).toHaveBeenCalledWith({
+      id: 'l-1',
+      nombre: 'Ana Demo',
+      telefono: '6641234567',
+      email: 'ana@correo.com',
+      estado: 'NUEVO',
+      origen: '',
+    })
+  })
 })

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

@@ -1,10 +1,13 @@
 import { useState, type FormEvent } from 'react'
 import { z } from 'zod'
-import { crearLead } from '../services/api'
+import { crearLead, type LeadResumen } from '../services/api'
 import { DESARROLLOS_LEAD, ORIGENES_LEAD } from '../data/constantes'
 
 interface Props {
   onVolver: () => void
+  /** Conversión directa: tras registrar la afluencia, abrir el alta completa
+   *  prellenada con los datos recién capturados (sin rebuscar el lead) */
+  onPasarAAltaCliente: (lead: LeadResumen) => void
 }
 
 const emailSchema = z.string().trim().email()
@@ -27,11 +30,11 @@ const FORM_INICIAL = { nombre: '', telefono: '', email: '', origen: '', desarrol
  * lead en Monday y su oportunidad en etapa Afluencia. El alta completa de
  * cliente sigue siendo el wizard del picker.
  */
-export default function AltaAfluenciaForm({ onVolver }: Props) {
+export default function AltaAfluenciaForm({ onVolver, onPasarAAltaCliente }: Props) {
   const [form, setForm] = useState(FORM_INICIAL)
   const [errores, setErrores] = useState<Errores>({})
   const [enviando, setEnviando] = useState(false)
-  const [exito, setExito] = useState(false)
+  const [leadCreado, setLeadCreado] = useState<LeadResumen | null>(null)
   const [aviso, setAviso] = useState('')
 
   const cambiar = (campo: keyof typeof FORM_INICIAL) => (e: { target: { value: string } }) => {
@@ -65,7 +68,14 @@ export default function AltaAfluenciaForm({ onVolver }: Props) {
     })
     setEnviando(false)
     if (res.ok) {
-      setExito(true)
+      setLeadCreado({
+        id: res.lead.id,
+        nombre: form.nombre.trim(),
+        telefono: form.telefono.trim(),
+        email: form.email.trim(),
+        estado: res.lead.estado,
+        origen: form.origen,
+      })
     } else if (res.motivo === 'duplicado') {
       setAviso(`Ya existe un lead con ese teléfono: ${res.nombre}.`)
     } else {
@@ -77,10 +87,10 @@ export default function AltaAfluenciaForm({ onVolver }: Props) {
     setForm(FORM_INICIAL)
     setErrores({})
     setAviso('')
-    setExito(false)
+    setLeadCreado(null)
   }
 
-  if (exito) {
+  if (leadCreado !== null) {
     return (
       <div className="max-w-md">
         <p
@@ -89,11 +99,18 @@ export default function AltaAfluenciaForm({ onVolver }: Props) {
         >
           Registrado en afluencia — se asignará por round-robin
         </p>
-        <div className="mt-6 flex gap-3">
+        <div className="mt-6 flex flex-wrap gap-3">
+          <button
+            type="button"
+            onClick={() => onPasarAAltaCliente(leadCreado)}
+            className="bg-accent px-5 py-2.5 text-xs font-bold uppercase tracking-widest text-white transition-colors duration-150 hover:bg-neutral-900"
+          >
+            Pasar a Alta de Cliente
+          </button>
           <button
             type="button"
             onClick={capturarOtro}
-            className="bg-accent px-5 py-2.5 text-xs font-bold uppercase tracking-widest text-white transition-colors duration-150 hover:bg-neutral-900"
+            className="border border-accent bg-white px-5 py-2.5 text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:bg-accent hover:text-white"
           >
             Capturar otro
           </button>