Skip to main content

​
Visión general

La funcionalidad de chat en tiempo real se implementa con Stream Chat Expo SDK (v8.13.x). El módulo completo se encuentra en src/modules/chat/.

​
Estructura del módulo

Store

store/chatStore.ts — Zustand store que gestiona el estado del chat.

Auth Service

services/authService.ts — Token provider para autenticación con Stream.

Contexts

contexts/ — React contexts para la gestión de canales.

Rutas

Rutas de chat bajo /chat/ con file-based routing de Expo Router.

​
Store (Zustand)

El store en store/chatStore.ts gestiona todo el estado de la integración con Stream Chat:
El store utiliza middlewares de devtools y persist de Zustand para facilitar el debugging y mantener el estado entre sesiones.

​
Autenticación

El servicio services/authService.ts actúa como token provider para Stream Chat. Se encarga de obtener y renovar los tokens de autenticación necesarios para conectar al usuario con el servicio de mensajería.
Los tokens de Stream Chat tienen expiración. El store gestiona automáticamente la renovación antes de que expiren.

​
Rutas de chat

/chat/[channelType]/[channelId]/ Vista principal de conversación dentro de un canal. Recibe el tipo y el ID del canal como parámetros dinámicos.

​
Integración en la app

​
OverlayProvider

El OverlayProvider de Stream Chat envuelve toda la aplicación desde el root layout. Este componente es necesario para que funcionen los overlays del SDK (previews de imágenes, menús contextuales, etc.).

​
Badge de mensajes no leídos

El tab Inbox en la navegación principal muestra un badge con el conteo de mensajes no leídos.

​
Conteo combinado

El hook useCombinedUnreadCount agrega el conteo total de mensajes no leídos de todos los canales del usuario, proporcionando un número unificado para mostrar en la UI.

​
Archivos clave