improve notification

frontend/src/components/common/notification.js

@@ -7,10 +7,15 @@ class Notification extends React.Component {
     super(props);
     this.state = {
       showNotice: false,
-      notice_html: ''
+      notice_html: '',
+      unseenCount: 0,
     };
   }
 
+  componentDidMount() {
+    this.loadUnseenCount();
+  }
+
   onClick = () => {
     this.setState({
       showNotice: !this.state.showNotice
@@ -22,9 +27,16 @@ class Notification extends React.Component {
 
     if (this.state.showNotice) {
       seafileAPI.updateNotifications();
+      this.loadUnseenCount();
     }
   }
 
+  loadUnseenCount = () => {
+    seafileAPI.getUnseenCount().then(res => {
+      this.setState({unseenCount: res.data.unseen_count});
+    });
+  }
+
   loadNotices = () => {
     seafileAPI.listPopupNotices().then(res => {
       this.setState({
@@ -40,7 +52,7 @@ class Notification extends React.Component {
       <div id="notifications">
         <a href="#" onClick={this.onClick} className="no-deco" id="notice-icon" title="Notifications" aria-label="Notifications">
           <span className="sf2-icon-bell"></span>
-          <span className="num hide">0</span>
+          <span className={`num ${this.state.unseenCount ? '' : 'hide'}`}>{this.state.unseenCount}</span>
         </a>
         <div id="notice-popover" className={`sf-popover ${this.state.showNotice ? '': 'hide'}`}>
           <div className="outer-caret up-outer-caret"><div className="inner-caret"></div></div>

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

@@ -195,7 +195,7 @@ class FilesActivities extends Component {
         this.setState({
           loading: false,
           items: res.data.events,
-          has_more: res.data.events.length == '0' ? false : true
+          has_more: res.data.events.length < 25 ? false : true
         });
       }
     });
@@ -203,11 +203,8 @@ class FilesActivities extends Component {
 
   getMore() {
     const pageNum = this.state.page + 1;
-    this.setState({
-      page: pageNum
-    });
-    seafileAPI.listActivities(pageNum)
-      .then(res => {
+    this.setState({page: pageNum});
+    seafileAPI.listActivities(pageNum).then(res => {
       if (res.status == 403) {
         this.setState({
           loading: false,
@@ -218,7 +215,7 @@ class FilesActivities extends Component {
         this.setState({
           loading: false,
           items: [...this.state.items, ...res.data.events],
-            has_more: res.data.events.length == '0' ? false : true 
+          has_more: res.data.events.length < 25 ? false : true 
         });
       }
     });

media/css/seahub_react.css

@@ -685,6 +685,11 @@ a.op-icon:focus {
     top: 5px;
 }
 
+#notice-popover .sf-popover-hd {
+    border-bottom: 1px solid #dfdfe1;
+    margin: 0 10px;
+}
+
 
 /**** sf-popover ****/ /* e.g. top notice popup, group members popup */
 .sf-popover-container {