Datos del usuario en sesión – Guía de uso

Este documento explica cómo recuperar y reaccionar a los datos del usuario logueado (nombre, correo, allAttributes, etc.) desde cualquier Microfrontend Remoto, usando AlpuraUserService de @alpura/core.

tip

AlpuraUserService expone el usuario logueado como un signal de Angular. Esto significa que el dato puede no estar disponible de inmediato (por ejemplo, en el constructor o al inicio de ngOnInit), ya que se resuelve de forma asíncrona en el Shell. Por eso se recomienda leerlo mediante effect() en vez de leerlo una sola vez.

📁 Importaciones necesarias

En tu componente o servicio importa AlpuraUserService desde la librería @alpura/core.

import { AlpuraUserService } from '@alpura/core';

🧩 Paso 1 | Tipa el usuario en tu MFE

AlpuraUserService no expone un modelo tipado (el signal user() retorna unknown/Record<string, any>), por lo que se recomienda declarar una interfaz local en tu Microfrontend con los campos que vayas a usar. Esto te da autocompletado y seguridad de tipos en el resto del código.

// shared/utils/helpers.components.ts

/**
 * Interfaz del Usuario AlpuraUserService
 */
export interface IUserService {
  /** Username de quien realizó la última modificación (metadato de auditoría) */
  lastModifiedUsername: string | null;
  /** Fecha de la última modificación (metadato de auditoría) */
  lastModifiedDate: string | null;
  /** Username de quien creó el registro (metadato de auditoría) */
  creatorUsername: string | null;
  /** Fecha de creación del registro (metadato de auditoría) */
  creationDate: string | null;
  /** Estatus de actividad del usuario */
  active: boolean | null;
  /** ID interno del usuario */
  id: number | null;
  /** Nombre de usuario */
  userName: string;
  /** Identificador único del usuario en el proveedor de identidad (Keycloak) */
  subjectId: string;
  /** Apellido del usuario */
  userSurname: string;
  /** Género del usuario */
  gender: string | null;
  /** Puesto/cargo del usuario */
  position: string | null;
  /** Nombre completo del usuario */
  userFullname: string;
  /** Correo electrónico del usuario */
  userEmail: string;
  /** Atributos adicionales devueltos por el proveedor de identidad */
  customAttributes: Record<string, unknown>;
  /** Atributos custom del usuario. Ver [All Attributes](./all-attributes.md) para el detalle de cómo consumirlos. */
  allAttributes: Record<string, string>;
}

🧩 Paso 2 | Suscríbete al usuario con `effect()`

Inyecta AlpuraUserService y usa un effect() para capturar el usuario apenas esté disponible y guardarlo en una propiedad del componente. Este es el patrón utilizado en producción (gestion-estudio.component.ts):

import { Component, effect, inject } from '@angular/core';
import { AlpuraUserService } from '@alpura/core';
import { IUserService } from '../../../shared/utils/helpers.components';

export class MyComponent {
  /** Servicio de usuario para obtener el usuario logueado. */
  private readonly userService = inject(AlpuraUserService);

  /** Usuario logueado (detectado por userEffect). */
  public userLogged = {} as IUserService;

  /**
   * Efecto que detecta el usuario logueado y actualiza userLogged.
   * Se dispara automáticamente cada vez que el signal `user()` cambia.
   */
  private readonly userEffect = effect(() => {
    const userSvc = this.userService;
    if (!userSvc) return;

    const user = userSvc.user?.() as IUserService | null;
    if (!user) return;

    this.userLogged = user;
    // A partir de aquí ya puedes usar this.userLogged de forma segura,
    // por ejemplo disparando una carga de datos que depende del usuario.
  });
}

Nota: al declarar el effect() como propiedad de clase (private readonly userEffect = effect(...)), Angular lo asocia automáticamente al contexto de inyección del componente y lo limpia al destruirse — no necesitas desuscribirte manualmente.

⚠️ Consideraciones importantes

Punto	Detalle
Disponibilidad asíncrona	El signal `user()` puede estar `null`/`undefined` al inicio. Usa `effect()` en vez de leerlo una sola vez en el constructor.
Tipado local	`AlpuraUserService` no expone un modelo; define tu propia interfaz (`IUserService`) en el MFE con los campos que necesites, incluyendo `allAttributes`.
`allAttributes` es dinámico	Su contenido varía por usuario/configuración en Keycloak. Para el detalle de cómo recuperarlo, ver All Attributes.
Limpieza automática	Un `effect()` declarado como propiedad de clase se limpia solo al destruirse el componente; no requiere `takeUntilDestroyed` ni desuscripción manual.
Uso alternativo simple	Si solo necesitas mostrar el dato en el HTML sin procesarlo, puedes usar `user()` directamente en el template (ver AlpuraUserService).

🚀 Resultado esperado

Esta implementación permite a cualquier Microfrontend Remoto recuperar de forma reactiva y tipada los datos del usuario logueado —incluyendo sus atributos custom (allAttributes)— y construir reglas de negocio a partir de ellos sin depender del storageMap ni de llamadas adicionales al backend.

📬 Soporte

Para dudas o mejoras, puedes contactar al equipo de arquitectura.

📁 Importaciones necesarias​

🧩 Paso 1 | Tipa el usuario en tu MFE​

🧩 Paso 2 | Suscríbete al usuario con effect()​

⚠️ Consideraciones importantes​

🚀 Resultado esperado​

📬 Soporte​