fixed pagination
This commit is contained in:
parent
eb63bf093e
commit
bd591434ed
|
@ -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 }}
|
||||||
|
|
Loading…
Reference in New Issue