categorize activities according to time (#2867)

frontend/src/models/activity.js

@@ -0,0 +1,33 @@
+import moment from 'moment';
+
+class Acticity {
+ constructor(json) {
+    this.repo_id = json.repo_id;
+    this.repo_name = json.repo_name;
+    this.obj_type = json.obj_type;
+    this.commit_id = json.commit_id;
+    this.path = json.path;
+    this.name = json.name;
+    this.author_email = json.author_email;
+    this.author_name = json.author_name;
+    this.author_contact_email = json.author_contact_email;
+    this.avatar_url = json.avatar_url;
+    this.time = json.time;
+    this.op_type = json.op_type;
+    if (json.op_type === 'clean-up-trash') {
+      this.days = json.days;
+    } else if (json.op_type === 'rename' && json.obj_type === 'repo') {
+      this.old_repo_name = json.old_repo_name;
+    } else if (json.op_type === 'move' && ['dir', 'file'].includes(json.obj_type)) {
+      this.old_path = json.old_path;
+    } else if (json.op_type === 'rename' && ['dir', 'file'].includes(json.obj_type)) {
+      this.old_path = json.old_path;
+      this.old_name = json.old_name;
+    } else if (json.op_type === 'review') {
+      this.old_path = json.old_path;
+      this.review_id = json.review_id;
+    }
+ }
+}
+
+export default Acticity;

frontend/src/pages/dashboard/files-activities.js

@@ -5,6 +5,7 @@ import { seafileAPI } from '../../utils/seafile-api';
 import { gettext, siteRoot } from '../../utils/constants';
 import { Utils } from '../../utils/utils';
 import Loading from '../../components/loading';
+import Activity from '../../models/activity';
 
 moment.locale(window.app.config.lang);
 
@@ -172,8 +173,20 @@ class TableBody extends Component {
         }
       }
 
+      let isShowDate = true;
+      if (index > 0) {
+        let lastEventTime = this.props.items[index - 1].time;
+        isShowDate = moment(item.time).isSame(lastEventTime, 'day') ? false : true
+      }
+
       return (
-        <tr key={index}>
+        <Fragment key={index}>
+          { isShowDate &&
+            <tr>
+              <td colSpan='5'>{moment(item.time).format('YYYY-MM-DD')}</td>
+            </tr>
+          }
+          <tr>
             <td className="text-center">
               <img src={item.avatar_url} alt="" width="36px" height="36px" className="avatar" />
             </td>
@@ -186,6 +199,7 @@ class TableBody extends Component {
               <time datetime={item.time} is="relative-time" title={moment(item.time).format('llll')}>{moment(item.time).fromNow()}</time>
             </td>
           </tr>
+        </Fragment>
       );
     }, this);
 
@@ -253,10 +267,12 @@ class FilesActivities extends Component {
           this.oldPathList.splice(this.oldPathList.indexOf(events[i].old_path), 1);
           continue;
         } else {
-          actuallyEvents.push(events[i]);
+          let event = new Activity(events[i]);
+          actuallyEvents.push(event);
         }
       } else {
-        actuallyEvents.push(events[i]);
+        let event = new Activity(events[i]);
+        actuallyEvents.push(event);
       }
     }
     return actuallyEvents;