feat: PWA instalable, cambio de contraseña y dashboards por rol

- POST /api/auth/cambiar-password (bcrypt 12, política ≥8+1 número) +
  modal en las 6 apps con auth
- PWA: manifest + íconos de marca en las 7 apps (sin service worker a
  propósito, documentado); instalable en celular
- Dashboards: 'Mi tablero' para vendedor (sus KPIs y funnel) y sección
  Equipo para coordinador/corporativo/admin
- mi-dia: equipo.porVendedor gana leadsNuevosSemana
- Tests: api 271, cotizador 88, alta 88, cobranza 81, agente-ia 19,
  dashboards 15, mi-dia 11, landing 4

apps/agente-ia/index.html

@@ -3,6 +3,9 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="theme-color" content="#1B4332" />
+    <link rel="manifest" href="/ai/manifest.webmanifest" />
+    <link rel="apple-touch-icon" href="/ai/icons/icon-192.png" />
     <title>FRASA Desarrollos — Asistente IA</title>
   </head>
   <body>

apps/agente-ia/public/manifest.webmanifest

@@ -0,0 +1,13 @@
+{
+  "name": "Frasa · Asistente IA",
+  "short_name": "Asistente IA",
+  "start_url": "/ai/",
+  "scope": "/ai/",
+  "display": "standalone",
+  "background_color": "#ffffff",
+  "theme_color": "#1B4332",
+  "icons": [
+    { "src": "/ai/icons/icon-192.png", "sizes": "192x192", "type": "image/png" },
+    { "src": "/ai/icons/icon-512.png", "sizes": "512x512", "type": "image/png" }
+  ]
+}

apps/agente-ia/src/components/AuthGate.tsx

@@ -1,13 +1,16 @@
 import { useState, type ReactNode } from 'react'
 import { getSesion, logout, type Sesion } from '../services/auth'
