fixed pagination

This commit is contained in:
Reinaldo Neto 2023-01-20 17:13:35 -03:00
parent eb63bf093e
commit bd591434ed
1 changed files with 13 additions and 10 deletions

View File

@ -46,12 +46,13 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
const [discussions, setDiscussions] = useState<IMessageFromServer[]>([]); const [discussions, setDiscussions] = useState<IMessageFromServer[]>([]);
const [search, setSearch] = useState<IMessageFromServer[]>([]); const [search, setSearch] = useState<IMessageFromServer[]>([]);
const [isSearching, setIsSearching] = useState(false); const [isSearching, setIsSearching] = useState(false);
const [total, setTotal] = useState(0); const total = useRef(0);
const searchText = useRef('');
const offset = useRef(0); const offset = useRef(0);
const { colors } = useTheme(); const { colors } = useTheme();
const load = async (text = '') => { const load = async () => {
if (loading) { if (loading) {
return; return;
} }
@ -62,17 +63,17 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
roomId: rid, roomId: rid,
offset: offset.current, offset: offset.current,
count: API_FETCH_COUNT, count: API_FETCH_COUNT,
text text: searchText.current
}); });
if (result.success) { if (result.success) {
offset.current += result.count;
total.current = result.total;
if (isSearching) { if (isSearching) {
setSearch(prevState => (offset.current ? [...prevState, ...result.messages] : result.messages)); setSearch(prevState => (offset.current ? [...prevState, ...result.messages] : result.messages));
} else { } else {
setDiscussions(result.messages); setDiscussions(result.messages);
} }
offset.current += API_FETCH_COUNT;
setTotal(result.total);
} }
setLoading(false); setLoading(false);
} catch (e) { } catch (e) {
@ -83,15 +84,17 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
const onSearchChangeText = useDebounce(async (text: string) => { const onSearchChangeText = useDebounce(async (text: string) => {
setIsSearching(true); setIsSearching(true);
offset.current = 0;
setSearch([]); setSearch([]);
await load(text); searchText.current = text;
offset.current = 0;
await load();
}, 500); }, 500);
const onCancelSearchPress = () => { const onCancelSearchPress = () => {
setIsSearching(false); setIsSearching(false);
offset.current = 0;
setSearch([]); setSearch([]);
searchText.current = '';
offset.current = 0;
}; };
const onSearchPress = () => { const onSearchPress = () => {
@ -183,12 +186,12 @@ const DiscussionsView = ({ navigation, route }: IDiscussionsViewProps): React.Re
<FlatList <FlatList
data={isSearching ? search : discussions} data={isSearching ? search : discussions}
renderItem={renderItem} renderItem={renderItem}
keyExtractor={(item: any) => item.msg} keyExtractor={(item: any) => item._id}
style={{ backgroundColor: colors.backgroundColor }} style={{ backgroundColor: colors.backgroundColor }}
contentContainerStyle={styles.contentContainer} contentContainerStyle={styles.contentContainer}
onEndReachedThreshold={0.5} onEndReachedThreshold={0.5}
removeClippedSubviews={isIOS} removeClippedSubviews={isIOS}
onEndReached={() => isSearching && offset.current < total && load()} onEndReached={() => isSearching && offset.current < total.current && load()}
ItemSeparatorComponent={List.Separator} ItemSeparatorComponent={List.Separator}
ListFooterComponent={loading ? <ActivityIndicator /> : null} ListFooterComponent={loading ? <ActivityIndicator /> : null}
scrollIndicatorInsets={{ right: 1 }} scrollIndicatorInsets={{ right: 1 }}