Bug: Room list query flickers on every connection state change

Abierto Apto para principiantes
  • ¿Algo no está bien?
#7,437 1 comentario 1 reacción 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
1/5
Tiempo estimado
Menos de una hora
Aptitud para principiantes
86/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Tranquilo
Stack tecnológico
react-native, typescript
Área
mobile

Línea de trabajo

Lee app/views/RoomsListView/hooks/useSubscriptions.ts, centrándote en la llamada a useAppSelector y en el array de dependencias de useEffect. Limita la selección a la URL del servidor activo y verifica después que los cambios en el estado de la conexión ya no provoquen nuevas consultas de la lista de salas ni la recreación de la suscripción, mientras que los cambios del servidor sí lo sigan haciendo.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

type: bug
Description

useSubscriptions triggers active WatermelonDB room list queries every time connection status transitions (e.g., from connecting to connected, or loading to not loading), even if subscription records are unmodified. This leads to room list query flickering on every connection state change.

Cause

In app/views/RoomsListView/hooks/useSubscriptions.ts, the hook selects the entire state.server object:

const server = useAppSelector(state => state.server);

Since state.server contains fields like connecting, loading, and others that change as the connection state changes, selecting the entire state.server object causes the useEffect inside useSubscriptions.ts to trigger on every connection status change because its dependency array includes server:

}, [isGrouping, sortBy, useRealName, showUnread, showFavorites, groupByType, roles, server]);

This forces the hook to re-query WatermelonDB and recreate the subscription, causing a visible flicker in the room list on every connection state transition.

Solution

Narrow the selector in useSubscriptions.ts to select only the server URL instead of the entire server state:

const server = useAppSelector(state => state.server.server);

This ensures that the useEffect is only triggered when the active server actually changes, and not when the connection state of the current server transitions.

Lenguaje dominante
TypeScript
Estrellas
2.4k
Forks
1.5k
Merge medio
1 d 15 h
PR fusionados (30 d)
29

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de RocketChat/Rocket.Chat.ReactNative

Todos los issues de RocketChat/Rocket.Chat.ReactNative

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.