Use one variable instead of two

frontend/src/pages/lib-content-view/lib-content-container.js

@@ -86,7 +86,7 @@ const propTypes = {
   onDeleteRepoTag: PropTypes.func.isRequired,
   updateDetail: PropTypes.bool.isRequired,
   onPageScroll: PropTypes.func.isRequired,
-  itemShownLimit: PropTypes.bool.isRequired
+  itemShowLength: PropTypes.number.isRequired
 };
 
 class LibContentContainer extends React.Component {
@@ -95,7 +95,6 @@ class LibContentContainer extends React.Component {
     super(props);
     this.state = {
       currentDirent: null,
-      itemShowLength: 100,
     };
 
     this.errMessage = (<div className="message err-tip">{gettext('Folder does not exist.')}</div>);
@@ -105,11 +104,6 @@ class LibContentContainer extends React.Component {
     if (nextProps.path !== this.props.path || nextProps.updateDetail !== this.props.updateDetail) {
       this.setState({currentDirent: null});
     }
-
-    if (this.props.itemShownLimit) {
-      this.setState({itemShowLength: 100})
-    }
-  
   }
 
   onPathClick = (path) => {
@@ -146,15 +140,11 @@ class LibContentContainer extends React.Component {
     this.props.onItemDelete(dirent);
   }
 
-  onFileScroll = (e) => {
+  onItemsScroll = (e) => {
     let target = e.target;
-    let itemShowLength = this.state.itemShowLength;
     if (target.scrollTop + document.documentElement.clientHeight - target.offsetTop >= target.scrollHeight) {
-      itemShowLength += 100;
+      this.props.onPageScroll();
-      this.setState({itemShowLength: itemShowLength});
     }
-    this.props.onPageScroll();
-
   }
 
   render() {
@@ -167,7 +157,7 @@ class LibContentContainer extends React.Component {
     } 
 
     let direntItemsList = direntList.filter((item, index) => {
-      return index < this.state.itemShowLength;
+      return index < this.props.itemShowLength;
     })
 
     return (
@@ -188,7 +178,7 @@ class LibContentContainer extends React.Component {
               onDeleteRepoTag={this.props.onDeleteRepoTag}
             />
           </div>
-          <div className={`cur-view-content lib-content-container ${this.props.currentMode === 'column' ? 'view-mode-container' : ''}`} onScroll={this.onFileScroll}>
+          <div className={`cur-view-content lib-content-container ${this.props.currentMode === 'column' ? 'view-mode-container' : ''}`} onScroll={this.onItemsScroll}>
             {!this.props.pathExist && this.errMessage}
             {this.props.pathExist && (
               <Fragment>

frontend/src/pages/lib-content-view/lib-content-view.js

@@ -71,7 +71,7 @@ class LibContentView extends React.Component {
       errorMsg: '',
       isDirentDetailShow: false,
       updateDetail: false,
-      itemShownLimit: false,
+      itemsShowLength: 100,
     };
 
     window.onpopstate = this.onpopstate;
@@ -413,11 +413,13 @@ class LibContentView extends React.Component {
   }
 
   onPageScroll = () => {
-    this.setState({itemShownLimit: false})
+    let itemsShowLength = this.state.itemsShowLength;
+    itemsShowLength += 100;
+    this.setState({itemsShowLength: itemsShowLength});
   }
 
   onSwitchPage = () => {
-    this.setState({itemShownLimit: true})
+    this.setState({itemsShowLength: 100});
   }
 
   getThumbnails = (repoID, path, direntList) => {
@@ -1461,8 +1463,8 @@ class LibContentView extends React.Component {
             onDeleteRepoTag={this.onDeleteRepoTag}
             onToolbarFileTagChanged={this.onToolbarFileTagChanged}
             updateDetail={this.state.updateDetail}
-            itemShownLimit={this.state.itemShownLimit}
             onPageScroll={this.onPageScroll}
+            itemsShowLength={this.state.itemsShowLength}
           />
           {this.state.pathExist && !this.state.isViewFile && (
             <FileUploader