diff --git a/src/components/notification/view/notificationView.js b/src/components/notification/view/notificationView.js index a84c595f7..d889c9be1 100644 --- a/src/components/notification/view/notificationView.js +++ b/src/components/notification/view/notificationView.js @@ -42,13 +42,13 @@ class NotificationView extends PureComponent { // Component Functions - _handleOnDropdownSelect = index => { + _handleOnDropdownSelect = async index => { const { getActivities, changeSelectedFilter } = this.props; const { filters } = this.state; this.setState({ selectedFilter: filters[index].key }); - changeSelectedFilter(filters[index].key); - getActivities(filters[index].key, false); + await changeSelectedFilter(filters[index].key); + getActivities(null, filters[index].key, false); }; _renderList = data => { @@ -176,16 +176,16 @@ class NotificationView extends PureComponent { refreshing={isNotificationRefreshing} onRefresh={() => getActivities()} keyExtractor={item => item.title} - onEndReached={() => getActivities(selectedFilter, true)} + onEndReached={() => getActivities(null, selectedFilter, true)} ListFooterComponent={this._renderFooterLoading} refreshControl={ + refreshing={isNotificationRefreshing} + progressBackgroundColor="#357CE6" + tintColor={!isDarkTheme ? '#357ce6' : '#96c0ff'} + titleColor="#fff" + colors={['#fff']} + /> } renderItem={({ item, index }) => ( diff --git a/src/screens/notification/container/notificationContainer.js b/src/screens/notification/container/notificationContainer.js index 8d878d082..018906afe 100644 --- a/src/screens/notification/container/notificationContainer.js +++ b/src/screens/notification/container/notificationContainer.js @@ -20,6 +20,7 @@ class NotificationContainer extends Component { lastNotificationId: null, isNotificationRefreshing: false, selectedFilter: 'activities', + endOfNotification: false, }; } @@ -39,28 +40,37 @@ class NotificationContainer extends Component { (nextProps.activeBottomTab === ROUTES.TABBAR.NOTIFICATION && nextProps.username) || (nextProps.username !== username && nextProps.username) ) { - this._getAvtivities(nextProps.username, selectedFilter); + this.setState({ endOfNotification: false }, () => + this._getAvtivities(nextProps.username, selectedFilter), + ); } } _getAvtivities = (user, type = null, loadMore = false) => { - const { lastNotificationId, notifications } = this.state; + const { lastNotificationId, notifications, endOfNotification } = this.state; const since = loadMore ? lastNotificationId : null; const { username } = this.props; - this.setState({ isNotificationRefreshing: true }); - - getActivities({ user: user || username, type, since }) - .then(res => { - const lastId = [...res].pop().id; - - this.setState({ - notifications: loadMore ? [...notifications, ...res] : res, - lastNotificationId: lastId, - isNotificationRefreshing: false, - }); - }) - .catch(() => this.setState({ isNotificationRefreshing: false })); + if (!endOfNotification) { + this.setState({ isNotificationRefreshing: true }); + getActivities({ user: user || username, type, since }) + .then(res => { + const lastId = res.length > 0 ? [...res].pop().id : null; + if (lastId === lastNotificationId || res.length === 0) { + this.setState({ + endOfNotification: true, + isNotificationRefreshing: false, + }); + } else { + this.setState({ + notifications: loadMore ? [...notifications, ...res] : res, + lastNotificationId: lastId, + isNotificationRefreshing: false, + }); + } + }) + .catch(() => this.setState({ isNotificationRefreshing: false })); + } }; _navigateToNotificationRoute = data => { @@ -122,8 +132,8 @@ class NotificationContainer extends Component { navigation.navigate(ROUTES.SCREENS.LOGIN); }; - _changeSelectedFilter = value => { - this.setState({ selectedFilter: value }); + _changeSelectedFilter = async value => { + await this.setState({ selectedFilter: value, endOfNotification: false }); }; render() {