From 11c8aef036ae90ab9e4ab9f0873e82b562324639 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E5=81=A5=E8=BE=89?= <wangjianhui0918@126.com>
Date: Wed, 24 Apr 2019 11:55:48 +0800
Subject: [PATCH] add more button

---
 frontend/src/css/file-history-old.css | 14 +++++++++++-
 frontend/src/file-history-old.js      | 32 ++++++++++++---------------
 2 files changed, 27 insertions(+), 19 deletions(-)

diff --git a/frontend/src/css/file-history-old.css b/frontend/src/css/file-history-old.css
index a5e8c7024a..757d025595 100644
--- a/frontend/src/css/file-history-old.css
+++ b/frontend/src/css/file-history-old.css
@@ -11,7 +11,7 @@
 
   .old-history-main {
     padding-top: 16px;
-    margin-left: 8.333333%;
+    margin: 0 8.333333%;
     display: inline !important;
     overflow: auto;
     position: relative;
@@ -31,6 +31,18 @@
     text-decoration: none;
   }
 
+  .old-history-main .get-more-btn {
+    width: 100%;
+    padding: .5em 0;
+    background: #efefef;
+    border: 0;
+    color: #777;
+    border-radius: 2px;
+  }
+  .old-history-main .get-more-btn:hover {
+    color: #444;
+  }
+
   .old-history-main p {
     color: #808080;
     font-size: 12px;
diff --git a/frontend/src/file-history-old.js b/frontend/src/file-history-old.js
index df8a42e317..2906d02f4a 100644
--- a/frontend/src/file-history-old.js
+++ b/frontend/src/file-history-old.js
@@ -1,5 +1,6 @@
 import React, { Fragment } from 'react';
 import ReactDOM from 'react-dom';
+import { Button } from 'reactstrap';
 import { Utils } from './utils/utils';
 import { seafileAPI } from './utils/seafile-api';
 import { siteRoot, gettext, PER_PAGE, filePath, fileName, historyRepoID, useNewAPI } from './utils/constants';
@@ -87,9 +88,6 @@ class FileHistory extends React.Component {
           isError: false,
           fileOwner: result.data[0].creator_email,
         });
-        if (this.state.historyList.length < 25 && this.state.hasMore) {
-          this.reloadMore();
-        }
       }
     } else {
       this.setState({
@@ -98,21 +96,22 @@ class FileHistory extends React.Component {
       });
       if (this.state.nextCommit) {
         seafileAPI.listOldFileHistoryRecords(historyRepoID, filePath, this.state.nextCommit).then((res) => {
-          this.setState({isReloadingData: false});
-          this.updateResultState(res.data);
+          this.initResultState(res.data);
         });
       }
     }
   }
 
   onScrollHandler = (event) => {
-    const clientHeight = event.target.clientHeight;
-    const scrollHeight = event.target.scrollHeight;
-    const scrollTop = event.target.scrollTop;
-    const isBottom = (clientHeight + scrollTop + 1 >= scrollHeight);
-    let hasMore = this.state.hasMore;
-    if (isBottom && hasMore) {
-      this.reloadMore();
+    if (useNewAPI) {
+      const clientHeight = event.target.clientHeight;
+      const scrollHeight = event.target.scrollHeight;
+      const scrollTop = event.target.scrollTop;
+      const isBottom = (clientHeight + scrollTop + 1 >= scrollHeight);
+      let hasMore = this.state.hasMore;
+      if (isBottom && hasMore) {
+        this.reloadMore();
+      }
     }
   }
 
@@ -135,13 +134,13 @@ class FileHistory extends React.Component {
         this.setState({isReloadingData: true});
         if (oldFilePath) {
           seafileAPI.listOldFileHistoryRecords(historyRepoID, oldFilePath, commitID).then((res) => {
-            this.setState({isReloadingData: false});
             this.updateResultState(res.data);
+            this.setState({isReloadingData: false});
           });
         } else {
           seafileAPI.listOldFileHistoryRecords(historyRepoID, filePath, commitID).then((res) => {
-            this.setState({isReloadingData: false});
             this.updateResultState(res.data);
+            this.setState({isReloadingData: false});
           });
         }
       }
@@ -170,9 +169,6 @@ class FileHistory extends React.Component {
           isError: false,
           fileOwner: result.data[0].creator_email,
         });
-        if (this.state.historyList.length < 25 && this.state.hasMore) {
-          this.reloadMore();
-        }
       }
     } else {
       this.setState({
@@ -181,7 +177,6 @@ class FileHistory extends React.Component {
       });
       if (this.state.nextCommit) {
         seafileAPI.listOldFileHistoryRecords(historyRepoID, filePath, this.state.nextCommit).then((res) => {
-          this.setState({isReloadingData: false});
           this.updateResultState(res.data);
         });
       }
@@ -272,6 +267,7 @@ class FileHistory extends React.Component {
                 </table>
               }
               {this.state.isReloadingData && <Loading />}
+              {this.state.hasMore && <Button className="get-more-btn" onClick={this.reloadMore}>{gettext('More')}</Button>}
             </div>
           </div>
         </div>