+import CambiarPasswordModal from './CambiarPasswordModal'
 import LoginScreen from './LoginScreen'
 
 /**
  * Gate de autenticación: sin sesión solo se ve el login; con sesión se ve la
- * app con una barra discreta "nombre · rol" y botón "Salir".
+ * app con una barra discreta "nombre · rol", "Contraseña" (modal de cambio)
+ * y botón "Salir".
  */
 export default function AuthGate({ children }: { children: ReactNode }) {
   const [sesion, setSesion] = useState<Sesion | null>(() => getSesion())
+  const [modalPassword, setModalPassword] = useState(false)
 
   if (!sesion) {
     return <LoginScreen onLogin={() => setSesion(getSesion())} />
@@ -20,19 +23,29 @@ export default function AuthGate({ children }: { children: ReactNode }) {
           <span className="text-xs font-bold uppercase tracking-widest text-neutral-500">
             {sesion.usuario.nombre} · {sesion.usuario.rol}
           </span>
-          <button
-            type="button"
-            onClick={() => {
-              logout()
-              setSesion(null)
-            }}
-            className="text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:text-accent-hover"
-          >
-            Salir
-          </button>
+          <div className="flex items-center gap-4">
+            <button
+              type="button"
+              onClick={() => setModalPassword(true)}
+              className="text-xs font-bold uppercase tracking-widest text-neutral-500 transition-colors duration-150 hover:text-neutral-900"
+            >
+              Contraseña
+            </button>
+            <button
+              type="button"
+              onClick={() => {
+                logout()
+                setSesion(null)
+              }}
+              className="text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:text-accent-hover"
+            >
+              Salir
+            </button>
+          </div>
         </div>
       </div>
       {children}
+      {modalPassword && <CambiarPasswordModal onCerrar={() => setModalPassword(false)} />}
     </div>
   )
 }

apps/agente-ia/src/components/CambiarPasswordModal.tsx

@@ -0,0 +1,140 @@
+import { useState, type FormEvent } from 'react'
+import { validarConfirmacion, validarPasswordNueva } from '../lib/password'
+import { cambiarPassword } from '../services/auth'
+
+const CLASE_INPUT =
+  'w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none'
+const CLASE_LABEL = 'mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500'
+
+/**
+ * Modal "Cambiar contraseña": actual + nueva + confirmar. Valida en cliente
+ * con la misma regla del API y muestra el mensaje del API si la actual no es
+ * correcta. Al éxito la sesión sigue intacta (el JWT no cambia).
+ */
+export default function CambiarPasswordModal({ onCerrar }: { onCerrar: () => void }) {
+  const [actual, setActual] = useState('')
+  const [nueva, setNueva] = useState('')
+  const [confirmar, setConfirmar] = useState('')
+  const [error, setError] = useState<string | null>(null)
+  const [exito, setExito] = useState(false)
+  const [cargando, setCargando] = useState(false)
+
+  async function enviar(e: FormEvent) {
+    e.preventDefault()
+    const errorCliente = validarPasswordNueva(nueva) ?? validarConfirmacion(nueva, confirmar)
+    if (errorCliente) {
+      setError(errorCliente)
+      return
+    }
+    setError(null)
+    setCargando(true)
+    try {
+      await cambiarPassword(actual, nueva)
+      setExito(true)
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'No se pudo cambiar la contraseña')
+    } finally {
+      setCargando(false)
+    }
+  }
+
+  return (
+    <div
+      className="fixed inset-0 z-50 flex items-center justify-center bg-black/40 px-4"
+      role="dialog"
+      aria-modal="true"
+      aria-label="Cambiar contraseña"
+    >
+      <div className="w-full max-w-sm border border-neutral-200 bg-white p-6">
+        <h2 className="mb-6 text-xs font-bold uppercase tracking-widest text-neutral-500">
+          Cambiar contraseña
+        </h2>
+        {exito ? (
+          <>
+            <p className="border border-accent px-4 py-3 text-xs font-bold uppercase tracking-widest text-accent">
+              Contraseña actualizada
+            </p>
+            <button
+              type="button"
+              onClick={onCerrar}
+              className="mt-6 w-full bg-accent px-5 py-3 text-xs font-bold uppercase tracking-widest text-white transition-colors duration-150 hover:bg-accent-hover"
+            >
+              Cerrar
+            </button>
+          </>
+        ) : (
+          <form onSubmit={enviar} className="space-y-6">
+            <div>
+              <label htmlFor="password-actual" className={CLASE_LABEL}>
+                Contraseña actual
+              </label>
+              <input
+                id="password-actual"
+                type="password"
+                value={actual}
+                onChange={(e) => setActual(e.target.value)}
+                autoComplete="current-password"
+                autoFocus
+                required
+                className={CLASE_INPUT}
+              />
+            </div>
+            <div>
+              <label htmlFor="password-nueva" className={CLASE_LABEL}>
+                Nueva contraseña
+              </label>
+              <input
+                id="password-nueva"
+                type="password"
+                value={nueva}
+                onChange={(e) => setNueva(e.target.value)}
+                autoComplete="new-password"
+                required
+                className={CLASE_INPUT}
+              />
+              <p className="mt-2 text-xs text-neutral-400">Mínimo 8 caracteres y un número</p>
+            </div>
+            <div>
+              <label htmlFor="password-confirmar" className={CLASE_LABEL}>
+                Confirmar nueva contraseña
+              </label>
+              <input
+                id="password-confirmar"
+                type="password"
+                value={confirmar}
+                onChange={(e) => setConfirmar(e.target.value)}
+                autoComplete="new-password"
+                required
+                className={CLASE_INPUT}
+              />
+            </div>
+            {error && (
+              <p
+                role="alert"
+                className="border border-red-700 px-4 py-3 text-xs font-bold uppercase tracking-widest text-red-700"
+              >
+                {error}
+              </p>
+            )}
+            <div className="flex gap-3">
+              <button
+                type="submit"
+                disabled={cargando}
+                className="flex-1 bg-accent px-5 py-3 text-xs font-bold uppercase tracking-widest text-white transition-colors duration-150 hover:bg-accent-hover disabled:opacity-50"
+              >
+                {cargando ? 'Guardando…' : 'Guardar'}
+              </button>
+              <button
+                type="button"
+                onClick={onCerrar}
+                className="border border-neutral-300 px-5 py-3 text-xs font-bold uppercase tracking-widest text-neutral-500 transition-colors duration-150 hover:border-neutral-500"
+              >
+                Cancelar
+              </button>
+            </div>
+          </form>
+        )}
+      </div>
+    </div>
+  )
+}

apps/agente-ia/src/lib/password.test.ts

