#436: add dismiss button, disable is_seen part

src/components/notification/notification.vue

@@ -1,7 +1,12 @@
 <template>
-  <div class="notification-item">
-    <button @click.prevent="dismiss" class="btn-dismiss">{{$t("notifications.dismiss")}}</button>
-    <status v-if="notification.type === 'mention'" :compact="true" :statusoid="notification.status"></status>
+  <status 
+    v-if="notification.type === 'mention'" 
+    :compact="true" 
+    :statusoid="notification.status"
+    isNotification="true"
+    @dismissNotification="dismiss"
+  >
+  </status>
   <div class="non-mention" :class="[userClass, { highlighted: userStyle }]" :style="[ userStyle ]"v-else>
     <a class='avatar-container' :href="notification.action.user.statusnet_profile_url" @click.stop.prevent.capture="toggleUserExpanded">
       <UserAvatar :compact="true" :betterShadow="betterShadow" :src="notification.action.user.profile_image_url_original"/>
@@ -30,6 +35,9 @@
             <timeago :since="notification.action.created_at" :auto-update="240"></timeago>
           </router-link>
         </div>
+        <span class="button-icon" @click.prevent="dismiss">
+          <i class="button-icon icon-cancel delete-status"></i>
+        </span>
       </span>
       <div class="follow-text" v-if="notification.type === 'follow'">
         <router-link :to="userProfileLink(notification.action.user)">
@@ -41,17 +49,6 @@
       </template>
     </div>
   </div>
-  </div>
 </template>
 
 <script src="./notification.js"></script>
-
-<style lang="scss">
-@import '../../_variables.scss';
-
-.notification-item {
-  display: flex;
-  flex: 1;
-  flex-direction: column;
-}
-</style>

src/components/status/status.js

@@ -25,7 +25,8 @@ const Status = {
     'replies',
     'isPreview',
     'noHeading',
-    'inlineExpanded'
+    'inlineExpanded',
+    'isNotification'
   ],
   data () {
     return {
@@ -365,6 +366,9 @@ const Status = {
     setMedia () {
       const attachments = this.attachmentSize === 'hide' ? this.status.attachments : this.galleryAttachments
       return () => this.$store.dispatch('setMedia', attachments)
+    },
+    dismissNotification () {
+      this.$emit('dismissNotification')
     }
   },
   watch: {

src/components/status/status.vue

@@ -52,6 +52,9 @@
                 <a :href="status.external_url" target="_blank" v-if="!status.is_local && !isPreview" class="source_url" title="Source">
                   <i class="button-icon icon-link-ext-alt"></i>
                 </a>
+                <span class="button-icon" v-if="isNotification" @click.prevent="dismissNotification">
+                  <i class="button-icon icon-cancel delete-status"></i>
+                </span>
                 <template v-if="expandable && !isPreview">
                   <a href="#" @click.prevent="toggleExpanded" title="Expand">
                     <i class="button-icon icon-plus-squared"></i>

src/services/entity_normalizer/entity_normalizer.service.js

@@ -65,8 +65,7 @@ export const parseUser = (data) => {
       output.muted = pleroma.muted
     }
 
-    // Missing, trying to recover
-    output.is_local = !output.screen_name.includes('@')
+    // TODO: handle is_local
   } else {
     output.screen_name = data.screen_name
 
@@ -179,8 +178,7 @@ export const parseStatus = (data) => {
     output.summary_html = data.spoiler_text
     output.external_url = data.url
 
-    // FIXME missing!!
-    output.is_local = false
+    // TODO: handle is_local
   } else {
     output.favorited = data.favorited
     output.fave_num = data.fave_num

src/services/notifications_fetcher/notifications_fetcher.service.js

@@ -16,17 +16,21 @@ const fetchAndUpdate = ({store, credentials, older = false}) => {
       args['until'] = timelineData.minId
     }
   } else {
-    // load unread notifications repeadedly to provide consistency between browser tabs
-    const notifications = timelineData.data
-    const unread = notifications.filter(n => !n.seen).map(n => n.id)
-    if (!unread.length) {
+    if (timelineData.maxId !== Number.POSITIVE_INFINITY) {
       args['since'] = timelineData.maxId
-    } else {
-      args['since'] = Math.min(...unread) - 1
-      if (timelineData.maxId !== Math.max(...unread)) {
-        args['until'] = Math.max(...unread, args['since'] + 20)
-      }
     }
+    // # disabled until is_seen is impelented on the BE
+    // load unread notifications repeadedly to provide consistency between browser tabs
+    // const notifications = timelineData.data
+    // const unread = notifications.filter(n => !n.seen).map(n => n.id)
+    // if (!unread.length) {
+    //   args['since'] = timelineData.maxId
+    // } else {
+    //   args['since'] = Math.min(...unread) - 1
+    //   if (timelineData.maxId !== Math.max(...unread)) {
+    //     args['until'] = Math.max(...unread, args['since'] + 20)
+    //   }
+    // }
   }
 
   args['timeline'] = 'notifications'