Bug: Room list query flickers on every connection state change

Aperta Adatta ai principianti
  • Qualcosa non va?
#7,437 1 commento 1 reazione 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
1/5
Tempo stimato
Meno di un'ora
Idoneità per principianti
86/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Tranquilla
Stack tecnologico
react-native, typescript
Ambito
mobile

Direzione di ricerca

Leggi app/views/RoomsListView/hooks/useSubscriptions.ts, concentrandoti sulla chiamata a useAppSelector e sull’array delle dipendenze di useEffect. Limita la selezione all’URL del server attivo, quindi verifica che le modifiche allo stato della connessione non attivino più nuove query dell’elenco delle stanze né la ricreazione della sottoscrizione, mentre le modifiche del server continuano a farlo.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

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.

Lingua principale
TypeScript
Stelle
2.4k
Fork
1.5k
Merge medio
1g 15h
PR unite (30g)
29

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di RocketChat/Rocket.Chat.ReactNative

Tutte le issue di RocketChat/Rocket.Chat.ReactNative

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.