@@ -0,0 +1,22 @@
+import { describe, expect, it } from 'vitest'
+import { validarConfirmacion, validarPasswordNueva } from './password'
+
+describe('validarPasswordNueva', () => {
+  it('exige ≥8 caracteres y al menos un número (misma regla que el API)', () => {
+    expect(validarPasswordNueva('corta1')).toContain('8 caracteres')
+    expect(validarPasswordNueva('sinnumeros')).toContain('número')
+    expect(validarPasswordNueva('')).toBeTruthy()
+  })
+
+  it('acepta contraseñas que cumplen la regla', () => {
+    expect(validarPasswordNueva('Frasa2026')).toBeNull()
+    expect(validarPasswordNueva('12345678')).toBeNull()
+  })
+})
+
+describe('validarConfirmacion', () => {
+  it('null si coinciden; mensaje si difieren', () => {
+    expect(validarConfirmacion('abc12345', 'abc12345')).toBeNull()
+    expect(validarConfirmacion('abc12345', 'abc12346')).toContain('no coincide')
+  })
+})

apps/agente-ia/src/lib/password.ts

@@ -0,0 +1,16 @@
+// Validación cliente de la contraseña nueva: misma regla que el API
+// (api-gateway/src/services/auth.service.ts). El API vuelve a validar;
+// esto solo evita un viaje de red con errores obvios.
+
+/** null si cumple; mensaje si no (≥8 caracteres y al menos 1 número) */
+export function validarPasswordNueva(nueva: string): string | null {
+  if (nueva.length < 8 || !/\d/.test(nueva)) {
+    return 'La nueva contraseña debe tener al menos 8 caracteres y un número'
+  }
+  return null
+}
+
+/** null si la confirmación coincide con la nueva; mensaje si difiere */
+export function validarConfirmacion(nueva: string, confirmar: string): string | null {
+  return nueva === confirmar ? null : 'La confirmación no coincide con la nueva contraseña'
+}

apps/agente-ia/src/services/auth.test.ts

@@ -1,6 +1,7 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import {
   ErrorLogin,
+  cambiarPassword,
   conAuth,
   getSesion,
   getToken,
@@ -122,3 +123,37 @@ describe('manejar401', () => {
     expect(getSesion()).not.toBeNull()
   })
 })
+
+describe('cambiarPassword', () => {
+  it('204: resuelve sin tocar la sesión y manda Bearer + ambas contraseñas', async () => {
+    localStorage.setItem('frasa_auth', JSON.stringify(sesionOk))
+    const fetchMock = vi.fn().mockResolvedValue(new Response(null, { status: 204 }))
+    vi.stubGlobal('fetch', fetchMock)
+
+    await cambiarPassword('Frasa2026', 'NuevaPass2026')
+
+    const [url, init] = fetchMock.mock.calls[0] as [string, RequestInit]
+    expect(url).toContain('/auth/cambiar-password')
+    expect(init.method).toBe('POST')
+    expect(init.headers).toMatchObject({ Authorization: 'Bearer jwt-de-prueba' })
+    expect(JSON.parse(init.body as string)).toEqual({ actual: 'Frasa2026', nueva: 'NuevaPass2026' })
+    expect(getSesion()).not.toBeNull()
+  })
+
+  it('400 del API: lanza Error con el mensaje del API (p. ej. actual incorrecta)', async () => {
+    vi.stubGlobal(
+      'fetch',
+      vi.fn().mockResolvedValue(
+        new Response('{"error":"La contraseña actual no es correcta"}', { status: 400 }),
+      ),
+    )
+    await expect(cambiarPassword('mala', 'NuevaPass2026')).rejects.toThrow(
+      'La contraseña actual no es correcta',
+    )
+  })
+
+  it('sin red: Error de conexión', async () => {
+    vi.stubGlobal('fetch', vi.fn().mockRejectedValue(new TypeError('fetch failed')))
+    await expect(cambiarPassword('a', 'b12345678')).rejects.toThrow('No se pudo conectar')
+  })
+})

apps/agente-ia/src/services/auth.ts

@@ -75,3 +75,28 @@ export function manejar401(res: Response): void {
   logout()
   if (typeof window !== 'undefined') window.location.reload()
 }
+
+/**
+ * POST /auth/cambiar-password. Lanza Error con el mensaje del API cuando
+ * falla (p. ej. "La contraseña actual no es correcta"); no toca la sesión.
+ */
+export async function cambiarPassword(actual: string, nueva: string): Promise<void> {
+  let res: Response
+  try {
+    res = await fetch(
+      `${API_URL}/auth/cambiar-password`,
+      conAuth({
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ actual, nueva }),
+      }),
+    )
+  } catch {
+    throw new Error('No se pudo conectar con el servidor')
+  }
+  manejar401(res)
+  if (!res.ok) {
+    const body = (await res.json().catch(() => null)) as { error?: string } | null
+    throw new Error(body?.error ?? `Error ${res.status}`)
+  }
+}