Skip to main content

El hook compartido

Cada frontend de BBrandsLab se suscribe a través de un único hook agnóstico al framework, usePusherChannel, exportado desde @bbrandslab/ui.

Un socket por (key, cluster)

Los clientes se memoizan a nivel de módulo para que varias suscripciones en la misma página reutilicen un único WebSocket.

pusher-js perezoso

Cargado con un import dinámico. pusher-js es una peer dependency del paquete UI; cada app consumidora lo declara como dependencia directa.

Buffer acotado

Los eventos se agrupan por frame de animación y se limitan a maxEvents (por defecto 250), de modo que los canales de alto throughput nunca congelen la UI.

Desactivación elegante

Un pusherKey vacío/indefinido produce status: "disabled" sin abrir un socket.
Cuando se omite events, el hook enlaza cada evento del canal y filtra los eventos del sistema de Pusher.

Variables de entorno del cliente

La key es pública por diseño; solo el servidor tiene INTEGRATION_PUSHER_SECRET. Los canales privados se autorizan a través de POST /api/v3/realtime/pusher/auth.

Apps consumidoras

portal-customer

Se suscribe al canal del contrato digital e invalida la query del contrato cuando llega un evento de etapa de firma.

horizon-enterprise

Se suscribe a los canales de NOC y de tótems de Maihue Street; combina la invalidación de Pusher con un poll de notificaciones de 60 s.

Fallback de polling

El tiempo real es opcional, así que cada consumidor mantiene un fallback basado en query. Cuando no hay una key de Pusher configurada, la UI depende solo del refetching de React Query. Diseña cada pantalla para que sea totalmente utilizable sin tiempo real.