소스 검색

add a "remove all read" button to notification menu

Jonathan Baird 5 년 전
부모
커밋
a182dde11f

+ 4 - 0
client/components/notifications/notificationsDrawer.jade

@@ -14,3 +14,7 @@ template(name='notificationsDrawer')
         +notification(activityData=activity index=dbIndex read=read)
         +notification(activityData=activity index=dbIndex read=read)
     if($gt unreadNotifications 0)
     if($gt unreadNotifications 0)
       a.all-read {{_ 'mark-all-as-read'}}
       a.all-read {{_ 'mark-all-as-read'}}
+    if ($and ($.Session.get 'showReadNotifications') ($gt readNotifications 0))
+      a.remove-read
+        i.fa.fa-trash
+        | {{_ 'remove-all-read'}}

+ 15 - 0
client/components/notifications/notificationsDrawer.js

@@ -16,6 +16,13 @@ Template.notificationsDrawer.helpers({
   transformedProfile() {
   transformedProfile() {
     return Users.findOne(Meteor.userId());
     return Users.findOne(Meteor.userId());
   },
   },
+  readNotifications() {
+    const readNotifications = _.filter(
+      Meteor.user().profile.notifications,
+      v => !!v.read,
+    );
+    return readNotifications.length;
+  },
 });
 });
 
 
 Template.notificationsDrawer.events({
 Template.notificationsDrawer.events({
@@ -35,4 +42,12 @@ Template.notificationsDrawer.events({
   'click .toggle-read'() {
   'click .toggle-read'() {
     Session.set('showReadNotifications', !Session.get('showReadNotifications'));
     Session.set('showReadNotifications', !Session.get('showReadNotifications'));
   },
   },
+  'click .remove-read'() {
+    const user = Meteor.user();
+    for (const notification of user.profile.notifications) {
+      if (notification.read) {
+        user.removeNotification(notification.activity);
+      }
+    }
+  },
 });
 });

+ 12 - 1
client/components/notifications/notificationsDrawer.styl

@@ -45,12 +45,23 @@ section#notifications-drawer
       line-height: 24px
       line-height: 24px
       opacity 1
       opacity 1
 
 
-  .all-read
+  .all-read,
+  .remove-read
     color belize
     color belize
     background-color: #fafafa
     background-color: #fafafa
     margin 8px 16px 12px
     margin 8px 16px 12px
     display inline-block
     display inline-block
 
 
+  .remove-read
+    float right
+
+    &:hover
+      color #eb4646 !important
+
+      i.fa
+        color inherit
+
+
   ul.notifications
   ul.notifications
     display: block
     display: block
     padding: 0px 16px
     padding: 0px 16px

+ 1 - 0
i18n/en.i18n.json

@@ -774,6 +774,7 @@
   "view-all": "View All",
   "view-all": "View All",
   "filter-by-unread": "Filter by Unread",
   "filter-by-unread": "Filter by Unread",
   "mark-all-as-read": "Mark all as read",
   "mark-all-as-read": "Mark all as read",
+  "remove-all-read": "Remove all read",
   "allow-rename": "Allow Rename",
   "allow-rename": "Allow Rename",
   "allowRenamePopup-title": "Allow Rename"
   "allowRenamePopup-title": "Allow Rename"
 }
 }