From 3b5a880936cdb2b68e781c515e9dbf083670cd21 Mon Sep 17 00:00:00 2001 From: bennybakshi Date: Wed, 26 Nov 2025 20:16:07 +0200 Subject: [PATCH] fix(ReservationList): prevent FlatList from rendering with empty data FlatList has a known bug where it gets stuck and won't render items if it's initially mounted with empty data. This happens because the reservations state starts empty and gets populated in componentDidMount. By the time componentDidMount runs, the FlatList has already been created with data=[], causing it to become unresponsive to new data. This fix shows the loading indicator until reservations are actually populated, avoiding the empty-data initialization issue. Fixes scrolling issues in Agenda where only ~10-20 items would render and users couldn't scroll further. Related: https://github.com/facebook/react-native/issues/39421 --- src/agenda/reservation-list/index.tsx | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/agenda/reservation-list/index.tsx b/src/agenda/reservation-list/index.tsx index f364d9c835..11ac4ef1bb 100644 --- a/src/agenda/reservation-list/index.tsx +++ b/src/agenda/reservation-list/index.tsx @@ -270,6 +270,13 @@ class ReservationList extends Component { return ; } + // Prevent FlatList from rendering with empty data to avoid React Native bug + // where FlatList gets stuck and won't render items added later. + // See: https://github.com/facebook/react-native/issues/39421 + if (!this.state.reservations || this.state.reservations.length === 0) { + return ; + } + return (