Revert "Show actual status in notifications when mentioned."

This reverts commit 0e1ab69c33.

src/components/conversation/conversation.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="timeline panel panel-default base00-background conversation">
+  <div class="timeline panel panel-default base00-background">
     <div class="panel-heading base01-background base04">
       Conversation
       <div v-if="collapsable">
@@ -8,7 +8,7 @@
     </div>
     <div class="panel-body">
       <div class="timeline">
-        <status v-for="status in conversation" :key="status.id" v-bind:statusoid="status" :expandable='false'></status>
+        <status v-for="status in conversation" :key="status.id" v-bind:statusoid="status":expandable='false'></status>
       </div>
     </div>
   </div>

src/components/notifications/notifications.js

@@ -1,5 +1,4 @@
 import { sortBy, take, filter } from 'lodash'
-import Status from '../status/status.vue'
 
 const Notifications = {
   data () {
@@ -7,9 +6,6 @@ const Notifications = {
       visibleNotificationCount: 10
     }
   },
-  components: {
-    Status
-  },
   computed: {
     notifications () {
       return this.$store.state.statuses.notifications

src/components/notifications/notifications.scss

@@ -1,44 +1,42 @@
 @import '../../_variables.scss';
 .notification {
+  padding: 0.4em 0 0 0.7em;
+  display: flex;
   border-bottom: 1px solid silver;
 
-  .notification-base {
+  .text {
-      padding: 0.4em 0 0 0.7em;
+    min-width: 0px;
-      display: flex;
+    word-wrap: break-word;
-      .avatar {
+    line-height:18px;
-          padding-top: 0.3em;
-          width: 32px;
-          height: 32px;
-          border-radius: 50%;
-      }
 
-      .text {
+    .icon-retweet {
-          min-width: 0px;
+      color: $green;
-          word-wrap: break-word;
+    }
-          line-height:18px;
 
-          .icon-retweet {
+    .icon-reply {
-              color: $green;
+      color: $blue;
-          }
+    }
 
-          .icon-reply {
+    h1 {
-              color: $blue;
+      margin: 0 0 0.3em;
-          }
+      padding: 0;
+      font-size: 1em;
+      line-height:20px;
+    }
 
-          h1 {
+    padding: 0.3em 0.8em 0.5em;
-              margin: 0 0 0.3em;
+    p {
-              padding: 0;
+      margin: 0;
-              font-size: 1em;
+      margin-top: 0;
-              line-height:20px;
+      margin-bottom: 0.3em;
-          }
+    }
+  }
 
-          padding: 0.3em 0.8em 0.5em;
+  .avatar {
-          p {
+    padding-top: 0.3em;
-              margin: 0;
+    width: 32px;
-              margin-top: 0;
+    height: 32px;
-              margin-bottom: 0.3em;
+    border-radius: 50%;
-          }
-      }
   }
 
   &:last-child {

src/components/notifications/notifications.vue

@@ -4,26 +4,24 @@
       <div class="panel-heading base01-background base04">Notifications ({{unseenCount}}) <button @click.prevent="markAsSeen">Read!</button></div>
       <div class="panel-body">
         <div v-for="notification in visibleNotifications" class="notification" :class='{"base01-background": notification.seen}'>
-          <div class="notification-base">
+          <a :href="notification.action.user.statusnet_profile_url">
-            <a :href="notification.action.user.statusnet_profile_url">
+            <img class='avatar' :src="notification.action.user.profile_image_url_original">
-              <img class='avatar' :src="notification.action.user.profile_image_url_original">
+          </a>
-            </a>
+          <div class='text'>
-            <div class='text'>
+            <timeago :since="notification.action.created_at" :auto-update="240"></timeago>
-              <timeago :since="notification.action.created_at" :auto-update="240"></timeago>
+            <div v-if="notification.type === 'favorite'">
-              <div v-if="notification.type === 'favorite'">
+              <h1>{{ notification.action.user.name }}<br><i class="fa icon-star"></i> favorited your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
-                <h1>{{ notification.action.user.name }}<br><i class="fa icon-star"></i> favorited your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
+              <p>{{ notification.status.text }}</p>
-                  <p>{{ notification.status.text }}</p>
+            </div>
-              </div>
+            <div v-if="notification.type === 'repeat'">
-              <div v-if="notification.type === 'repeat'">
+              <h1>{{ notification.action.user.name }}<br><i class="fa icon-retweet"></i> repeated your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
-                <h1>{{ notification.action.user.name }}<br><i class="fa icon-retweet"></i> repeated your <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">status</h1>
+              <p>{{ notification.status.text }}</p>
-                  <p>{{ notification.status.text }}</p>
+            </div>
-              </div>
+            <div v-if="notification.type === 'mention'">
-              <div v-if="notification.type === 'mention'">
+              <h1>{{ notification.action.user.name }}<br><i class="fa icon-reply"></i> <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">mentioned</router-link> you</h1>
-                <h1>{{ notification.action.user.name }}<br><i class="fa icon-reply"></i> <router-link :to="{ name: 'conversation', params: { id: notification.status.id } }">mentioned</router-link> you</h1>
+              <p>{{ notification.status.text }}</p>
-              </div>
             </div>
           </div>
-          <status v-if="notification.type === 'mention'" :statusoid="notification.action" :expandable="false"></status>
         </div>
       </div>
     </div>

src/components/status/status.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="status-el base00-background" v-if="!status.deleted">
+  <div class="status-el base00-background" v-if="!status.deleted" v-bind:class="{ 'expanded-status': !expandable }">
     <template v-if="muted">
       <div class="media status container muted">
         <small><router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link></small>
@@ -121,6 +121,10 @@
      }
  }
 
+ .expanded-status {
+   border-left: 4px solid rgba(255, 48, 16, 0.65);
+ }
+
  .status-actions {
      padding-top: 5px;
  }
@@ -156,8 +160,4 @@
    border-radius: 1em;
    margin-bottom: 1em;
  }
-
- .conversation .status-el {
-   border-left: 4px solid rgba(255, 48, 16, 0.65);
- }
 </style>