diff --git a/app/components/PaginatedList.js b/app/components/PaginatedList.js index 7440ef730..60a69668a 100644 --- a/app/components/PaginatedList.js +++ b/app/components/PaginatedList.js @@ -20,6 +20,8 @@ type Props = { @observer class PaginatedList extends React.Component { isInitiallyLoaded: boolean = false; + timeout: ?TimeoutID; + @observable isLongLoading: boolean = false; @observable isLoaded: boolean = false; @observable isFetchingMore: boolean = false; @observable isFetching: boolean = false; @@ -34,6 +36,11 @@ class PaginatedList extends React.Component { componentDidMount() { this.fetchResults(); + this.timeout = setTimeout(() => (this.isLongLoading = true), 200); + } + + componentWillUnmount() { + clearTimeout(this.timeout); } componentDidUpdate(prevProps: Props) { @@ -90,7 +97,10 @@ class PaginatedList extends React.Component { const { items, heading, empty } = this.props; const showLoading = - this.isFetching && !this.isFetchingMore && !this.isInitiallyLoaded; + this.isFetching && + this.isLongLoading && + !this.isFetchingMore && + !this.isInitiallyLoaded; const showEmpty = !items.length && !showLoading; const showList = (this.isLoaded || this.isInitiallyLoaded) && !showLoading && !showEmpty;