diff options
author | Renard | 2019-09-23 12:49:59 -0300 |
---|---|---|
committer | Renard | 2019-09-23 12:49:59 -0300 |
commit | 9e42ccb82dcab1c86f048e6bbc8df11f4759169b (patch) | |
tree | ced6141084fa017a160b557bade913d3ae16152f /src/Board.js | |
parent | 629557fcc8b2561e77c1b9e53f79aabe814fd9c7 (diff) | |
download | bai-client-9e42ccb82dcab1c86f048e6bbc8df11f4759169b.tar.gz bai-client-9e42ccb82dcab1c86f048e6bbc8df11f4759169b.tar.xz bai-client-9e42ccb82dcab1c86f048e6bbc8df11f4759169b.zip |
Infinite scroll fix
Diffstat (limited to 'src/Board.js')
-rw-r--r-- | src/Board.js | 21 |
1 files changed, 18 insertions, 3 deletions
diff --git a/src/Board.js b/src/Board.js index 5dd00a2..41727bc 100644 --- a/src/Board.js +++ b/src/Board.js @@ -17,7 +17,8 @@ class Board extends Component { isLoaded: false, threadList: [], error: null, - loadingMore: false + loadingMore: false, + endReached: false }; this.handleScroll = this.handleScroll.bind(this); this.threadOffset = 10; @@ -46,7 +47,11 @@ class Board extends Component { handleScroll() { const { scrollHeight, scrollTop, clientHeight } = document.documentElement; - if (scrollHeight - scrollTop === clientHeight && !this.state.loadingMore) { + if ( + scrollHeight - scrollTop === clientHeight && + !this.state.loadingMore && + !this.state.endReached + ) { this.setState({ loadingMore: true }); this.fetchMoreThreads(); } @@ -65,6 +70,8 @@ class Board extends Component { const moreThreads = this.state.threadList.concat(resource.threads); this.threadOffset += 10; this.setState({ threadList: moreThreads, loadingMore: false }); + } else { + this.setState({ endReached: true, loadingMore: false }); } } return; @@ -84,7 +91,7 @@ class Board extends Component { } render() { - const { isLoaded, error, threadList, loadingMore } = this.state; + const { isLoaded, error, threadList, loadingMore, endReached } = this.state; if (error != null) { return ( @@ -162,6 +169,14 @@ class Board extends Component { Cargando más hilos ... </Loader> ) : null} + + {endReached ? ( + <Message + warning + header="キタ━━━(゚∀゚)━━━!!" + content="No hay más hilos para mostrar." + /> + ) : null} </React.Fragment> ); } |