diff --git a/app/components/post_list/__snapshots__/post_list.test.js.snap b/app/components/post_list/__snapshots__/post_list.test.js.snap index 422f31974..8df39d6fd 100644 --- a/app/components/post_list/__snapshots__/post_list.test.js.snap +++ b/app/components/post_list/__snapshots__/post_list.test.js.snap @@ -44,7 +44,7 @@ exports[`PostList setting channel deep link 1`] = ` onLayout={[Function]} onScroll={[Function]} onScrollToIndexFailed={[Function]} - onViewableItemsChanged={null} + onViewableItemsChanged={[Function]} refreshControl={ { - if (!this.onViewableItemsChangedListener || !viewableItems.length || this.props.deepLinkURL) { + if (!viewableItems.length) { return; } + const viewableItemsMap = viewableItems.reduce((acc, {item, isViewable}) => { if (isViewable) { acc[item] = true; } return acc; }, {}); + DeviceEventEmitter.emit('scrolled', viewableItemsMap); - this.onViewableItemsChangedListener(viewableItems); + + if (this.onViewableItemsChangedListener && !this.props.deepLinkURL) { + this.onViewableItemsChangedListener(viewableItems); + } } render() { @@ -521,7 +526,7 @@ export default class PostList extends PureComponent { itemVisiblePercentThreshold: 1, minimumViewTime: 100, }} - onViewableItemsChanged={showMoreMessagesButton ? this.onViewableItemsChanged : null} + onViewableItemsChanged={this.onViewableItemsChanged} /> {showMoreMessagesButton && item; + onViewableItemsChanged = ({viewableItems}) => { + if (!viewableItems.length) { + return; + } + + const viewableItemsMap = viewableItems.reduce((acc, {item, isViewable}) => { + if (isViewable) { + acc[item] = true; + } + return acc; + }, {}); + + DeviceEventEmitter.emit('scrolled', viewableItemsMap); + }; + previewPost = (post) => { const {showPermalink} = this.props.actions; Keyboard.dismiss(); @@ -203,6 +219,7 @@ export default class FlaggedPosts extends PureComponent { keyboardShouldPersistTaps='always' keyboardDismissMode='interactive' renderItem={this.renderPost} + onViewableItemsChanged={this.onViewableItemsChanged} /> ); } else { diff --git a/app/screens/pinned_posts/pinned_posts.js b/app/screens/pinned_posts/pinned_posts.js index 42b9c0619..fafde3eae 100644 --- a/app/screens/pinned_posts/pinned_posts.js +++ b/app/screens/pinned_posts/pinned_posts.js @@ -5,6 +5,7 @@ import React, {PureComponent} from 'react'; import PropTypes from 'prop-types'; import {intlShape} from 'react-intl'; import { + DeviceEventEmitter, Keyboard, FlatList, StyleSheet, @@ -112,6 +113,21 @@ export default class PinnedPosts extends PureComponent { keyExtractor = (item) => item; + onViewableItemsChanged = ({viewableItems}) => { + if (!viewableItems.length) { + return; + } + + const viewableItemsMap = viewableItems.reduce((acc, {item, isViewable}) => { + if (isViewable) { + acc[item] = true; + } + return acc; + }, {}); + + DeviceEventEmitter.emit('scrolled', viewableItemsMap); + }; + previewPost = (post) => { this.props.actions.showPermalink(this.context.intl, '', post.id, false); }; @@ -199,6 +215,7 @@ export default class PinnedPosts extends PureComponent { keyboardShouldPersistTaps='always' keyboardDismissMode='interactive' renderItem={this.renderPost} + onViewableItemsChanged={this.onViewableItemsChanged} /> ); } else { diff --git a/app/screens/recent_mentions/recent_mentions.js b/app/screens/recent_mentions/recent_mentions.js index 554441dbf..353134d24 100644 --- a/app/screens/recent_mentions/recent_mentions.js +++ b/app/screens/recent_mentions/recent_mentions.js @@ -5,6 +5,7 @@ import React, {PureComponent} from 'react'; import PropTypes from 'prop-types'; import {intlShape} from 'react-intl'; import { + DeviceEventEmitter, Keyboard, FlatList, StyleSheet, @@ -111,6 +112,21 @@ export default class RecentMentions extends PureComponent { } } + onViewableItemsChanged = ({viewableItems}) => { + if (!viewableItems.length) { + return; + } + + const viewableItemsMap = viewableItems.reduce((acc, {item, isViewable}) => { + if (isViewable) { + acc[item] = true; + } + return acc; + }, {}); + + DeviceEventEmitter.emit('scrolled', viewableItemsMap); + }; + previewPost = (post) => { this.props.actions.showPermalink(this.context.intl, '', post.id, false); }; @@ -198,6 +214,7 @@ export default class RecentMentions extends PureComponent { keyboardShouldPersistTaps='always' keyboardDismissMode='interactive' renderItem={this.renderPost} + onViewableItemsChanged={this.onViewableItemsChanged} /> ); } else { diff --git a/app/screens/search/search.js b/app/screens/search/search.js index e0f77d9e6..bf5ed438e 100644 --- a/app/screens/search/search.js +++ b/app/screens/search/search.js @@ -7,6 +7,7 @@ import React, {PureComponent} from 'react'; import PropTypes from 'prop-types'; import {intlShape} from 'react-intl'; import { + DeviceEventEmitter, Keyboard, Platform, SafeAreaView, @@ -330,6 +331,22 @@ export default class Search extends PureComponent { } }, 100); + onViewableItemsChanged = ({viewableItems}) => { + const visible = viewableItems.filter((item) => item.section.key === 'results'); + if (!visible.length) { + return; + } + + const viewableItemsMap = visible.reduce((acc, {item, isViewable}) => { + if (isViewable) { + acc[item] = true; + } + return acc; + }, {}); + + DeviceEventEmitter.emit('scrolled', viewableItemsMap); + }; + previewPost = (post) => { this.props.actions.showPermalink(this.context.intl, '', post.id, false); }; @@ -753,6 +770,7 @@ export default class Search extends PureComponent { onScroll={this.handleScroll} scrollEventThrottle={60} ListFooterComponent={this.renderFooter} + onViewableItemsChanged={this.onViewableItemsChanged} />