RocketChat / RocketChat/Rocket.Chat.ReactNative
Bug: Room list query flickers on every connection state change
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 2.4k
- Forks
- 1.5k
- Avg merge
- 1d 18h
- Merged PRs (30d)
- 90
Description
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.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Read app/views/RoomsListView/hooks/useSubscriptions.ts, focusing on the useAppSelector call and the useEffect dependency array. Narrow the selection to the active server URL, then verify that connection-state changes no longer trigger room-list re-queries or subscription recreation while server changes still do.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 1/5
- Estimated time
- Under an hour
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 86/100