From 748b1ed1673033b2564ea9833d74f8c88c9c343b Mon Sep 17 00:00:00 2001
From: jared <jaredrmain@gmail.com>
Date: Mon, 1 Apr 2019 12:54:34 -0400
Subject: #470 - fix subject and content toggle issue

---
 src/components/status/status.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 1f415534..b66c1c93 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -99,12 +99,12 @@
 
           <div class="status-content-wrapper" :class="{ 'tall-status': !showingLongSubject }" v-if="longSubject">
             <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="!showingLongSubject" href="#" @click.prevent="showingLongSubject=true">Show more</a>
-            <div @click.prevent="linkClicked" class="status-content media-body" v-html="status.statusnet_html"></div>
+            <div @click.prevent="linkClicked" class="status-content media-body" v-html="contentHtml"></div>
             <a v-if="showingLongSubject" href="#" class="status-unhider" @click.prevent="showingLongSubject=false">Show less</a>
           </div>
           <div :class="{'tall-status': hideTallStatus}" class="status-content-wrapper" v-else>
             <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="hideTallStatus" href="#" @click.prevent="toggleShowMore">Show more</a>
-            <div @click.prevent="linkClicked" class="status-content media-body" v-html="status.statusnet_html" v-if="!hideSubjectStatus"></div>
+            <div @click.prevent="linkClicked" class="status-content media-body" v-html="contentHtml" v-if="!hideSubjectStatus"></div>
             <div @click.prevent="linkClicked" class="status-content media-body" v-html="status.summary_html" v-else></div>
             <a v-if="hideSubjectStatus" href="#" class="cw-status-hider" @click.prevent="toggleShowMore">Show more</a>
             <a v-if="showingMore" href="#" class="status-unhider" @click.prevent="toggleShowMore">Show less</a>
-- 
cgit v1.2.3-70-g09d2


From 6847e70a492f651ea14cdec1a87b520d1a2d5ece Mon Sep 17 00:00:00 2001
From: jared <jaredrmain@gmail.com>
Date: Mon, 1 Apr 2019 12:58:23 -0400
Subject: #470 - update i18n

---
 src/components/status/status.vue | 10 +++++-----
 src/i18n/en.json                 |  4 +++-
 2 files changed, 8 insertions(+), 6 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index b66c1c93..690e8318 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -98,16 +98,16 @@
           </div>
 
           <div class="status-content-wrapper" :class="{ 'tall-status': !showingLongSubject }" v-if="longSubject">
-            <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="!showingLongSubject" href="#" @click.prevent="showingLongSubject=true">Show more</a>
+            <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="!showingLongSubject" href="#" @click.prevent="showingLongSubject=true">{{$t("general.show_more")}}</a>
             <div @click.prevent="linkClicked" class="status-content media-body" v-html="contentHtml"></div>
-            <a v-if="showingLongSubject" href="#" class="status-unhider" @click.prevent="showingLongSubject=false">Show less</a>
+            <a v-if="showingLongSubject" href="#" class="status-unhider" @click.prevent="showingLongSubject=false">{{$t("general.show_less")}}</a>
           </div>
           <div :class="{'tall-status': hideTallStatus}" class="status-content-wrapper" v-else>
-            <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="hideTallStatus" href="#" @click.prevent="toggleShowMore">Show more</a>
+            <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="hideTallStatus" href="#" @click.prevent="toggleShowMore">{{$t("general.show_more")}}</a>
             <div @click.prevent="linkClicked" class="status-content media-body" v-html="contentHtml" v-if="!hideSubjectStatus"></div>
             <div @click.prevent="linkClicked" class="status-content media-body" v-html="status.summary_html" v-else></div>
-            <a v-if="hideSubjectStatus" href="#" class="cw-status-hider" @click.prevent="toggleShowMore">Show more</a>
-            <a v-if="showingMore" href="#" class="status-unhider" @click.prevent="toggleShowMore">Show less</a>
+            <a v-if="hideSubjectStatus" href="#" class="cw-status-hider" @click.prevent="toggleShowMore">{{$t("general.show_more")}}</a>
+            <a v-if="showingMore" href="#" class="status-unhider" @click.prevent="toggleShowMore">{{$t("general.show_less")}}</a>
           </div>
 
           <div v-if="status.attachments && (!hideSubjectStatus || showingLongSubject)" class="attachments media-body">
diff --git a/src/i18n/en.json b/src/i18n/en.json
index c501c6a7..32d634e8 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -20,7 +20,9 @@
     "submit": "Submit",
     "more": "More",
     "generic_error": "An error occured",
-    "optional": "optional"
+    "optional": "optional",
+    "show_more": "Show More",
+    "show_less": "Show Less"
   },
   "image_cropper": {
     "crop_picture": "Crop picture",
-- 
cgit v1.2.3-70-g09d2


From 85457fc9173d64d39b1d942496cae1366a0d95ab Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Mon, 1 Apr 2019 22:30:06 -0400
Subject: fetch reblogged users

---
 src/components/conversation/conversation.js        |  9 ++++++++
 src/components/status/status.js                    |  2 ++
 src/components/status/status.vue                   | 25 ++++++++++++++++++++++
 src/modules/statuses.js                            |  7 ++++++
 src/services/api/api.service.js                    |  5 ++++-
 .../backend_interactor_service.js                  |  3 +++
 6 files changed, 50 insertions(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index b3335f64..24d48dd8 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -122,6 +122,7 @@ const conversation = {
           .then(({ancestors, descendants}) => {
             const ancestorId = ancestors.length ? ancestors[0].id : this.status.id
             this.fetchFavouritedByUsers(ancestorId)
+            this.fetchRebloggedByUsers(ancestorId)
             this.$store.dispatch('addNewStatuses', { statuses: ancestors })
             this.$store.dispatch('addNewStatuses', { statuses: descendants })
           })
@@ -160,6 +161,14 @@ const conversation = {
         this.$store.dispatch('addFavoritedByUsers', { favoritedByUsers, id })
       })
     },
+    fetchRebloggedByUsers (id) {
+      this.$store.state.api.backendInteractor.fetchRebloggedByUsers({id: this.status.id}).then((response) => {
+        const rebloggedByUsers = response.map(item => ({
+          src: item.avatar_static,
+          name: item.display_name
+        }))
+        this.$store.dispatch('addRebloggedByUsers', { rebloggedByUsers, id })
+      })
     }
   }
 }
diff --git a/src/components/status/status.js b/src/components/status/status.js
index e470eaeb..eda96373 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -262,6 +262,8 @@ const Status = {
     favouritedByUsers () {
       return this.statusoid.favoritedBy ? this.statusoid.favoritedBy : []
     },
+    rebloggedByUsers () {
+      return this.statusoid.rebloggedBy ? this.statusoid.rebloggedBy : []
     }
   },
   components: {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 690e8318..6b8e0b3d 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -142,6 +142,16 @@
             <favorite-button :loggedIn='loggedIn' :status='status'></favorite-button>
             <delete-button :status='status'></delete-button>
           </div>
+          <div class="boosted-users">
+            <div class="reblogged-users" v-if="rebloggedByUsers.length > 0" :class="{ 'status-fadein': rebloggedByUsers.length > 0 }">
+              <p class="title">Boosted By {{rebloggedByUsers.length}}:</p>
+              <AvatarList :avatars='rebloggedByUsers'></AvatarList>
+            </div>
+            <div class="favourited-users" v-if="favouritedByUsers.length > 0" :class="{ 'status-fadein': favouritedByUsers.length > 0 }">
+              <p class="title">Favourited By {{favouritedByUsers.length}}:</p>
+              <AvatarList :avatars='favouritedByUsers'></AvatarList>
+            </div>
+          </div>
         </div>
       </div>
       <div class="container" v-if="replying">
@@ -612,6 +622,21 @@ a.unmute {
   }
 }
 
+.boosted-users {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 10px;
+
+  .favourited-users,
+  .reblogged-users {
+    flex: 1;
+
+    .title {
+      margin: 0 0 10px 0;
+    }
+  }
+}
+
 @media all and (max-width: 800px) {
   .status-el {
     .retweet-info {
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 8d2eb424..c749e60f 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -466,6 +466,11 @@ export const mutations = {
       favoritedBy: favoritedByUsers
     }
   },
+  addRebloggedByUsers (state, { rebloggedByUsers, id }) {
+    state.allStatusesObject[id] = {
+      ...state.allStatusesObject[id],
+      rebloggedBy: rebloggedByUsers
+    }
   }
 }
 
@@ -535,6 +540,8 @@ const statuses = {
     addFavoritedByUsers ({ rootState, commit }, { favoritedByUsers, id }) {
       commit('addFavoritedByUsers', { favoritedByUsers, id })
     },
+    addRebloggedByUsers ({ rootState, commit }, { rebloggedByUsers, id }) {
+      commit('addRebloggedByUsers', { rebloggedByUsers, id })
     }
   },
   mutations
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index 45eec566..120398f0 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -50,6 +50,7 @@ const MASTODON_UNMUTE_USER_URL = id => `/api/v1/accounts/${id}/unmute`
 const MASTODON_POST_STATUS_URL = '/api/v1/statuses'
 const MASTODON_MEDIA_UPLOAD_URL = '/api/v1/media'
 const MASTODON_STATUS_FAVOURITEDBY_URL = id => `/api/v1/statuses/${id}/favourited_by`
+const MASTODON_STATUS_REBLOGGEDBY_URL = id => `/api/v1/statuses/${id}/reblogged_by`
 
 import { each, map } from 'lodash'
 import { parseStatus, parseUser, parseNotification, parseAttachment } from '../entity_normalizer/entity_normalizer.service.js'
@@ -797,7 +798,9 @@ const apiService = {
   approveUser,
   denyUser,
   suggestions,
-  markNotificationsAsSeen
+  markNotificationsAsSeen,
+  fetchFavouritedByUsers,
+  fetchRebloggedByUsers
 }
 
 export default apiService
diff --git a/src/services/backend_interactor_service/backend_interactor_service.js b/src/services/backend_interactor_service/backend_interactor_service.js
index 5faec9af..01663a64 100644
--- a/src/services/backend_interactor_service/backend_interactor_service.js
+++ b/src/services/backend_interactor_service/backend_interactor_service.js
@@ -113,6 +113,8 @@ const backendInteractorService = (credentials) => {
   const changePassword = ({password, newPassword, newPasswordConfirmation}) => apiService.changePassword({credentials, password, newPassword, newPasswordConfirmation})
 
   const fetchFavouritedByUsers = ({id}) => apiService.fetchFavouritedByUsers({id})
+  const fetchRebloggedByUsers = ({id}) => apiService.fetchRebloggedByUsers({id})
+
   const backendInteractorServiceInstance = {
     fetchStatus,
     fetchConversation,
@@ -155,6 +157,7 @@ const backendInteractorService = (credentials) => {
     approveUser,
     denyUser,
     fetchFavouritedByUsers,
+    fetchRebloggedByUsers
   }
 
   return backendInteractorServiceInstance
-- 
cgit v1.2.3-70-g09d2


From 44d07ceb25ab8902a4d67b156474e737d6541362 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Tue, 2 Apr 2019 04:25:08 -0400
Subject: support mobile size screen

---
 src/components/avatar_list/avatar_list.vue | 20 ++++++++++++++++----
 src/components/status/status.vue           |  4 +++-
 2 files changed, 19 insertions(+), 5 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
index 3241609c..56ca12a2 100644
--- a/src/components/avatar_list/avatar_list.vue
+++ b/src/components/avatar_list/avatar_list.vue
@@ -14,14 +14,26 @@
   display: inline-flex; /* Causes LI items to display in row. */
   list-style-type: none;
   margin: 0;
-  padding: 0px 16px 0px 0px;
-  flex-direction: row-reverse;
+  padding: 0px 20px 0px 0px;
+  flex-direction: row;
+  flex-wrap: wrap;
 
   &__item {
     height: 40px;
     margin: 0;
     padding: 0;
-    width: 25px;
+    width: 20px;
+
+    &:nth-child( 1 ) { z-index: 10 ; }
+    &:nth-child( 2 ) { z-index: 9 ; }
+    &:nth-child( 3 ) { z-index: 8 ; }
+    &:nth-child( 4 ) { z-index: 7 ; }
+    &:nth-child( 5 ) { z-index: 6 ; }
+    &:nth-child( 6 ) { z-index: 5 ; }
+    &:nth-child( 7 ) { z-index: 4 ; }
+    &:nth-child( 8 ) { z-index: 3 ; }
+    &:nth-child( 9 ) { z-index: 2 ; }
+    &:nth-child( 10 ) { z-index: 1 ; }
 
     .avatars__img {
       border-radius: 50%;
@@ -35,7 +47,7 @@
 
 .transparent-avatar {
   .avatars__item {
-    &:first-child {
+    &:last-child {
       position: relative;
 
       .avatars__img {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 6b8e0b3d..f67f849c 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -629,7 +629,9 @@ a.unmute {
 
   .favourited-users,
   .reblogged-users {
-    flex: 1;
+    flex-basis: 50%;
+    flex-grow: 1;
+    flex-shrink: 1;
 
     .title {
       margin: 0 0 10px 0;
-- 
cgit v1.2.3-70-g09d2


From 6511166631aa752faff02568802362155918e804 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Tue, 2 Apr 2019 12:02:40 -0400
Subject: display favs & favorited user in one line

---
 src/components/avatar_list/avatar_list.vue | 42 +++++++++++-------------------
 src/components/status/status.js            | 10 +++----
 src/components/status/status.vue           | 29 ++++-----------------
 3 files changed, 25 insertions(+), 56 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
index a3bed515..fd6d8336 100644
--- a/src/components/avatar_list/avatar_list.vue
+++ b/src/components/avatar_list/avatar_list.vue
@@ -1,7 +1,7 @@
 <template>
-  <ul class="avatars" :class="{ 'transparent-avatar': slicedAvatars.length == 10 }">
-      <li class="avatars__item" v-for="avatar in slicedAvatars" :key="avatar.id">
-        <UserAvatar :src="avatar.avatar_static" class="avatars__img" />
+  <ul class="avatars" :class="{ 'transparent-avatar': slicedAvatars.length == 15 }">
+      <li class="avatars-item" v-for="avatar in slicedAvatars" :key="avatar.id">
+        <UserAvatar :src="avatar.profile_image_url" class="avatars-img" />
       </li>
   </ul>
 </template>
@@ -14,43 +14,31 @@
   display: inline-flex; /* Causes LI items to display in row. */
   list-style-type: none;
   margin: 0;
-  padding: 0px 20px 0px 0px;
-  flex-direction: row;
-  flex-wrap: wrap;
+  padding: 0px 15px 0px 0px;
+  flex-direction: row-reverse;
 
-  &__item {
-    height: 40px;
+  &-item {
+    height: 30px;
     margin: 0;
     padding: 0;
-    width: 20px;
+    width: 15px;
 
-    &:nth-child( 1 ) { z-index: 10 ; }
-    &:nth-child( 2 ) { z-index: 9 ; }
-    &:nth-child( 3 ) { z-index: 8 ; }
-    &:nth-child( 4 ) { z-index: 7 ; }
-    &:nth-child( 5 ) { z-index: 6 ; }
-    &:nth-child( 6 ) { z-index: 5 ; }
-    &:nth-child( 7 ) { z-index: 4 ; }
-    &:nth-child( 8 ) { z-index: 3 ; }
-    &:nth-child( 9 ) { z-index: 2 ; }
-    &:nth-child( 10 ) { z-index: 1 ; }
-
-    .avatars__img {
+    .avatars-img {
       border-radius: 50%;
-      height: 40px;
-      width: 40px;
-      line-height: 40px;
+      height: 30px;
+      width: 30px;
+      line-height: 30px;
       background-color: $main-background;
     }
   }
 }
 
 .transparent-avatar {
-  .avatars__item {
-    &:last-child {
+  .avatars-item {
+    &:first-child {
       position: relative;
 
-      .avatars__img {
+      .avatars-img {
         &::after {
           content: '';
           position: absolute;
diff --git a/src/components/status/status.js b/src/components/status/status.js
index eda96373..b275d4fa 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -259,11 +259,11 @@ const Status = {
       }
       return this.status.summary_html + '<br />' + this.status.statusnet_html
     },
-    favouritedByUsers () {
-      return this.statusoid.favoritedBy ? this.statusoid.favoritedBy : []
-    },
-    rebloggedByUsers () {
-      return this.statusoid.rebloggedBy ? this.statusoid.rebloggedBy : []
+    combinedFavsAndRepeatsAvatars () {
+      return [].concat(
+        this.statusoid.favoritedBy ? this.statusoid.favoritedBy : [],
+        this.statusoid.rebloggedBy ? this.statusoid.rebloggedBy : []
+      )
     }
   },
   components: {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index f67f849c..ce4b2554 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -133,6 +133,10 @@
             <link-preview :card="status.card" :size="attachmentSize" :nsfw="nsfwClickthrough" />
           </div>
 
+          <div class="favs-favourited-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
+            <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
+          </div>
+
           <div v-if="!noHeading && !isPreview" class='status-actions media-body'>
             <div v-if="loggedIn">
               <i class="button-icon icon-reply" v-on:click.prevent="toggleReplying" :title="$t('tool_tip.reply')" :class="{'icon-reply-active': replying}"></i>
@@ -142,16 +146,6 @@
             <favorite-button :loggedIn='loggedIn' :status='status'></favorite-button>
             <delete-button :status='status'></delete-button>
           </div>
-          <div class="boosted-users">
-            <div class="reblogged-users" v-if="rebloggedByUsers.length > 0" :class="{ 'status-fadein': rebloggedByUsers.length > 0 }">
-              <p class="title">Boosted By {{rebloggedByUsers.length}}:</p>
-              <AvatarList :avatars='rebloggedByUsers'></AvatarList>
-            </div>
-            <div class="favourited-users" v-if="favouritedByUsers.length > 0" :class="{ 'status-fadein': favouritedByUsers.length > 0 }">
-              <p class="title">Favourited By {{favouritedByUsers.length}}:</p>
-              <AvatarList :avatars='favouritedByUsers'></AvatarList>
-            </div>
-          </div>
         </div>
       </div>
       <div class="container" v-if="replying">
@@ -622,21 +616,8 @@ a.unmute {
   }
 }
 
-.boosted-users {
-  display: flex;
-  justify-content: space-between;
+.favs-favourited-users {
   margin-top: 10px;
-
-  .favourited-users,
-  .reblogged-users {
-    flex-basis: 50%;
-    flex-grow: 1;
-    flex-shrink: 1;
-
-    .title {
-      margin: 0 0 10px 0;
-    }
-  }
 }
 
 @media all and (max-width: 800px) {
-- 
cgit v1.2.3-70-g09d2


From 8c9bcdc6c16f3a6dad5131b8163ee9d933b6b952 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Tue, 2 Apr 2019 12:13:55 -0400
Subject: rename favourite to favorite

---
 src/components/conversation/conversation.js                       | 6 +++---
 src/components/status/status.vue                                  | 4 ++--
 src/modules/statuses.js                                           | 4 ++--
 src/services/api/api.service.js                                   | 8 ++++----
 .../backend_interactor_service/backend_interactor_service.js      | 4 ++--
 5 files changed, 13 insertions(+), 13 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index 851d30e9..ba90746e 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -121,7 +121,7 @@ const conversation = {
         this.$store.state.api.backendInteractor.fetchConversation({id: this.status.id})
           .then(({ancestors, descendants}) => {
             const ancestorId = ancestors.length ? ancestors[0].id : this.status.id
-            this.fetchFavouritedByUsers(ancestorId)
+            this.fetchFavoritedByUsers(ancestorId)
             this.fetchRebloggedByUsers(ancestorId)
             this.$store.dispatch('addNewStatuses', { statuses: ancestors })
             this.$store.dispatch('addNewStatuses', { statuses: descendants })
@@ -152,8 +152,8 @@ const conversation = {
         this.setHighlight(null)
       }
     },
-    fetchFavouritedByUsers (id) {
-      this.$store.dispatch('fetchFavouritedByUsers', { id })
+    fetchFavoritedByUsers (id) {
+      this.$store.dispatch('fetchFavoritedByUsers', { id })
     },
     fetchRebloggedByUsers (id) {
       this.$store.dispatch('fetchRebloggedByUsers', { id })
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index ce4b2554..a8042afe 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -133,7 +133,7 @@
             <link-preview :card="status.card" :size="attachmentSize" :nsfw="nsfwClickthrough" />
           </div>
 
-          <div class="favs-favourited-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
+          <div class="favs-favorited-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
             <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
           </div>
 
@@ -616,7 +616,7 @@ a.unmute {
   }
 }
 
-.favs-favourited-users {
+.favs-favorited-users {
   margin-top: 10px;
 }
 
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 2cfc3ff1..44213e75 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -537,8 +537,8 @@ const statuses = {
         credentials: rootState.users.currentUser.credentials
       })
     },
-    fetchFavouritedByUsers ({ rootState, commit }, { id }) {
-      rootState.api.backendInteractor.fetchFavouritedByUsers({id}).then((favoritedByUsers) => commit('addFavoritedByUsers', { favoritedByUsers, id }))
+    fetchFavoritedByUsers ({ rootState, commit }, { id }) {
+      rootState.api.backendInteractor.fetchFavoritedByUsers({id}).then((favoritedByUsers) => commit('addFavoritedByUsers', { favoritedByUsers, id }))
     },
     fetchRebloggedByUsers ({ rootState, commit }, { id }) {
       rootState.api.backendInteractor.fetchRebloggedByUsers({id}).then((rebloggedByUsers) => commit('addRebloggedByUsers', { rebloggedByUsers, id }))
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index 1f9e9a88..90309edf 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -49,7 +49,7 @@ const MASTODON_MUTE_USER_URL = id => `/api/v1/accounts/${id}/mute`
 const MASTODON_UNMUTE_USER_URL = id => `/api/v1/accounts/${id}/unmute`
 const MASTODON_POST_STATUS_URL = '/api/v1/statuses'
 const MASTODON_MEDIA_UPLOAD_URL = '/api/v1/media'
-const MASTODON_STATUS_FAVOURITEDBY_URL = id => `/api/v1/statuses/${id}/favourited_by`
+const MASTODON_STATUS_FAVORITEDBY_URL = id => `/api/v1/statuses/${id}/favourited_by`
 const MASTODON_STATUS_REBLOGGEDBY_URL = id => `/api/v1/statuses/${id}/reblogged_by`
 
 import { each, map } from 'lodash'
@@ -724,8 +724,8 @@ const markNotificationsAsSeen = ({id, credentials}) => {
   }).then((data) => data.json())
 }
 
-const fetchFavouritedByUsers = ({id}) => {
-  return promisedRequest(MASTODON_STATUS_FAVOURITEDBY_URL(id)).then((users) => users.map(parseUser))
+const fetchFavoritedByUsers = ({id}) => {
+  return promisedRequest(MASTODON_STATUS_FAVORITEDBY_URL(id)).then((users) => users.map(parseUser))
 }
 
 const fetchRebloggedByUsers = ({id}) => {
@@ -781,7 +781,7 @@ const apiService = {
   denyUser,
   suggestions,
   markNotificationsAsSeen,
-  fetchFavouritedByUsers,
+  fetchFavoritedByUsers,
   fetchRebloggedByUsers
 }
 
diff --git a/src/services/backend_interactor_service/backend_interactor_service.js b/src/services/backend_interactor_service/backend_interactor_service.js
index 01663a64..0768c806 100644
--- a/src/services/backend_interactor_service/backend_interactor_service.js
+++ b/src/services/backend_interactor_service/backend_interactor_service.js
@@ -112,7 +112,7 @@ const backendInteractorService = (credentials) => {
   const deleteAccount = ({password}) => apiService.deleteAccount({credentials, password})
   const changePassword = ({password, newPassword, newPasswordConfirmation}) => apiService.changePassword({credentials, password, newPassword, newPasswordConfirmation})
 
-  const fetchFavouritedByUsers = ({id}) => apiService.fetchFavouritedByUsers({id})
+  const fetchFavoritedByUsers = ({id}) => apiService.fetchFavoritedByUsers({id})
   const fetchRebloggedByUsers = ({id}) => apiService.fetchRebloggedByUsers({id})
 
   const backendInteractorServiceInstance = {
@@ -156,7 +156,7 @@ const backendInteractorService = (credentials) => {
     fetchFollowRequests,
     approveUser,
     denyUser,
-    fetchFavouritedByUsers,
+    fetchFavoritedByUsers,
     fetchRebloggedByUsers
   }
 
-- 
cgit v1.2.3-70-g09d2


From 45b69dc312b991fba9ecb7649e7c5f9db24374a7 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Fri, 5 Apr 2019 03:08:40 -0400
Subject: add avatar list section title

---
 src/components/status/status.vue | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index a8042afe..ceb8bdf7 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -133,7 +133,10 @@
             <link-preview :card="status.card" :size="attachmentSize" :nsfw="nsfwClickthrough" />
           </div>
 
-          <div class="favs-favorited-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
+          <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
+            <div class="favs-repeated-title">
+              <span>Favorites {{statusoid.favoritedBy.length}} Repeats {{statusoid.rebloggedBy.length}}</span>
+            </div>
             <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
           </div>
 
@@ -616,8 +619,15 @@ a.unmute {
   }
 }
 
-.favs-favorited-users {
+.favs-repeated-users {
   margin-top: 10px;
+
+  .favs-repeated-title {
+    margin-bottom: 5px;
+    & > span {
+      border-bottom: 1px solid var(--text);
+    }
+  }
 }
 
 @media all and (max-width: 800px) {
-- 
cgit v1.2.3-70-g09d2


From a8de51515581c61a4de7fd7911d89ba06e990dbe Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Fri, 5 Apr 2019 03:11:32 -0400
Subject: use i18n for title text

---
 src/components/status/status.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index ceb8bdf7..cef86df6 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -135,7 +135,7 @@
 
           <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
             <div class="favs-repeated-title">
-              <span>Favorites {{statusoid.favoritedBy.length}} Repeats {{statusoid.rebloggedBy.length}}</span>
+              <span>{{ $t('user_card.favorites') }} {{statusoid.favoritedBy.length}} {{ $t('settings.notification_visibility_repeats') }} {{statusoid.rebloggedBy.length}}</span>
             </div>
             <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
           </div>
@@ -623,7 +623,7 @@ a.unmute {
   margin-top: 10px;
 
   .favs-repeated-title {
-    margin-bottom: 5px;
+    margin-bottom: 8px;
     & > span {
       border-bottom: 1px solid var(--text);
     }
-- 
cgit v1.2.3-70-g09d2


From 5be03eb16104fe5adca9718a034daaf145415f28 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Fri, 5 Apr 2019 03:29:31 -0400
Subject: handle 0 length of avatars

---
 src/components/status/status.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index cef86df6..01ace0cf 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -135,7 +135,7 @@
 
           <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
             <div class="favs-repeated-title">
-              <span>{{ $t('user_card.favorites') }} {{statusoid.favoritedBy.length}} {{ $t('settings.notification_visibility_repeats') }} {{statusoid.rebloggedBy.length}}</span>
+              <span>{{ statusoid.favoritedBy.length ? `${$t('user_card.favorites')} ${statusoid.favoritedBy.length}` : '' }} {{ statusoid.rebloggedBy.length ? `${$t('settings.notification_visibility_repeats')} ${statusoid.rebloggedBy.length}` : '' }}</span>
             </div>
             <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
           </div>
-- 
cgit v1.2.3-70-g09d2


From db2733b2654d3d7dc1c82d6d61eb34d559df5815 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Fri, 5 Apr 2019 03:35:22 -0400
Subject: set fall back value of border color

---
 src/components/status/status.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 01ace0cf..c26b9792 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -625,7 +625,7 @@ a.unmute {
   .favs-repeated-title {
     margin-bottom: 8px;
     & > span {
-      border-bottom: 1px solid var(--text);
+      border-bottom: 1px solid var(--text, $fallback--lightText);
     }
   }
 }
-- 
cgit v1.2.3-70-g09d2


From 94730c9ff7d28fb4d040af5f68a73206a7b5abd1 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Fri, 5 Apr 2019 13:35:05 -0400
Subject: update design of stats section

---
 src/components/status/status.vue | 56 ++++++++++++++++++++++++++++++++++------
 1 file changed, 48 insertions(+), 8 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index c26b9792..8d95343d 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -134,10 +134,17 @@
           </div>
 
           <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
-            <div class="favs-repeated-title">
-              <span>{{ statusoid.favoritedBy.length ? `${$t('user_card.favorites')} ${statusoid.favoritedBy.length}` : '' }} {{ statusoid.rebloggedBy.length ? `${$t('settings.notification_visibility_repeats')} ${statusoid.rebloggedBy.length}` : '' }}</span>
-            </div>
-            <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
+            <ul class="stats">
+              <li class="stat-count" v-if="statusoid.favoritedBy && statusoid.favoritedBy.length > 0">
+                <a class="request-favorited-popup"><strong>{{statusoid.favoritedBy.length}}</strong> {{ $t('user_card.favorites') }}</a>
+              </li>
+              <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
+                <a class="request-favorited-popup"><strong>{{statusoid.rebloggedBy.length}}</strong> {{ $t('settings.notification_visibility_repeats') }}</a>
+              </li>
+              <li class="avatar-row">
+                <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
+              </li>
+            </ul>
           </div>
 
           <div v-if="!noHeading && !isPreview" class='status-actions media-body'>
@@ -622,10 +629,43 @@ a.unmute {
 .favs-repeated-users {
   margin-top: 10px;
 
-  .favs-repeated-title {
-    margin-bottom: 8px;
-    & > span {
-      border-bottom: 1px solid var(--text, $fallback--lightText);
+  .stats {
+    border-bottom: 1px solid var(--faint, $fallback--faint);
+    border-top: 1px solid var(--faint, $fallback--faint);
+    width: 100%;
+    margin: 0;
+    list-style: none;
+    overflow: hidden;
+    padding: 0;
+    display: flex;
+
+    .stat-count {
+      margin-right: 10px;
+
+      a {
+        cursor: pointer;
+        padding-top: 14px;
+        float: left;
+        color: var(--faint, $fallback--faint);
+
+        strong {
+          color: var(--text, $fallback--text);
+        }
+
+        &:hover,
+        &:focus {
+          border-bottom: 1px solid var(--faint, $fallback--faint);
+        }
+      }
+    }
+
+    .avatar-row {
+      flex: 1;
+      overflow: hidden;
+    }
+
+    li {
+      display: block;
     }
   }
 }
-- 
cgit v1.2.3-70-g09d2


From 80ba4f27c8109be6871a8c2b539cbb392eb8513f Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Fri, 5 Apr 2019 14:20:50 -0400
Subject: add hover effect to label

---
 src/components/avatar_list/avatar_list.vue |  2 -
 src/components/status/status.vue           | 61 +++++++++++++++++++++++++-----
 2 files changed, 51 insertions(+), 12 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
index d7ac22dd..dcffb7cd 100644
--- a/src/components/avatar_list/avatar_list.vue
+++ b/src/components/avatar_list/avatar_list.vue
@@ -20,10 +20,8 @@
     height: 24px;
     width: 24px;
     margin: 0 5px 0 0;
-    padding: 11px 0;
 
     &:first-child {
-      border-left: 1px solid var(--faint, $fallback--faint);
       padding-left: 12px !important;
     }
 
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 8d95343d..9be6b2b9 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -135,11 +135,13 @@
 
           <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
             <ul class="stats">
-              <li class="stat-count" v-if="statusoid.favoritedBy && statusoid.favoritedBy.length > 0">
-                <a class="request-favorited-popup"><strong>{{statusoid.favoritedBy.length}}</strong> {{ $t('user_card.favorites') }}</a>
-              </li>
               <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
-                <a class="request-favorited-popup"><strong>{{statusoid.rebloggedBy.length}}</strong> {{ $t('settings.notification_visibility_repeats') }}</a>
+                <div class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</div>
+                <div class="stat-number">{{ statusoid.rebloggedBy.length }}</div>
+              </li>
+              <li class="stat-count" v-if="statusoid.favoritedBy && statusoid.favoritedBy.length > 0">
+                <div class="stat-title">{{ $t('user_card.favorites') }}</div>
+                <div class="stat-number">{{ statusoid.favoritedBy.length }}</div>
               </li>
               <li class="avatar-row">
                 <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
@@ -627,25 +629,52 @@ a.unmute {
 }
 
 .favs-repeated-users {
-  margin-top: 10px;
+  margin-top: 0.75em;
 
   .stats {
-    border-bottom: 1px solid var(--faint, $fallback--faint);
-    border-top: 1px solid var(--faint, $fallback--faint);
     width: 100%;
     margin: 0;
     list-style: none;
     overflow: hidden;
     padding: 0;
     display: flex;
+    line-height: 1em;
 
     .stat-count {
       margin-right: 10px;
 
+      .stat-title {
+        color: var(--faint, rgba(185, 185, 186, 0.5));
+        font-weight: lighter;
+        font-size: 12px;
+        text-transform: uppercase;
+        position: relative;
+        margin-bottom: 3px;
+        cursor: pointer;
+        line-height: 1em;
+
+        &:hover,
+        &:focus {
+          &::after {
+            content: '';
+            position: absolute;
+            left: 0;
+            top: 100%;
+            width: 100%;
+            height: 1px;
+            background-color: var(--faint, $fallback--faint);
+          }
+        }
+      }
+
+      .stat-number {
+        font-weight: bolder;
+        font-size: 16px;
+        line-height: 1em;
+      }
+
       a {
         cursor: pointer;
-        padding-top: 14px;
-        float: left;
         color: var(--faint, $fallback--faint);
 
         strong {
@@ -662,10 +691,22 @@ a.unmute {
     .avatar-row {
       flex: 1;
       overflow: hidden;
+      position: relative;
+
+      &::before {
+        content: '';
+        position: absolute;
+        height: 100%;
+        width: 1px;
+        left: 0;
+        background-color: var(--faint, $fallback--faint);
+      }
     }
 
     li {
-      display: block;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
     }
   }
 }
-- 
cgit v1.2.3-70-g09d2


From c361b41641d9860ac42263ae8b81b512439fa471 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Fri, 5 Apr 2019 14:55:19 -0400
Subject: use global fallback variable

---
 src/components/status/status.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 9be6b2b9..ea929b6b 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -644,7 +644,7 @@ a.unmute {
       margin-right: 10px;
 
       .stat-title {
-        color: var(--faint, rgba(185, 185, 186, 0.5));
+        color: var(--faint, $fallback--faint);
         font-weight: lighter;
         font-size: 12px;
         text-transform: uppercase;
-- 
cgit v1.2.3-70-g09d2


From 2d826abb41833d927ef9dcb39082e52d7892c548 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Sat, 6 Apr 2019 14:38:08 -0400
Subject: use normal font weight instead of lighter

---
 src/components/status/status.vue | 1 -
 1 file changed, 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index ea929b6b..a56fc31f 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -645,7 +645,6 @@ a.unmute {
 
       .stat-title {
         color: var(--faint, $fallback--faint);
-        font-weight: lighter;
         font-size: 12px;
         text-transform: uppercase;
         position: relative;
-- 
cgit v1.2.3-70-g09d2


From e734370e335b76adff783378cd3ae0e977855938 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Sat, 6 Apr 2019 14:49:37 -0400
Subject: use a tag for favs/repeated title

---
 src/components/status/status.vue | 23 +++++------------------
 1 file changed, 5 insertions(+), 18 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index a56fc31f..352f0d78 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -136,11 +136,11 @@
           <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
             <ul class="stats">
               <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
-                <div class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</div>
+                <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
                 <div class="stat-number">{{ statusoid.rebloggedBy.length }}</div>
               </li>
               <li class="stat-count" v-if="statusoid.favoritedBy && statusoid.favoritedBy.length > 0">
-                <div class="stat-title">{{ $t('user_card.favorites') }}</div>
+                <a class="stat-title">{{ $t('user_card.favorites') }}</a>
                 <div class="stat-number">{{ statusoid.favoritedBy.length }}</div>
               </li>
               <li class="avatar-row">
@@ -654,15 +654,7 @@ a.unmute {
 
         &:hover,
         &:focus {
-          &::after {
-            content: '';
-            position: absolute;
-            left: 0;
-            top: 100%;
-            width: 100%;
-            height: 1px;
-            background-color: var(--faint, $fallback--faint);
-          }
+          text-decoration: underline;
         }
       }
 
@@ -672,19 +664,14 @@ a.unmute {
         line-height: 1em;
       }
 
-      a {
+      /* a {
         cursor: pointer;
         color: var(--faint, $fallback--faint);
 
         strong {
           color: var(--text, $fallback--text);
         }
-
-        &:hover,
-        &:focus {
-          border-bottom: 1px solid var(--faint, $fallback--faint);
-        }
-      }
+      } */
     }
 
     .avatar-row {
-- 
cgit v1.2.3-70-g09d2


From 1f4fcf56cdda58b20804b131adcdca9c7290ed12 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Sat, 6 Apr 2019 14:52:17 -0400
Subject: remove custom fadein logic

---
 src/components/status/status.vue | 16 +---------------
 1 file changed, 1 insertion(+), 15 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 352f0d78..67ba714f 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -133,7 +133,7 @@
             <link-preview :card="status.card" :size="attachmentSize" :nsfw="nsfwClickthrough" />
           </div>
 
-          <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0" :class="{ 'status-fadein': combinedFavsAndRepeatsAvatars.length > 0 }">
+          <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0">
             <ul class="stats">
               <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
                 <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
@@ -530,20 +530,6 @@ $status-margin: 0.75em;
   }
 }
 
-.status-fadein {
-  animation-duration: 0.4s;
-  animation-name: fadein;
-}
-
-@keyframes fadein {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-
 .greentext {
   color: green;
 }
-- 
cgit v1.2.3-70-g09d2


From b75d899c7a54ff38d1331f043c156bd90baf0f59 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Sat, 6 Apr 2019 14:54:23 -0400
Subject: use transition wrapper component

---
 src/components/status/status.vue | 32 +++++++++++++++++---------------
 1 file changed, 17 insertions(+), 15 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 67ba714f..ff93b24d 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -133,21 +133,23 @@
             <link-preview :card="status.card" :size="attachmentSize" :nsfw="nsfwClickthrough" />
           </div>
 
-          <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0">
-            <ul class="stats">
-              <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
-                <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
-                <div class="stat-number">{{ statusoid.rebloggedBy.length }}</div>
-              </li>
-              <li class="stat-count" v-if="statusoid.favoritedBy && statusoid.favoritedBy.length > 0">
-                <a class="stat-title">{{ $t('user_card.favorites') }}</a>
-                <div class="stat-number">{{ statusoid.favoritedBy.length }}</div>
-              </li>
-              <li class="avatar-row">
-                <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
-              </li>
-            </ul>
-          </div>
+          <transition name="fade">
+            <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0">
+              <ul class="stats">
+                <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
+                  <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
+                  <div class="stat-number">{{ statusoid.rebloggedBy.length }}</div>
+                </li>
+                <li class="stat-count" v-if="statusoid.favoritedBy && statusoid.favoritedBy.length > 0">
+                  <a class="stat-title">{{ $t('user_card.favorites') }}</a>
+                  <div class="stat-number">{{ statusoid.favoritedBy.length }}</div>
+                </li>
+                <li class="avatar-row">
+                  <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
+                </li>
+              </ul>
+            </div>
+          </transition>
 
           <div v-if="!noHeading && !isPreview" class='status-actions media-body'>
             <div v-if="loggedIn">
-- 
cgit v1.2.3-70-g09d2


From 246fab328faf427d26f0a328033e07a286b429a3 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Mon, 8 Apr 2019 13:58:29 -0400
Subject: remove commented code

---
 src/components/status/status.vue | 9 ---------
 1 file changed, 9 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index ff93b24d..653e07b7 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -651,15 +651,6 @@ a.unmute {
         font-size: 16px;
         line-height: 1em;
       }
-
-      /* a {
-        cursor: pointer;
-        color: var(--faint, $fallback--faint);
-
-        strong {
-          color: var(--text, $fallback--text);
-        }
-      } */
     }
 
     .avatar-row {
-- 
cgit v1.2.3-70-g09d2


From 8cac0dec6ff8be9180f29bd09cdc996fb1ad3556 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Mon, 8 Apr 2019 14:06:18 -0400
Subject: add fadein effect to panel

---
 src/components/status/status.vue | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 653e07b7..1c055c41 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -532,6 +532,20 @@ $status-margin: 0.75em;
   }
 }
 
+.status-fadein {
+  animation-duration: 0.4s;
+  animation-name: fadein;
+}
+
+@keyframes fadein {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
 .greentext {
   color: green;
 }
-- 
cgit v1.2.3-70-g09d2


From efd20967df1eb633206dcab3d37905653dccd723 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Mon, 8 Apr 2019 14:21:01 -0400
Subject: display avatars only on highlighted post

---
 src/components/status/status.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 1c055c41..34bb64d0 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -134,7 +134,7 @@
           </div>
 
           <transition name="fade">
-            <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0">
+            <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0 && isFocused">
               <ul class="stats">
                 <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
                   <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
-- 
cgit v1.2.3-70-g09d2


From 8ed4eb8a7ffe0e370cfc06017d2bce34b2c9d987 Mon Sep 17 00:00:00 2001
From: Brenden Bice <brenden.next@gmail.com>
Date: Tue, 9 Apr 2019 11:45:33 -0400
Subject: refactor showing favs and repeats logic

---
 src/components/conversation/conversation.js        |  6 ++--
 src/components/status/status.js                    |  7 +++-
 src/components/status/status.vue                   |  8 ++---
 src/components/timeline/timeline.vue               |  3 +-
 src/modules/statuses.js                            | 39 +++++-----------------
 .../backend_interactor_service.js                  |  4 +--
 6 files changed, 23 insertions(+), 44 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index 5cc7f4ee..ffeb7244 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -41,8 +41,7 @@ const conversation = {
   props: [
     'statusoid',
     'collapsable',
-    'isPage',
-    'timelineName'
+    'isPage'
   ],
   created () {
     if (this.isPage) {
@@ -121,8 +120,6 @@ const conversation = {
       if (this.status) {
         this.$store.state.api.backendInteractor.fetchConversation({id: this.status.id})
           .then(({ancestors, descendants}) => {
-            this.$store.dispatch('fetchFavoritedByUsers', { id: this.statusId, retweetedStatusId: this.status.id, timelineName: this.timelineName })
-            this.$store.dispatch('fetchRebloggedByUsers', { id: this.statusId, retweetedStatusId: this.status.id, timelineName: this.timelineName })
             this.$store.dispatch('addNewStatuses', { statuses: ancestors })
             this.$store.dispatch('addNewStatuses', { statuses: descendants })
           })
@@ -142,6 +139,7 @@ const conversation = {
     },
     setHighlight (id) {
       this.highlight = id
+      this.$store.dispatch('fetchFavsAndRepeats', id)
     },
     getHighlight () {
       return this.isExpanded ? this.highlight : null
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 44caf3af..db234ec1 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -98,6 +98,10 @@ const Status = {
         return this.statusoid
       }
     },
+    statusFromGlobalRepository () {
+      // NOTE: Consider to replace status with statusFromGlobalRepository
+      return this.$store.state.statuses.allStatusesObject[this.status.id]
+    },
     loggedIn () {
       return !!this.$store.state.users.currentUser
     },
@@ -260,7 +264,8 @@ const Status = {
       return this.status.summary_html + '<br />' + this.status.statusnet_html
     },
     combinedFavsAndRepeatsAvatars () {
-      const combinedAvatars = [].concat(this.statusoid.favoritedBy, this.statusoid.rebloggedBy).filter(_ => _)
+      // Use the status from the global status repository since favs and repeats are saved in it
+      const combinedAvatars = [].concat(this.statusFromGlobalRepository.favoritedBy, this.statusFromGlobalRepository.rebloggedBy).filter(_ => _)
       return uniqBy(combinedAvatars, 'id')
     }
   },
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 34bb64d0..b0882964 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -136,13 +136,13 @@
           <transition name="fade">
             <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0 && isFocused">
               <ul class="stats">
-                <li class="stat-count" v-if="statusoid.rebloggedBy && statusoid.rebloggedBy.length > 0">
+                <li class="stat-count" v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0">
                   <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
-                  <div class="stat-number">{{ statusoid.rebloggedBy.length }}</div>
+                  <div class="stat-number">{{ statusFromGlobalRepository.rebloggedBy.length }}</div>
                 </li>
-                <li class="stat-count" v-if="statusoid.favoritedBy && statusoid.favoritedBy.length > 0">
+                <li class="stat-count" v-if="statusFromGlobalRepository.favoritedBy && statusFromGlobalRepository.favoritedBy.length > 0">
                   <a class="stat-title">{{ $t('user_card.favorites') }}</a>
-                  <div class="stat-number">{{ statusoid.favoritedBy.length }}</div>
+                  <div class="stat-number">{{ statusFromGlobalRepository.favoritedBy.length }}</div>
                 </li>
                 <li class="avatar-row">
                   <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index 147e8a1d..e6a8d458 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -16,13 +16,12 @@
     </div>
     <div :class="classes.body">
       <div class="timeline">
-        <conversation 
+        <conversation
           v-for="status in timeline.visibleStatuses"
           class="status-fadein"
           :key="status.id"
           :statusoid="status"
           :collapsable="true"
-          :timelineName="timelineName"
         />
       </div>
     </div>
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 023f132e..527cafc2 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -460,32 +460,11 @@ export const mutations = {
   queueFlush (state, { timeline, id }) {
     state.timelines[timeline].flushMarker = id
   },
-  addFavoritedByUsers (state, { favoritedByUsers, id, timelineName }) {
-    if (timelineName) {
-      state.timelines[timelineName].visibleStatusesObject[id] = {
-        ...state.timelines[timelineName].visibleStatusesObject[id],
-        favoritedBy: favoritedByUsers
-      }
-      state.timelines[timelineName].visibleStatuses = state.timelines[timelineName].visibleStatuses.map(visibleStatus => visibleStatus.id === id ? { ...visibleStatus, favoritedBy: favoritedByUsers } : visibleStatus)
-    } else {
-      state.allStatusesObject[id] = {
-        ...state.allStatusesObject[id],
-        favoritedBy: favoritedByUsers
-      }
-    }
-  },
-  addRebloggedByUsers (state, { rebloggedByUsers, id, timelineName }) {
-    if (timelineName) {
-      state.timelines[timelineName].visibleStatusesObject[id] = {
-        ...state.timelines[timelineName].visibleStatusesObject[id],
-        rebloggedBy: rebloggedByUsers
-      }
-      state.timelines[timelineName].visibleStatuses = state.timelines[timelineName].visibleStatuses.map(visibleStatus => visibleStatus.id === id ? { ...visibleStatus, rebloggedBy: rebloggedByUsers } : visibleStatus)
-    } else {
-      state.allStatusesObject[id] = {
-        ...state.allStatusesObject[id],
-        rebloggedBy: rebloggedByUsers
-      }
+  addFavsAndRepeats (state, { id, favoritedByUsers, rebloggedByUsers }) {
+    state.allStatusesObject[id] = {
+      ...state.allStatusesObject[id],
+      favoritedBy: favoritedByUsers,
+      rebloggedBy: rebloggedByUsers
     }
   }
 }
@@ -553,11 +532,9 @@ const statuses = {
         credentials: rootState.users.currentUser.credentials
       })
     },
-    fetchFavoritedByUsers ({ rootState, commit }, { id, retweetedStatusId, timelineName }) {
-      rootState.api.backendInteractor.fetchFavoritedByUsers({id}).then((favoritedByUsers) => commit('addFavoritedByUsers', { favoritedByUsers, id: retweetedStatusId, timelineName }))
-    },
-    fetchRebloggedByUsers ({ rootState, commit }, { id, retweetedStatusId, timelineName }) {
-      rootState.api.backendInteractor.fetchRebloggedByUsers({id}).then((rebloggedByUsers) => commit('addRebloggedByUsers', { rebloggedByUsers, id: retweetedStatusId, timelineName }))
+    fetchFavsAndRepeats ({ rootState, commit }, id) {
+      Promise.all([rootState.api.backendInteractor.fetchFavoritedByUsers(id), rootState.api.backendInteractor.fetchRebloggedByUsers(id)])
+        .then(([favoritedByUsers, rebloggedByUsers]) => commit('addFavsAndRepeats', { id, favoritedByUsers, rebloggedByUsers }))
     }
   },
   mutations
diff --git a/src/services/backend_interactor_service/backend_interactor_service.js b/src/services/backend_interactor_service/backend_interactor_service.js
index 0768c806..c6742d26 100644
--- a/src/services/backend_interactor_service/backend_interactor_service.js
+++ b/src/services/backend_interactor_service/backend_interactor_service.js
@@ -112,8 +112,8 @@ const backendInteractorService = (credentials) => {
   const deleteAccount = ({password}) => apiService.deleteAccount({credentials, password})
   const changePassword = ({password, newPassword, newPasswordConfirmation}) => apiService.changePassword({credentials, password, newPassword, newPasswordConfirmation})
 
-  const fetchFavoritedByUsers = ({id}) => apiService.fetchFavoritedByUsers({id})
-  const fetchRebloggedByUsers = ({id}) => apiService.fetchRebloggedByUsers({id})
+  const fetchFavoritedByUsers = (id) => apiService.fetchFavoritedByUsers({id})
+  const fetchRebloggedByUsers = (id) => apiService.fetchRebloggedByUsers({id})
 
   const backendInteractorServiceInstance = {
     fetchStatus,
-- 
cgit v1.2.3-70-g09d2


From 75a650aa6de13eaf1e0e17d5ec7bfffeee0db212 Mon Sep 17 00:00:00 2001
From: shpuld <shp@cock.li>
Date: Wed, 17 Apr 2019 18:28:44 +0300
Subject: update styles and remove unnecessary stuff

---
 src/components/avatar_list/avatar_list.vue | 49 ++++++++----------------------
 src/components/status/status.vue           | 30 ++++++------------
 2 files changed, 22 insertions(+), 57 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
index 077d002d..fc5abf01 100644
--- a/src/components/avatar_list/avatar_list.vue
+++ b/src/components/avatar_list/avatar_list.vue
@@ -1,7 +1,7 @@
 <template>
-  <ul class="avatars" :class="{ 'transparent-avatar': slicedAvatars.length == 15 }">
-      <li class="avatars-item" v-for="(avatar, index) in slicedAvatars" :key="`avatar-${index}`">
-        <UserAvatar :src="avatar.profile_image_url" class="avatars-img" />
+  <ul class="avatars">
+      <li class="avatars-item" v-for="avatar in slicedAvatars">
+        <UserAvatar :src="avatar.profile_image_url" class="avatar-small" />
       </li>
   </ul>
 </template>
@@ -10,53 +10,28 @@
 
 <style lang="scss">
 @import '../../_variables.scss';
+
 .avatars {
-  display: inline-flex; /* Causes LI items to display in row. */
-  list-style-type: none;
+  display: flex;
   margin: 0;
   padding: 0;
 
+  // For hiding overflowing elements
+  flex-wrap: wrap;
+  height: 24px;
+
   li.avatars-item {
-    height: 24px;
-    width: 24px;
-    margin: 0 5px 0 0;
+    margin: 0 0 5px 5px;
 
     &:first-child {
-      padding-left: 12px;
+      padding-left: 10px;
     }
 
-    &:last-child {
-      margin-right: 0;
-    }
-
-    .avatars-img {
+    .avatar-small {
       border-radius: $fallback--avatarAltRadius;
       border-radius: var(--avatarAltRadius, $fallback--avatarAltRadius);
       height: 24px;
       width: 24px;
-      background-color: $fallback--lightText;
-      background-color: var(--lightText, $fallback--lightText);
-    }
-  }
-}
-
-.transparent-avatar {
-  .avatars-item {
-    &:first-child {
-      position: relative;
-
-      .avatars-img {
-        &::after {
-          content: '';
-          position: absolute;
-          width: 100%;
-          height: 100%;
-          background-color: $fallback--faint;
-          background-color: var(--faint, $fallback--faint);
-          left: 0;
-          top: 0;
-        }
-      }
     }
   }
 }
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index b0882964..d79bb2b9 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -135,19 +135,19 @@
 
           <transition name="fade">
             <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0 && isFocused">
-              <ul class="stats">
-                <li class="stat-count" v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0">
+              <div class="stats">
+                <div class="stat-count" v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0">
                   <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
                   <div class="stat-number">{{ statusFromGlobalRepository.rebloggedBy.length }}</div>
-                </li>
-                <li class="stat-count" v-if="statusFromGlobalRepository.favoritedBy && statusFromGlobalRepository.favoritedBy.length > 0">
+                </div>
+                <div class="stat-count" v-if="statusFromGlobalRepository.favoritedBy && statusFromGlobalRepository.favoritedBy.length > 0">
                   <a class="stat-title">{{ $t('user_card.favorites') }}</a>
                   <div class="stat-number">{{ statusFromGlobalRepository.favoritedBy.length }}</div>
-                </li>
-                <li class="avatar-row">
+                </div>
+                <div class="avatar-row">
                   <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
-                </li>
-              </ul>
+                </div>
+              </div>
             </div>
           </transition>
 
@@ -631,19 +631,15 @@ a.unmute {
 }
 
 .favs-repeated-users {
-  margin-top: 0.75em;
+  margin-top: $status-margin;
 
   .stats {
     width: 100%;
-    margin: 0;
-    list-style: none;
-    overflow: hidden;
-    padding: 0;
     display: flex;
     line-height: 1em;
 
     .stat-count {
-      margin-right: 10px;
+      margin-right: 0.8em;
 
       .stat-title {
         color: var(--faint, $fallback--faint);
@@ -651,13 +647,7 @@ a.unmute {
         text-transform: uppercase;
         position: relative;
         margin-bottom: 3px;
-        cursor: pointer;
         line-height: 1em;
-
-        &:hover,
-        &:focus {
-          text-decoration: underline;
-        }
       }
 
       .stat-number {
-- 
cgit v1.2.3-70-g09d2


From 3e23b341687a94e0b5df74447a5e19bbfb59343b Mon Sep 17 00:00:00 2001
From: shpuld <shp@cock.li>
Date: Mon, 22 Apr 2019 21:07:29 +0300
Subject: fix overflow behavior

---
 src/components/avatar_list/avatar_list.vue | 12 ++++++------
 src/components/status/status.vue           | 12 +++---------
 2 files changed, 9 insertions(+), 15 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
index fc5abf01..b14474ba 100644
--- a/src/components/avatar_list/avatar_list.vue
+++ b/src/components/avatar_list/avatar_list.vue
@@ -1,9 +1,9 @@
 <template>
-  <ul class="avatars">
-      <li class="avatars-item" v-for="avatar in slicedAvatars">
+  <div class="avatars">
+      <div class="avatars-item" v-for="avatar in slicedAvatars">
         <UserAvatar :src="avatar.profile_image_url" class="avatar-small" />
-      </li>
-  </ul>
+      </div>
+  </div>
 </template>
 
 <script src="./avatar_list.js" ></script>
@@ -20,11 +20,11 @@
   flex-wrap: wrap;
   height: 24px;
 
-  li.avatars-item {
+  .avatars-item {
     margin: 0 0 5px 5px;
 
     &:first-child {
-      padding-left: 10px;
+      padding-left: 5px;
     }
 
     .avatar-small {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index d79bb2b9..a9ce722c 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -639,15 +639,13 @@ a.unmute {
     line-height: 1em;
 
     .stat-count {
-      margin-right: 0.8em;
+      margin-right: $status-margin;
 
       .stat-title {
         color: var(--faint, $fallback--faint);
         font-size: 12px;
         text-transform: uppercase;
         position: relative;
-        margin-bottom: 3px;
-        line-height: 1em;
       }
 
       .stat-number {
@@ -661,6 +659,8 @@ a.unmute {
       flex: 1;
       overflow: hidden;
       position: relative;
+      display: flex;
+      align-items: center;
 
       &::before {
         content: '';
@@ -671,12 +671,6 @@ a.unmute {
         background-color: var(--faint, $fallback--faint);
       }
     }
-
-    li {
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-    }
   }
 }
 
-- 
cgit v1.2.3-70-g09d2


From 8af8f719e40af28238329896730effdb4f5f891e Mon Sep 17 00:00:00 2001
From: shpuld <shp@cock.li>
Date: Mon, 22 Apr 2019 21:37:27 +0300
Subject: fix i18n

---
 src/components/status/status.vue | 4 ++--
 src/i18n/en.json                 | 2 ++
 src/i18n/fi.json                 | 2 ++
 3 files changed, 6 insertions(+), 2 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index a9ce722c..a5f7429c 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -137,11 +137,11 @@
             <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0 && isFocused">
               <div class="stats">
                 <div class="stat-count" v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0">
-                  <a class="stat-title">{{ $t('settings.notification_visibility_repeats') }}</a>
+                  <a class="stat-title">{{ $t('status.repeats') }}</a>
                   <div class="stat-number">{{ statusFromGlobalRepository.rebloggedBy.length }}</div>
                 </div>
                 <div class="stat-count" v-if="statusFromGlobalRepository.favoritedBy && statusFromGlobalRepository.favoritedBy.length > 0">
-                  <a class="stat-title">{{ $t('user_card.favorites') }}</a>
+                  <a class="stat-title">{{ $t('status.favorites') }}</a>
                   <div class="stat-number">{{ statusFromGlobalRepository.favoritedBy.length }}</div>
                 </div>
                 <div class="avatar-row">
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 7dca05e3..f4a9a1eb 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -379,6 +379,8 @@
     "no_statuses": "No statuses"
   },
   "status": {
+    "favorites": "Favorites",
+    "repeats": "Repeats",
     "reply_to": "Reply to",
     "replies_list": "Replies:"
   },
diff --git a/src/i18n/fi.json b/src/i18n/fi.json
index fbe676cf..62cbecb8 100644
--- a/src/i18n/fi.json
+++ b/src/i18n/fi.json
@@ -222,6 +222,8 @@
     "no_more_statuses": "Ei enempää viestejä"
   },
   "status": {
+    "favorites": "Tykkäykset",
+    "repeats": "Toistot",
     "reply_to": "Vastaus",
     "replies_list": "Vastaukset:"
   },
-- 
cgit v1.2.3-70-g09d2


From c44c0483566efc8c48361e4143b25d852cecede4 Mon Sep 17 00:00:00 2001
From: shpuld <shp@cock.li>
Date: Wed, 1 May 2019 17:33:56 +0300
Subject: add title and alt for avatars, fix console errors in avatarlist

---
 src/components/avatar_list/avatar_list.js               |  6 +++---
 src/components/avatar_list/avatar_list.vue              |  4 ++--
 src/components/basic_user_card/basic_user_card.vue      |  6 +++++-
 src/components/notification/notification.vue            |  2 +-
 src/components/status/status.js                         |  6 +++---
 src/components/status/status.vue                        | 17 +++++++++++------
 src/components/user_avatar/user_avatar.js               |  2 +-
 src/components/user_avatar/user_avatar.vue              |  4 +++-
 src/components/user_card/user_card.vue                  |  2 +-
 .../entity_normalizer/entity_normalizer.service.js      |  3 +++
 10 files changed, 33 insertions(+), 19 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/avatar_list/avatar_list.js b/src/components/avatar_list/avatar_list.js
index d65125c2..b9e11aaa 100644
--- a/src/components/avatar_list/avatar_list.js
+++ b/src/components/avatar_list/avatar_list.js
@@ -1,10 +1,10 @@
 import UserAvatar from '../user_avatar/user_avatar.vue'
 
 const AvatarList = {
-  props: ['avatars'],
+  props: ['users'],
   computed: {
-    slicedAvatars () {
-      return this.avatars ? this.avatars.slice(0, 15) : []
+    slicedUsers () {
+      return this.users ? this.users.slice(0, 15) : []
     }
   },
   components: {
diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
index b14474ba..4e0de2c9 100644
--- a/src/components/avatar_list/avatar_list.vue
+++ b/src/components/avatar_list/avatar_list.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="avatars">
-      <div class="avatars-item" v-for="avatar in slicedAvatars">
-        <UserAvatar :src="avatar.profile_image_url" class="avatar-small" />
+      <div class="avatars-item" v-for="user in slicedUsers">
+        <UserAvatar :user="user" class="avatar-small" />
       </div>
   </div>
 </template>
diff --git a/src/components/basic_user_card/basic_user_card.vue b/src/components/basic_user_card/basic_user_card.vue
index 25f1fb2a..634d62b3 100644
--- a/src/components/basic_user_card/basic_user_card.vue
+++ b/src/components/basic_user_card/basic_user_card.vue
@@ -1,7 +1,11 @@
 <template>
   <div class="basic-user-card">
     <router-link :to="userProfileLink(user)">
-      <UserAvatar class="avatar" @click.prevent.native="toggleUserExpanded" :src="user.profile_image_url"/>
+      <UserAvatar
+        class="avatar"
+        :user="user"
+        @click.prevent.native="toggleUserExpanded"
+      />
     </router-link>
     <div class="basic-user-card-expanded-content" v-if="userExpanded">
       <UserCard :user="user" :rounded="true" :bordered="true"/>
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index ae11d692..3427b9c5 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -7,7 +7,7 @@
   </status>
   <div class="non-mention" :class="[userClass, { highlighted: userStyle }]" :style="[ userStyle ]" v-else>
     <a class='avatar-container' :href="notification.from_profile.statusnet_profile_url" @click.stop.prevent.capture="toggleUserExpanded">
-      <UserAvatar :compact="true" :betterShadow="betterShadow" :src="notification.from_profile.profile_image_url_original" />
+      <UserAvatar :compact="true" :betterShadow="betterShadow" :user="notification.from_profile"/>
     </a>
     <div class='notification-right'>
       <UserCard :user="getUser(notification)" :rounded="true" :bordered="true" v-if="userExpanded" />
diff --git a/src/components/status/status.js b/src/components/status/status.js
index f10eb2e4..ff8cbe18 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -263,13 +263,13 @@ const Status = {
       }
       return this.status.summary_html + '<br />' + this.status.statusnet_html
     },
-    combinedFavsAndRepeatsAvatars () {
+    combinedFavsAndRepeatsUsers () {
       // Use the status from the global status repository since favs and repeats are saved in it
-      const combinedAvatars = [].concat(
+      const combinedUsers = [].concat(
         this.statusFromGlobalRepository.favoritedBy,
         this.statusFromGlobalRepository.rebloggedBy
       )
-      return uniqBy(combinedAvatars, 'id')
+      return uniqBy(combinedUsers, 'id')
     }
   },
   components: {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index a5f7429c..43c3030e 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -13,7 +13,7 @@
     </template>
     <template v-else>
       <div v-if="retweet && !noHeading && !inConversation" :class="[repeaterClass, { highlighted: repeaterStyle }]" :style="[repeaterStyle]" class="media container retweet-info">
-        <UserAvatar class="media-left" v-if="retweet" :betterShadow="betterShadow" :src="statusoid.user.profile_image_url_original"/>
+        <UserAvatar class="media-left" v-if="retweet" :betterShadow="betterShadow" :user="statusoid.user"/>
         <div class="media-body faint">
           <span class="user-name">
             <router-link v-if="retweeterHtml" :to="retweeterProfileLink" v-html="retweeterHtml"/>
@@ -27,7 +27,7 @@
       <div :class="[userClass, { highlighted: userStyle, 'is-retweet': retweet && !inConversation }]" :style="[ userStyle ]" class="media status">
         <div v-if="!noHeading" class="media-left">
           <router-link :to="userProfileLink" @click.stop.prevent.capture.native="toggleUserExpanded">
-            <UserAvatar :compact="compact" :betterShadow="betterShadow" :src="status.user.profile_image_url_original"/>
+            <UserAvatar :compact="compact" :betterShadow="betterShadow" :user="status.user"/>
           </router-link>
         </div>
         <div class="status-body">
@@ -91,8 +91,13 @@
           </div>
 
           <div v-if="showPreview" class="status-preview-container">
-            <status class="status-preview" v-if="preview" :isPreview="true" :statusoid="preview" :compact=true></status>
-            <div class="status-preview status-preview-loading" v-else>
+            <status class="status-preview"
+              v-if="preview"
+              :isPreview="true"
+              :statusoid="preview"
+              :compact=true
+            />
+            <div v-else class="status-preview status-preview-loading">
               <i class="icon-spin4 animate-spin"></i>
             </div>
           </div>
@@ -134,7 +139,7 @@
           </div>
 
           <transition name="fade">
-            <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsAvatars.length > 0 && isFocused">
+            <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsUsers.length > 0 && isFocused">
               <div class="stats">
                 <div class="stat-count" v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0">
                   <a class="stat-title">{{ $t('status.repeats') }}</a>
@@ -145,7 +150,7 @@
                   <div class="stat-number">{{ statusFromGlobalRepository.favoritedBy.length }}</div>
                 </div>
                 <div class="avatar-row">
-                  <AvatarList :avatars='combinedFavsAndRepeatsAvatars'></AvatarList>
+                  <AvatarList :users="combinedFavsAndRepeatsUsers"></AvatarList>
                 </div>
               </div>
             </div>
diff --git a/src/components/user_avatar/user_avatar.js b/src/components/user_avatar/user_avatar.js
index e6fed3b5..a42b9c71 100644
--- a/src/components/user_avatar/user_avatar.js
+++ b/src/components/user_avatar/user_avatar.js
@@ -2,7 +2,7 @@ import StillImage from '../still-image/still-image.vue'
 
 const UserAvatar = {
   props: [
-    'src',
+    'user',
     'betterShadow',
     'compact'
   ],
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index 6bf7123d..e5466fdf 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -1,8 +1,10 @@
 <template>
   <StillImage
     class="avatar"
+    :alt="user.screen_name"
+    :title="user.screen_name"
+    :src="user.profile_image_url_original"
     :class="{ 'avatar-compact': compact, 'better-shadow': betterShadow }"
-    :src="imgSrc"
     :imageLoadError="imageLoadError"
   />
 </template>
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index e1d3ff57..e62b384d 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -4,7 +4,7 @@
     <div class='user-info'>
       <div class='container'>
         <router-link :to="userProfileLink(user)">
-          <UserAvatar :betterShadow="betterShadow" :src="user.profile_image_url_original"/>
+          <UserAvatar :betterShadow="betterShadow" :user="user"/>
         </router-link>
         <div class="name-and-screen-name">
           <div class="top-line">
diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js
index e706e7d9..309aa1e8 100644
--- a/src/services/entity_normalizer/entity_normalizer.service.js
+++ b/src/services/entity_normalizer/entity_normalizer.service.js
@@ -275,6 +275,9 @@ export const parseStatus = (data) => {
     output.retweeted_status = parseStatus(retweetedStatus)
   }
 
+  output.favoritedBy = []
+  output.rebloggedBy = []
+
   return output
 }
 
-- 
cgit v1.2.3-70-g09d2


From 9a9d66dca18fa270a28905fcb0a89ad8a649f925 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Tue, 7 May 2019 15:54:49 -0400
Subject: reduce needless calculation

---
 src/components/status/status.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 43c3030e..02715253 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -139,7 +139,7 @@
           </div>
 
           <transition name="fade">
-            <div class="favs-repeated-users" v-if="combinedFavsAndRepeatsUsers.length > 0 && isFocused">
+            <div class="favs-repeated-users" v-if="isFocused && combinedFavsAndRepeatsUsers.length > 0">
               <div class="stats">
                 <div class="stat-count" v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0">
                   <a class="stat-title">{{ $t('status.repeats') }}</a>
-- 
cgit v1.2.3-70-g09d2


From addeb852200688170654d9bd687de75bc5d30a85 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 13 May 2019 21:54:25 +0300
Subject: fix prod build

---
 .eslintrc.js                                       |  1 +
 build/webpack.prod.conf.js                         |  8 ++++--
 src/components/login_form/login_form.vue           | 29 ++++++++++++++++++++--
 .../post_status_form/post_status_form.vue          |  2 +-
 src/components/status/status.vue                   |  2 +-
 5 files changed, 36 insertions(+), 6 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/.eslintrc.js b/.eslintrc.js
index 8c95cfb9..b526df67 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -27,6 +27,7 @@ module.exports = {
     'vue/use-v-on-exact': 1,
     'vue/no-parsing-error': 1,
     'vue/require-v-for-key': 1,
+    'vue/valid-v-for': 1,
     'vue/require-prop-types': 1,
     'vue/no-use-v-if-with-v-for': 1,
     'indent': 1,
diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js
index 85ea1bee..e7d25bfe 100644
--- a/build/webpack.prod.conf.js
+++ b/build/webpack.prod.conf.js
@@ -17,17 +17,21 @@ let commitHash = require('child_process')
 console.log(commitHash)
 
 var webpackConfig = merge(baseWebpackConfig, {
+  mode: 'production',
   module: {
     rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, extract: true })
   },
   devtool: config.build.productionSourceMap ? '#source-map' : false,
   optimization: {
-    minimize: true
+    minimize: true,
+    splitChunks: {
+      chunks: 'all'
+    }
   },
   output: {
     path: config.build.assetsRoot,
     filename: utils.assetsPath('js/[name].[chunkhash].js'),
-    chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
+    chunkFilename: utils.assetsPath('js/[name].[chunkhash].js')
   },
   plugins: [
     // http://vuejs.github.io/vue-loader/workflow/production.html
diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue
index 27a8e48a..c6be2e00 100644
--- a/src/components/login_form/login_form.vue
+++ b/src/components/login_form/login_form.vue
@@ -50,6 +50,10 @@
 @import '../../_variables.scss';
 
 .login-form {
+  display: flex;
+  flex-direction: column;
+  padding: 0.6em;
+
   .btn {
     min-height: 28px;
     width: 10em;
@@ -66,9 +70,30 @@
     align-items: center;
     justify-content: space-between;
   }
-}
 
-.login {
+  .form-group {
+    display: flex;
+    flex-direction: column;
+    padding: 0.3em 0.5em 0.6em;
+    line-height:24px;
+  }
+
+  .form-bottom {
+    display: flex;
+    padding: 0.5em;
+    height: 32px;
+
+    button {
+      width: 10em;
+    }
+
+    p {
+      margin: 0.35em;
+      padding: 0.35em;
+      display: flex;
+    }
+  }
+
   .error {
     text-align: center;
 
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index b8b93936..4f014cc5 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -155,7 +155,7 @@
   }
 }
 
-.post-status-form, .login {
+.post-status-form {
   .form-bottom {
     display: flex;
     padding: 0.5em;
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 02715253..490e167b 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -627,7 +627,7 @@ a.unmute {
   flex: 1;
 }
 
-.timeline > {
+.timeline :not(.panel-disabled) > {
   .status-el:last-child {
     border-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;
     border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
-- 
cgit v1.2.3-70-g09d2


From 04fa2aefb3a7c21c64fd0be25237bf266b6444df Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 14 May 2019 19:49:03 +0300
Subject: get rid of reply-left, we decided it should go long time ago

---
 src/components/status/status.vue | 6 ------
 1 file changed, 6 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 490e167b..e8c1a874 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -168,7 +168,6 @@
         </div>
       </div>
       <div class="container" v-if="replying">
-        <div class="reply-left"/>
         <post-status-form class="reply-body" :reply-to="status.id" :attentions="status.attentions" :repliedUser="status.user" :copy-message-scope="status.visibility" :subject="replySubject" v-on:posted="toggleReplying"/>
       </div>
     </template>
@@ -618,11 +617,6 @@ a.unmute {
   margin-left: auto;
 }
 
-.reply-left {
-  flex: 0;
-  min-width: 48px;
-}
-
 .reply-body {
   flex: 1;
 }
-- 
cgit v1.2.3-70-g09d2


From 731ad0a48b1dbb701e72094bf25f0606cda999b7 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Tue, 14 May 2019 22:44:56 -0400
Subject: show reply button and count when logged out as well

---
 src/components/status/status.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 02715253..230b076f 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -157,8 +157,9 @@
           </transition>
 
           <div v-if="!noHeading && !isPreview" class='status-actions media-body'>
-            <div v-if="loggedIn">
-              <i class="button-icon icon-reply" v-on:click.prevent="toggleReplying" :title="$t('tool_tip.reply')" :class="{'icon-reply-active': replying}"></i>
+            <div>
+              <i class="button-icon icon-reply" v-on:click.prevent="toggleReplying" :title="$t('tool_tip.reply')" :class="{'button-icon-active': replying}" v-if="loggedIn"/>
+              <i class="button-icon button-icon-disabled icon-reply" :title="$t('tool_tip.reply')" v-else />
               <span v-if="status.replies_count > 0">{{status.replies_count}}</span>
             </div>
             <retweet-button :visibility='status.visibility' :loggedIn='loggedIn' :status='status'></retweet-button>
-- 
cgit v1.2.3-70-g09d2


From 5e0235fa63cc06196365c9a662b73cff5e3b6b3e Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Tue, 14 May 2019 22:45:57 -0400
Subject: make reply icon not hoverable if disabled

---
 src/components/status/status.vue | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 230b076f..21077972 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -571,15 +571,13 @@ $status-margin: 0.75em;
   }
 }
 
-.icon-reply:hover {
-  color: $fallback--cBlue;
-  color: var(--cBlue, $fallback--cBlue);
-  cursor: pointer;
-}
-
-.icon-reply.icon-reply-active {
-  color: $fallback--cBlue;
-  color: var(--cBlue, $fallback--cBlue);
+.button-icon.icon-reply {
+  &:not(.button-icon-disabled):hover,
+  &.button-icon-active {
+    color: $fallback--cBlue;
+    color: var(--cBlue, $fallback--cBlue);
+    cursor: pointer;
+  }
 }
 
 .status:hover .animated.avatar {
-- 
cgit v1.2.3-70-g09d2


From 1aa0e8d7e026267aa2af82fbd18cf7521ad842e9 Mon Sep 17 00:00:00 2001
From: dave <starpumadev@gmail.com>
Date: Thu, 4 Apr 2019 12:47:25 -0400
Subject: #468 - pin/unpin status

---
 src/components/status/status.js                    | 10 ++++++++++
 src/components/status/status.vue                   | 22 ++++++++++++++++------
 src/modules/statuses.js                            |  7 +++++++
 .../entity_normalizer/entity_normalizer.service.js |  1 +
 4 files changed, 34 insertions(+), 6 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.js b/src/components/status/status.js
index c01cfe79..c52e026a 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -353,6 +353,16 @@ const Status = {
         this.expandingSubject = true
       }
     },
+    pinStatus () {
+      this.$store.state.api.backendInteractor.pinOwnStatus(this.status.id).then((status) => {
+        this.$store.dispatch('updatePinned', status)
+      })
+    },
+    unpinStatus () {
+      this.$store.state.api.backendInteractor.unpinOwnStatus(this.status.id).then((status) => {
+        this.$store.dispatch('updatePinned', status)
+      })
+    },
     replyEnter (id, event) {
       this.showPreview = true
       const targetId = id
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 21077972..0a2562c0 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -52,12 +52,18 @@
                 <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>
-                <template v-if="expandable && !isPreview">
-                  <a href="#" @click.prevent="toggleExpanded" title="Expand">
-                    <i class="button-icon icon-plus-squared"></i>
-                  </a>
-                </template>
-                <a href="#" @click.prevent="toggleMute" v-if="unmuted"><i class="button-icon icon-eye-off"></i></a>
+                <div class="button-icon button-action-icon" v-if="!status.pinned" @click.prevent="pinStatus" title="Pin">
+                  <i class="fa icon-pin"></i>
+                </div>
+                <div class="button-icon button-action-icon" v-else @click.prevent="unpinStatus" title="Unpin">
+                  <i class="fa icon-cancel"></i>
+                </div>
+                <div class="button-icon button-action-icon" v-if="expandable && !isPreview" @click.prevent="toggleExpanded" title="Expand">
+                  <i class="button-icon icon-plus-squared"></i>
+                </div>
+                <div class="button-icon button-action-icon" v-if="unmuted" @click.prevent="toggleMute" title="Toggle Mute">
+                  <i class="button-icon icon-eye-off"></i>
+                </div>
               </span>
             </div>
 
@@ -678,6 +684,10 @@ a.unmute {
   }
 }
 
+.button-action-icon {
+  cursor: pointer;
+}
+
 @media all and (max-width: 800px) {
   .status-el {
     .retweet-info {
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 4c92d4e1..176e5f42 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -424,6 +424,10 @@ export const mutations = {
       newStatus.favoritedBy.push(user)
     }
   },
+  setPinned (state, { status }) {
+    const newStatus = state.allStatusesObject[status.id]
+    newStatus.pinned = status.pinned
+  },
   setRetweeted (state, { status, value }) {
     const newStatus = state.allStatusesObject[status.id]
 
@@ -533,6 +537,9 @@ const statuses = {
       rootState.api.backendInteractor.unfavorite(status.id)
         .then(status => commit('setFavoritedConfirm', { status, user: rootState.users.currentUser }))
     },
+    updatePinned ({ rootState, commit }, status) {
+      commit('setPinned', { status })
+    },
     retweet ({ rootState, commit }, status) {
       // Optimistic retweeting...
       commit('setRetweeted', { status, value: true })
diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js
index 7a8708d5..97e20b99 100644
--- a/src/services/entity_normalizer/entity_normalizer.service.js
+++ b/src/services/entity_normalizer/entity_normalizer.service.js
@@ -211,6 +211,7 @@ export const parseStatus = (data) => {
 
     output.summary_html = addEmojis(data.spoiler_text, data.emojis)
     output.external_url = data.url
+    output.pinned = data.pinned
   } else {
     output.favorited = data.favorited
     output.fave_num = data.fave_num
-- 
cgit v1.2.3-70-g09d2


From e28b19645aa6a546f8d1980fa479f20d3c48ff36 Mon Sep 17 00:00:00 2001
From: dave <starpumadev@gmail.com>
Date: Thu, 4 Apr 2019 12:56:13 -0400
Subject: #468 - show pin for own statuses only

---
 src/components/status/status.js  | 3 +++
 src/components/status/status.vue | 4 ++--
 2 files changed, 5 insertions(+), 2 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.js b/src/components/status/status.js
index c52e026a..a3596b69 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -269,6 +269,9 @@ const Status = {
         this.statusFromGlobalRepository.rebloggedBy
       )
       return uniqBy(combinedUsers, 'id')
+    },
+    ownStatus () {
+      return this.status.user.id === this.$store.state.users.currentUser.id
     }
   },
   components: {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 0a2562c0..0443e758 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -52,10 +52,10 @@
                 <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>
-                <div class="button-icon button-action-icon" v-if="!status.pinned" @click.prevent="pinStatus" title="Pin">
+                <div class="button-icon button-action-icon" v-if="!status.pinned && ownStatus" @click.prevent="pinStatus" title="Pin">
                   <i class="fa icon-pin"></i>
                 </div>
-                <div class="button-icon button-action-icon" v-else @click.prevent="unpinStatus" title="Unpin">
+                <div class="button-icon button-action-icon" v-if="status.pinned && ownStatus" @click.prevent="unpinStatus" title="Unpin">
                   <i class="fa icon-cancel"></i>
                 </div>
                 <div class="button-icon button-action-icon" v-if="expandable && !isPreview" @click.prevent="toggleExpanded" title="Expand">
-- 
cgit v1.2.3-70-g09d2


From 2c89d49a3d22ed2813a6a57fb6049341fa8624ba Mon Sep 17 00:00:00 2001
From: dave <starpumadev@gmail.com>
Date: Thu, 4 Apr 2019 15:10:34 -0400
Subject: #468 - show pinned timeline and add pinned label to the status

---
 src/components/conversation/conversation.js        |  3 ++-
 src/components/conversation/conversation.vue       |  1 +
 src/components/status/status.js                    |  3 ++-
 src/components/status/status.vue                   | 17 ++++++++++---
 src/components/timeline/timeline.js                |  3 ++-
 src/components/timeline/timeline.vue               |  3 ++-
 src/components/user_profile/user_profile.js        |  5 ++++
 src/components/user_profile/user_profile.vue       | 29 ++++++++++++++--------
 src/modules/statuses.js                            |  3 ++-
 src/services/api/api.service.js                    | 14 +++++++++++
 .../timeline_fetcher/timeline_fetcher.service.js   |  6 +++++
 11 files changed, 69 insertions(+), 18 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index ffeb7244..fc239ee9 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -41,7 +41,8 @@ const conversation = {
   props: [
     'statusoid',
     'collapsable',
-    'isPage'
+    'isPage',
+    'pinned'
   ],
   created () {
     if (this.isPage) {
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index d04ff722..40011113 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -13,6 +13,7 @@
       :key="status.id"
       :inlineExpanded="collapsable && isExpanded"
       :statusoid="status"
+      :pinned="pinned"
       :expandable='!isExpanded'
       :focused="focused(status.id)"
       :inConversation="isExpanded"
diff --git a/src/components/status/status.js b/src/components/status/status.js
index a3596b69..f2881742 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -26,7 +26,8 @@ const Status = {
     'replies',
     'isPreview',
     'noHeading',
-    'inlineExpanded'
+    'inlineExpanded',
+    'pinned'
   ],
   data () {
     return {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 0443e758..a5614f59 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -12,6 +12,13 @@
       </div>
     </template>
     <template v-else>
+      <div v-if="pinned" class="status-pin">
+        <i class="fa icon-pin faint"></i>
+        <span class="faint">Pinned</span>
+        <div class="button-icon button-action-icon" v-if="status.pinned && ownStatus" @click.prevent="unpinStatus" title="Unpin">
+          <i class="fa icon-cancel"></i>
+        </div>
+      </div>
       <div v-if="retweet && !noHeading && !inConversation" :class="[repeaterClass, { highlighted: repeaterStyle }]" :style="[repeaterStyle]" class="media container retweet-info">
         <UserAvatar class="media-left" v-if="retweet" :betterShadow="betterShadow" :user="statusoid.user"/>
         <div class="media-body faint">
@@ -55,9 +62,6 @@
                 <div class="button-icon button-action-icon" v-if="!status.pinned && ownStatus" @click.prevent="pinStatus" title="Pin">
                   <i class="fa icon-pin"></i>
                 </div>
-                <div class="button-icon button-action-icon" v-if="status.pinned && ownStatus" @click.prevent="unpinStatus" title="Unpin">
-                  <i class="fa icon-cancel"></i>
-                </div>
                 <div class="button-icon button-action-icon" v-if="expandable && !isPreview" @click.prevent="toggleExpanded" title="Expand">
                   <i class="button-icon icon-plus-squared"></i>
                 </div>
@@ -205,6 +209,13 @@ $status-margin: 0.75em;
   max-width: 100%;
 }
 
+.status-pin {
+  padding: 0.75em 0.75em 0;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+
 .status-preview {
   position: absolute;
   max-width: 95%;
diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index 19d9a9ac..953b4a06 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -11,7 +11,8 @@ const Timeline = {
     'userId',
     'tag',
     'embedded',
-    'count'
+    'count',
+    'noLoadMore'
   ],
   data () {
     return {
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index e6a8d458..870fe4f5 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -21,11 +21,12 @@
           class="status-fadein"
           :key="status.id"
           :statusoid="status"
+          :pinned="timelineName === 'pinned'"
           :collapsable="true"
         />
       </div>
     </div>
-    <div :class="classes.footer">
+    <div :class="classes.footer" v-if="!noLoadMore">
       <div v-if="count===0" class="new-status-notification text-center panel-footer faint">
         {{$t('timeline.no_statuses')}}
       </div>
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index 4eddb8b1..71a88dcf 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -40,6 +40,9 @@ const UserProfile = {
     timeline () {
       return this.$store.state.statuses.timelines.user
     },
+    pinned () {
+      return this.$store.state.statuses.timelines.pinned
+    },
     favorites () {
       return this.$store.state.statuses.timelines.favorites
     },
@@ -91,6 +94,7 @@ const UserProfile = {
     fetchTimelines () {
       const userId = this.userId
       this.$store.dispatch('startFetchingTimeline', { timeline: 'user', userId })
+      this.$store.dispatch('startFetchingTimeline', { timeline: 'pinned', userId })
       this.$store.dispatch('startFetchingTimeline', { timeline: 'media', userId })
       if (this.isUs) {
         this.$store.dispatch('startFetchingTimeline', { timeline: 'favorites', userId })
@@ -98,6 +102,7 @@ const UserProfile = {
     },
     cleanUp () {
       this.$store.dispatch('stopFetching', 'user')
+      this.$store.dispatch('stopFetching', 'pinned')
       this.$store.dispatch('stopFetching', 'favorites')
       this.$store.dispatch('stopFetching', 'media')
       this.$store.commit('clearTimeline', { timeline: 'user' })
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 71c625b7..caf297c6 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -3,16 +3,25 @@
   <div v-if="user" class="user-profile panel panel-default">
     <UserCard :user="user" :switcher="true" :selected="timeline.viewing" rounded="top"/>
     <tab-switcher :renderOnlyFocused="true" ref="tabSwitcher">
-      <Timeline
-        :label="$t('user_card.statuses')"
-        :disabled="!user.statuses_count"
-        :count="user.statuses_count"
-        :embedded="true"
-        :title="$t('user_profile.timeline_title')"
-        :timeline="timeline"
-        :timeline-name="'user'"
-        :user-id="userId"
-      />
+      <div :label="$t('user_card.statuses')" :disabled="!user.statuses_count">
+        <Timeline
+          :count="user.statuses_count"
+          :embedded="true"
+          :title="$t('user_profile.timeline_title')"
+          :timeline="pinned"
+          :timeline-name="'pinned'"
+          :user-id="userId"
+          :no-load-more="true"
+        />
+        <Timeline
+          :count="user.statuses_count"
+          :embedded="true"
+          :title="$t('user_profile.timeline_title')"
+          :timeline="timeline"
+          :timeline-name="'user'"
+          :user-id="userId"
+        />
+      </div>
       <div :label="$t('user_card.followees')" v-if="followsTabVisible" :disabled="!user.friends_count">
         <FriendList :userId="userId">
           <template slot="item" slot-scope="{item}">
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 176e5f42..94d7f30b 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -47,7 +47,8 @@ export const defaultState = () => ({
     publicAndExternal: emptyTl(),
     friends: emptyTl(),
     tag: emptyTl(),
-    dms: emptyTl()
+    dms: emptyTl(),
+    pinned: emptyTl()
   }
 })
 
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
index 65cebe78..03137d20 100644
--- a/src/services/api/api.service.js
+++ b/src/services/api/api.service.js
@@ -506,6 +506,19 @@ const fetchTimeline = ({timeline, credentials, since = false, until = false, use
     .then((data) => data.map(isNotifications ? parseNotification : parseStatus))
 }
 
+const fetchPinnedStatuses = ({ id, credentials }) => {
+  const url = MASTODON_USER_TIMELINE_URL(id) + '?pinned=true'
+  return fetch(url, { headers: authHeaders(credentials) })
+    .then((data) => {
+      if (data.ok) {
+        return data
+      }
+      throw new Error('Error fetching pinned timeline', data)
+    })
+    .then((data) => data.json())
+    .then((data) => data.map(parseStatus))
+}
+
 const verifyCredentials = (user) => {
   return fetch(LOGIN_URL, {
     method: 'POST',
@@ -726,6 +739,7 @@ const reportUser = ({credentials, userId, statusIds, comment, forward}) => {
 const apiService = {
   verifyCredentials,
   fetchTimeline,
+  fetchPinnedStatuses,
   fetchConversation,
   fetchStatus,
   fetchFriends,
diff --git a/src/services/timeline_fetcher/timeline_fetcher.service.js b/src/services/timeline_fetcher/timeline_fetcher.service.js
index 8e954cdf..e8d9a2ed 100644
--- a/src/services/timeline_fetcher/timeline_fetcher.service.js
+++ b/src/services/timeline_fetcher/timeline_fetcher.service.js
@@ -16,6 +16,12 @@ const update = ({store, statuses, timeline, showImmediately, userId}) => {
 }
 
 const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false, userId = false, tag = false, until}) => {
+  if (timeline === 'pinned') {
+    return apiService.fetchPinnedStatuses({ id: userId, credentials })
+      .then(statuses => {
+        update({ store, statuses, timeline, showImmediately, userId })
+      })
+  }
   const args = { timeline, credentials }
   const rootState = store.rootState || store.state
   const timelineData = rootState.statuses.timelines[camelCase(timeline)]
-- 
cgit v1.2.3-70-g09d2


From df207593e9ff4826adf0cf25d01b1471b2e0834c Mon Sep 17 00:00:00 2001
From: dave <starpumadev@gmail.com>
Date: Sun, 7 Apr 2019 11:30:14 -0400
Subject: #468 - update pinned status after actions(remove, add)

---
 src/components/status/status.vue |  2 +-
 src/modules/statuses.js          | 15 +++++++++++++--
 2 files changed, 14 insertions(+), 3 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index a5614f59..ca5e4a1c 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -105,7 +105,7 @@
               v-if="preview"
               :isPreview="true"
               :statusoid="preview"
-              :compact=true
+              :compact="true"
             />
             <div v-else class="status-preview status-preview-loading">
               <i class="icon-spin4 animate-spin"></i>
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index 649cb83c..bbc1a45b 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -171,7 +171,7 @@ const addNewStatuses = (state, { statuses, showImmediately = false, timeline, us
   // This makes sure that user timeline won't get data meant for other
   // user. I.e. opening different user profiles makes request which could
   // return data late after user already viewing different user profile
-  if ((timeline === 'user' || timeline === 'media') && timelineObject.userId !== userId) {
+  if ((timeline === 'user' || timeline === 'media' || timeline === 'pinned') && timelineObject.userId !== userId) {
     return
   }
 
@@ -378,6 +378,7 @@ const removeStatus = (state, { timeline, userId, statusId }) => {
     removed = true
     delete timelineObject.statusesObject[statusId]
     delete timelineObject.visibleStatusesObject[statusId]
+    sortTimeline(timelineObject)
   }
 
   if (removed) {
@@ -551,7 +552,17 @@ const statuses = {
     },
     updatePinned ({ rootState, commit }, status) {
       commit('setPinned', { status })
-      if (!status.pinned) {
+      if (status.pinned) {
+        const statusObj = rootState.statuses.allStatusesObject[status.id]
+        const user = rootState.users.currentUser
+        commit('addNewStatuses', {
+          statuses: [statusObj],
+          showImmediately: true,
+          timeline: 'pinned',
+          user,
+          userId: user.id
+        })
+      } else {
         commit('removeStatus', { timeline: 'pinned', statusId: status.id })
       }
     },
-- 
cgit v1.2.3-70-g09d2


From 5ab0e71500071d3a760f1a67258d10c564b4425e Mon Sep 17 00:00:00 2001
From: dave <starpumadev@gmail.com>
Date: Sun, 7 Apr 2019 11:38:16 -0400
Subject: #468 - show pin status API error

---
 src/components/status/status.js  | 8 +++++++-
 src/components/status/status.vue | 1 +
 2 files changed, 8 insertions(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.js b/src/components/status/status.js
index f2881742..39a1b236 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -38,6 +38,7 @@ const Status = {
       showPreview: false,
       showingTall: this.inConversation && this.focused,
       showingLongSubject: false,
+      error: null,
       expandingSubject: typeof this.$store.state.config.collapseMessageWithSubject === 'undefined'
         ? !this.$store.state.instance.collapseMessageWithSubject
         : !this.$store.state.config.collapseMessageWithSubject,
@@ -359,7 +360,12 @@ const Status = {
     },
     pinStatus () {
       this.$store.state.api.backendInteractor.pinOwnStatus(this.status.id).then((status) => {
-        this.$store.dispatch('updatePinned', status)
+        if (status.error) {
+          this.error = status.error
+          setTimeout(() => this.error = null, 5000)
+        } else {
+          this.$store.dispatch('updatePinned', status)
+        }
       })
     },
     unpinStatus () {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index ca5e4a1c..d55f3d95 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -1,5 +1,6 @@
 <template>
   <div class="status-el" v-if="!hideStatus" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
+    <div v-if="error" class="alert error">{{error}}</div>
     <template v-if="muted && !isPreview">
       <div class="media status container muted">
         <small>
-- 
cgit v1.2.3-70-g09d2


From 006bf1ce63c2f24f89781838ed499ee3829b9933 Mon Sep 17 00:00:00 2001
From: dave <starpumadev@gmail.com>
Date: Fri, 12 Apr 2019 13:53:13 -0400
Subject: #468 - fix plus button size issue, use scss variable properly

---
 src/components/status/status.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index d55f3d95..bc7ff43c 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -64,10 +64,10 @@
                   <i class="fa icon-pin"></i>
                 </div>
                 <div class="button-icon button-action-icon" v-if="expandable && !isPreview" @click.prevent="toggleExpanded" title="Expand">
-                  <i class="button-icon icon-plus-squared"></i>
+                  <i class="icon-plus-squared"></i>
                 </div>
                 <div class="button-icon button-action-icon" v-if="unmuted" @click.prevent="toggleMute" title="Toggle Mute">
-                  <i class="button-icon icon-eye-off"></i>
+                  <i class="icon-eye-off"></i>
                 </div>
               </span>
             </div>
@@ -211,7 +211,7 @@ $status-margin: 0.75em;
 }
 
 .status-pin {
-  padding: 0.75em 0.75em 0;
+  padding: $status-margin $status-margin 0;
   display: flex;
   align-items: center;
   justify-content: flex-end;
-- 
cgit v1.2.3-70-g09d2


From 9fc997500e33d561a1aa5d26c8ed8f4446a0248e Mon Sep 17 00:00:00 2001
From: dave <starpumadev@gmail.com>
Date: Fri, 12 Apr 2019 15:35:29 -0400
Subject: #468 - add extra buttons for status actions

---
 src/components/delete_button/delete_button.js      | 21 ---------
 src/components/delete_button/delete_button.vue     | 21 ---------
 src/components/extra_buttons/extra_buttons.js      | 51 ++++++++++++++++++++++
 src/components/extra_buttons/extra_buttons.vue     | 46 +++++++++++++++++++
 .../moderation_tools/moderation_tools.vue          |  8 ++++
 src/components/status/status.js                    | 27 ++++--------
 src/components/status/status.vue                   |  8 +---
 src/i18n/en.json                                   |  4 ++
 8 files changed, 118 insertions(+), 68 deletions(-)
 delete mode 100644 src/components/delete_button/delete_button.js
 delete mode 100644 src/components/delete_button/delete_button.vue
 create mode 100644 src/components/extra_buttons/extra_buttons.js
 create mode 100644 src/components/extra_buttons/extra_buttons.vue

(limited to 'src/components/status/status.vue')

diff --git a/src/components/delete_button/delete_button.js b/src/components/delete_button/delete_button.js
deleted file mode 100644
index 22f24625..00000000
--- a/src/components/delete_button/delete_button.js
+++ /dev/null
@@ -1,21 +0,0 @@
-const DeleteButton = {
-  props: [ 'status' ],
-  methods: {
-    deleteStatus () {
-      const confirmed = window.confirm('Do you really want to delete this status?')
-      if (confirmed) {
-        this.$store.dispatch('deleteStatus', { id: this.status.id })
-      }
-    }
-  },
-  computed: {
-    currentUser () { return this.$store.state.users.currentUser },
-    canDelete () {
-      if (!this.currentUser) { return }
-      const superuser = this.currentUser.rights.moderator || this.currentUser.rights.admin
-      return superuser || this.status.user.id === this.currentUser.id
-    }
-  }
-}
-
-export default DeleteButton
diff --git a/src/components/delete_button/delete_button.vue b/src/components/delete_button/delete_button.vue
deleted file mode 100644
index f4c91cfd..00000000
--- a/src/components/delete_button/delete_button.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<template>
-  <div v-if="canDelete">
-    <a href="#" v-on:click.prevent="deleteStatus()">
-      <i class='button-icon icon-cancel delete-status'></i>
-    </a>
-  </div>
-</template>
-
-<script src="./delete_button.js" ></script>
-
-<style lang="scss">
-@import '../../_variables.scss';
-
-.icon-cancel,.delete-status {
-  cursor: pointer;
-  &:hover {
-    color: $fallback--cRed;
-    color: var(--cRed, $fallback--cRed);
-  }
-}
-</style>
diff --git a/src/components/extra_buttons/extra_buttons.js b/src/components/extra_buttons/extra_buttons.js
new file mode 100644
index 00000000..40bab2ab
--- /dev/null
+++ b/src/components/extra_buttons/extra_buttons.js
@@ -0,0 +1,51 @@
+import Popper from 'vue-popperjs/src/component/popper.js.vue'
+
+const ExtraButtons = {
+  props: [ 'status' ],
+  components: {
+    Popper
+  },
+  data () {
+    return {
+      showDropDown: false
+    }
+  },
+  methods: {
+    deleteStatus () {
+      const confirmed = window.confirm(this.$t('status.delete_confirm'))
+      if (confirmed) {
+        this.$store.dispatch('deleteStatus', { id: this.status.id })
+      }
+    },
+    toggleMenu () {
+      this.showDropDown = !this.showDropDown
+    },
+    pinStatus () {
+      this.$store.state.api.backendInteractor.pinOwnStatus(this.status.id).then((status) => {
+        if (status.error) {
+          this.$emit('onError', status.error)
+        } else {
+          this.$store.dispatch('updatePinned', status)
+        }
+      })
+    },
+    unpinStatus () {
+      this.$store.state.api.backendInteractor.unpinOwnStatus(this.status.id).then((status) => {
+        this.$store.dispatch('updatePinned', status)
+      })
+    }
+  },
+  computed: {
+    currentUser () { return this.$store.state.users.currentUser },
+    canDelete () {
+      if (!this.currentUser) { return }
+      const superuser = this.currentUser.rights.moderator || this.currentUser.rights.admin
+      return superuser || this.status.user.id === this.currentUser.id
+    },
+    ownStatus () {
+      return this.status.user.id === this.currentUser.id
+    }
+  }
+}
+
+export default ExtraButtons
diff --git a/src/components/extra_buttons/extra_buttons.vue b/src/components/extra_buttons/extra_buttons.vue
new file mode 100644
index 00000000..13f8587b
--- /dev/null
+++ b/src/components/extra_buttons/extra_buttons.vue
@@ -0,0 +1,46 @@
+<template>
+  <Popper
+    trigger="click"
+    @hide='showDropDown = false'
+    append-to-body
+    :options="{
+      placement: 'top',
+      modifiers: {
+        arrow: { enabled: true },
+        offset: { offset: '0, 5px' },
+      }
+    }"
+  >
+    <div class="popper-wrapper">
+      <div class="dropdown-menu"> 
+        <button class="dropdown-item dropdown-item-icon" @click.prevent="pinStatus" v-if="!status.pinned && ownStatus">
+          <i class="icon-pin"></i><span>{{$t("status.pin")}}</span>
+        </button>
+        <button class="dropdown-item dropdown-item-icon" @click.prevent="unpinStatus" v-if="status.pinned && ownStatus">
+          <i class="icon-pin"></i><span>{{$t("status.unpin")}}</span>
+        </button>
+        <button class="dropdown-item dropdown-item-icon" @click.prevent="deleteStatus" v-if="canDelete">
+          <i class="icon-cancel"></i><span>{{$t("status.delete")}}</span>
+        </button>
+      </div>
+    </div>
+    <div class="button-icon" slot="reference" @click="toggleMenu">
+      <i class='icon-ellipsis' :class="{'icon-clicked': showDropDown}"></i>
+    </div>
+  </Popper>
+</template>
+
+<script src="./extra_buttons.js" ></script>
+
+<style lang="scss">
+@import '../../_variables.scss';
+
+.icon-ellipsis {
+  cursor: pointer;
+
+  &:hover, &.icon-clicked {
+    color: $fallback--cBlue;
+    color: var(--cBlue, $fallback--cBlue);
+  }
+}
+</style>
diff --git a/src/components/moderation_tools/moderation_tools.vue b/src/components/moderation_tools/moderation_tools.vue
index c24a2280..c9e3fc78 100644
--- a/src/components/moderation_tools/moderation_tools.vue
+++ b/src/components/moderation_tools/moderation_tools.vue
@@ -127,6 +127,14 @@
     width: 100%;
     height: 100%;
 
+    &-icon {
+      padding-left: 0.5rem;
+
+      i {
+        margin-right: 0.25rem;
+      }
+    }
+
     &:hover {
       // TODO: improve the look on breeze themes
       background-color: $fallback--fg;
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 85159fc4..fa4b426c 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -1,7 +1,7 @@
 import Attachment from '../attachment/attachment.vue'
 import FavoriteButton from '../favorite_button/favorite_button.vue'
 import RetweetButton from '../retweet_button/retweet_button.vue'
-import DeleteButton from '../delete_button/delete_button.vue'
+import ExtraButtons from '../extra_buttons/extra_buttons.vue'
 import PostStatusForm from '../post_status_form/post_status_form.vue'
 import UserCard from '../user_card/user_card.vue'
 import UserAvatar from '../user_avatar/user_avatar.vue'
@@ -280,7 +280,7 @@ const Status = {
     Attachment,
     FavoriteButton,
     RetweetButton,
-    DeleteButton,
+    ExtraButtons,
     PostStatusForm,
     UserCard,
     UserAvatar,
@@ -301,6 +301,12 @@ const Status = {
           return 'icon-globe'
       }
     },
+    showError (error) {
+      this.error = error
+      setTimeout(() => {
+        this.error = null
+      }, 5000)
+    },
     linkClicked (event) {
       let { target } = event
       if (target.tagName === 'SPAN') {
@@ -358,23 +364,6 @@ const Status = {
         this.expandingSubject = true
       }
     },
-    pinStatus () {
-      this.$store.state.api.backendInteractor.pinOwnStatus(this.status.id).then((status) => {
-        if (status.error) {
-          this.error = status.error
-          setTimeout(() => {
-            this.error = null
-          }, 5000)
-        } else {
-          this.$store.dispatch('updatePinned', status)
-        }
-      })
-    },
-    unpinStatus () {
-      this.$store.state.api.backendInteractor.unpinOwnStatus(this.status.id).then((status) => {
-        this.$store.dispatch('updatePinned', status)
-      })
-    },
     replyEnter (id, event) {
       this.showPreview = true
       const targetId = id
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index bc7ff43c..1644f6b0 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -16,9 +16,6 @@
       <div v-if="pinned" class="status-pin">
         <i class="fa icon-pin faint"></i>
         <span class="faint">Pinned</span>
-        <div class="button-icon button-action-icon" v-if="status.pinned && ownStatus" @click.prevent="unpinStatus" title="Unpin">
-          <i class="fa icon-cancel"></i>
-        </div>
       </div>
       <div v-if="retweet && !noHeading && !inConversation" :class="[repeaterClass, { highlighted: repeaterStyle }]" :style="[repeaterStyle]" class="media container retweet-info">
         <UserAvatar class="media-left" v-if="retweet" :betterShadow="betterShadow" :user="statusoid.user"/>
@@ -60,9 +57,6 @@
                 <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>
-                <div class="button-icon button-action-icon" v-if="!status.pinned && ownStatus" @click.prevent="pinStatus" title="Pin">
-                  <i class="fa icon-pin"></i>
-                </div>
                 <div class="button-icon button-action-icon" v-if="expandable && !isPreview" @click.prevent="toggleExpanded" title="Expand">
                   <i class="icon-plus-squared"></i>
                 </div>
@@ -175,7 +169,7 @@
             </div>
             <retweet-button :visibility='status.visibility' :loggedIn='loggedIn' :status='status'></retweet-button>
             <favorite-button :loggedIn='loggedIn' :status='status'></favorite-button>
-            <delete-button :status='status'></delete-button>
+            <extra-buttons :status="status" @onError="showError"></extra-buttons>
           </div>
         </div>
       </div>
diff --git a/src/i18n/en.json b/src/i18n/en.json
index b4f0deb2..8429367c 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -402,6 +402,10 @@
   "status": {
     "favorites": "Favorites",
     "repeats": "Repeats",
+    "delete": "Delete status",
+    "pin": "Pin on profile",
+    "unpin": "Unpin form profile",
+    "delete_confirm": "Do you really want to delete this status?",
     "reply_to": "Reply to",
     "replies_list": "Replies:"
   },
-- 
cgit v1.2.3-70-g09d2


From 32be0e15d11c14513ff4fdc984aeaa4a5f462eac Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 26 Apr 2019 15:46:40 -0400
Subject: use pinned property from status directly

---
 src/components/conversation/conversation.js  | 3 +--
 src/components/conversation/conversation.vue | 1 -
 src/components/status/status.js              | 3 +--
 src/components/status/status.vue             | 2 +-
 src/components/user_profile/user_profile.vue | 1 -
 5 files changed, 3 insertions(+), 7 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index fc239ee9..ffeb7244 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -41,8 +41,7 @@ const conversation = {
   props: [
     'statusoid',
     'collapsable',
-    'isPage',
-    'pinned'
+    'isPage'
   ],
   created () {
     if (this.isPage) {
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 40011113..d04ff722 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -13,7 +13,6 @@
       :key="status.id"
       :inlineExpanded="collapsable && isExpanded"
       :statusoid="status"
-      :pinned="pinned"
       :expandable='!isExpanded'
       :focused="focused(status.id)"
       :inConversation="isExpanded"
diff --git a/src/components/status/status.js b/src/components/status/status.js
index fa4b426c..09a2a010 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -26,8 +26,7 @@ const Status = {
     'replies',
     'isPreview',
     'noHeading',
-    'inlineExpanded',
-    'pinned'
+    'inlineExpanded'
   ],
   data () {
     return {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 1644f6b0..41662576 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -13,7 +13,7 @@
       </div>
     </template>
     <template v-else>
-      <div v-if="pinned" class="status-pin">
+      <div v-if="statusoid.pinned" class="status-pin">
         <i class="fa icon-pin faint"></i>
         <span class="faint">Pinned</span>
       </div>
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 46561e2a..1e104403 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -10,7 +10,6 @@
             class="status-fadein"
             :key="status.id"
             :statusoid="status"
-            :pinned="true"
             :collapsable="true"
           />
         </div>
-- 
cgit v1.2.3-70-g09d2


From beaf51257380ec62d3cfe6a0c876fec24ee61e1a Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 26 Apr 2019 16:08:16 -0400
Subject: add translation

---
 src/components/status/status.vue | 2 +-
 src/i18n/en.json                 | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 41662576..a033074c 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -15,7 +15,7 @@
     <template v-else>
       <div v-if="statusoid.pinned" class="status-pin">
         <i class="fa icon-pin faint"></i>
-        <span class="faint">Pinned</span>
+        <span class="faint">{{$t('status.pinned')}}</span>
       </div>
       <div v-if="retweet && !noHeading && !inConversation" :class="[repeaterClass, { highlighted: repeaterStyle }]" :style="[repeaterStyle]" class="media container retweet-info">
         <UserAvatar class="media-left" v-if="retweet" :betterShadow="betterShadow" :user="statusoid.user"/>
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 9c5789e3..dac0e38d 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -405,6 +405,7 @@
     "delete": "Delete status",
     "pin": "Pin on profile",
     "unpin": "Unpin from profile",
+    "pinned": "Pinned",
     "delete_confirm": "Do you really want to delete this status?",
     "reply_to": "Reply to",
     "replies_list": "Replies:"
-- 
cgit v1.2.3-70-g09d2


From 19e79895bbedf66560fcb13d9d07d38dfc1577e2 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Fri, 26 Apr 2019 16:22:03 -0400
Subject: revert unnecessary changes

---
 src/components/status/status.vue | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index a033074c..77949a52 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -57,12 +57,12 @@
                 <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>
-                <div class="button-icon button-action-icon" v-if="expandable && !isPreview" @click.prevent="toggleExpanded" title="Expand">
-                  <i class="icon-plus-squared"></i>
-                </div>
-                <div class="button-icon button-action-icon" v-if="unmuted" @click.prevent="toggleMute" title="Toggle Mute">
-                  <i class="icon-eye-off"></i>
-                </div>
+                <template v-if="expandable && !isPreview">
+                  <a href="#" @click.prevent="toggleExpanded" title="Expand">
+                    <i class="button-icon icon-plus-squared"></i>
+                  </a>
+                </template>
+                <a href="#" @click.prevent="toggleMute" v-if="unmuted"><i class="button-icon icon-eye-off"></i></a>
               </span>
             </div>
 
@@ -690,10 +690,6 @@ a.unmute {
   }
 }
 
-.button-action-icon {
-  cursor: pointer;
-}
-
 @media all and (max-width: 800px) {
   .status-el {
     .retweet-info {
-- 
cgit v1.2.3-70-g09d2


From 2af088969a26f8a3063336cc3885c10441087e81 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Sat, 27 Apr 2019 09:36:10 -0400
Subject: improve error handling logic

---
 src/components/extra_buttons/extra_buttons.js | 3 +++
 src/components/status/status.js               | 6 +++---
 src/components/status/status.vue              | 7 +++++--
 3 files changed, 11 insertions(+), 5 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/extra_buttons/extra_buttons.js b/src/components/extra_buttons/extra_buttons.js
index 51892d0d..f70ecd1d 100644
--- a/src/components/extra_buttons/extra_buttons.js
+++ b/src/components/extra_buttons/extra_buttons.js
@@ -25,11 +25,14 @@ const ExtraButtons = {
     pinStatus () {
       this.refreshPopper()
       this.$store.dispatch('pinStatus', this.status.id)
+        .then(() => this.$emit('onSuccess'))
         .catch(err => this.$emit('onError', err.error.error))
     },
     unpinStatus () {
       this.refreshPopper()
       this.$store.dispatch('unpinStatus', this.status.id)
+        .then(() => this.$emit('onSuccess'))
+        .catch(err => this.$emit('onError', err.error.error))
     },
     refreshPopper () {
       this.showPopper = false
diff --git a/src/components/status/status.js b/src/components/status/status.js
index 09a2a010..a1ffb026 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -302,9 +302,9 @@ const Status = {
     },
     showError (error) {
       this.error = error
-      setTimeout(() => {
-        this.error = null
-      }, 5000)
+    },
+    clearError () {
+      this.error = undefined
     },
     linkClicked (event) {
       let { target } = event
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 77949a52..8575a95e 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -1,6 +1,9 @@
 <template>
   <div class="status-el" v-if="!hideStatus" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
-    <div v-if="error" class="alert error">{{error}}</div>
+    <div v-if="error" class="alert error">
+      {{error}}
+      <i class="button-icon icon-cancel" @click="clearError"></i>
+    </div>
     <template v-if="muted && !isPreview">
       <div class="media status container muted">
         <small>
@@ -169,7 +172,7 @@
             </div>
             <retweet-button :visibility='status.visibility' :loggedIn='loggedIn' :status='status'></retweet-button>
             <favorite-button :loggedIn='loggedIn' :status='status'></favorite-button>
-            <extra-buttons :status="status" @onError="showError"></extra-buttons>
+            <extra-buttons :status="status" @onError="showError" @onSuccess="clearError"></extra-buttons>
           </div>
         </div>
       </div>
-- 
cgit v1.2.3-70-g09d2


From f68653d0dd0b374aa28eca35b424b6c834c701d6 Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Tue, 30 Apr 2019 11:06:22 -0400
Subject: show pinned state only in the user timeline

---
 src/components/conversation/conversation.js  | 3 ++-
 src/components/conversation/conversation.vue | 1 +
 src/components/status/status.js              | 3 ++-
 src/components/status/status.vue             | 2 +-
 src/components/user_profile/user_profile.vue | 1 +
 5 files changed, 7 insertions(+), 3 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index ffeb7244..b3074590 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -41,7 +41,8 @@ const conversation = {
   props: [
     'statusoid',
     'collapsable',
-    'isPage'
+    'isPage',
+    'showPinned'
   ],
   created () {
     if (this.isPage) {
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index d04ff722..0b4998c3 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -14,6 +14,7 @@
       :inlineExpanded="collapsable && isExpanded"
       :statusoid="status"
       :expandable='!isExpanded'
+      :showPinned="showPinned"
       :focused="focused(status.id)"
       :inConversation="isExpanded"
       :highlight="getHighlight()"
diff --git a/src/components/status/status.js b/src/components/status/status.js
index a1ffb026..5b3d98c3 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -26,7 +26,8 @@ const Status = {
     'replies',
     'isPreview',
     'noHeading',
-    'inlineExpanded'
+    'inlineExpanded',
+    'showPinned'
   ],
   data () {
     return {
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 8575a95e..997c1b31 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -16,7 +16,7 @@
       </div>
     </template>
     <template v-else>
-      <div v-if="statusoid.pinned" class="status-pin">
+      <div v-if="showPinned && statusoid.pinned" class="status-pin">
         <i class="fa icon-pin faint"></i>
         <span class="faint">{{$t('status.pinned')}}</span>
       </div>
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 36d75b9e..48b774ea 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -12,6 +12,7 @@
               :key="statusId"
               :statusoid="timeline.statusesObject[statusId]"
               :collapsable="true"
+              :showPinned="true"
             />
           </template>
         </div>
-- 
cgit v1.2.3-70-g09d2


From 229c65959eb776b7028b51492e3ead03abcfeff1 Mon Sep 17 00:00:00 2001
From: Senko-san <senko-san@iscute.moe>
Date: Mon, 20 May 2019 00:43:35 +0100
Subject: Remove auto-hyphenation

Auto-hyphenation has terrible heuristics on all browsers, disable it.

Source: https://justmarkup.com/articles/2019-01-28-a-look-at-css-hyphenation-in-2019/
---
 src/components/status/status.vue | 1 -
 1 file changed, 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 997c1b31..53dfb9e7 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -257,7 +257,6 @@ $status-margin: 0.75em;
 }
 
 .status-el {
-  hyphens: auto;
   overflow-wrap: break-word;
   word-wrap: break-word;
   word-break: break-word;
-- 
cgit v1.2.3-70-g09d2


From fc9acf8fb660b04641a6c30114dfa5f245de6e8c Mon Sep 17 00:00:00 2001
From: Moonman <shitposterclub@gmail.com>
Date: Mon, 20 May 2019 00:03:50 -0400
Subject: add tags to data and to status component

---
 src/components/status/status.js                             | 7 +++++++
 src/components/status/status.vue                            | 2 +-
 src/services/entity_normalizer/entity_normalizer.service.js | 2 ++
 3 files changed, 10 insertions(+), 1 deletion(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.js b/src/components/status/status.js
index 5b3d98c3..04958eea 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -289,6 +289,13 @@ const Status = {
     AvatarList
   },
   methods: {
+    generateTagAttributes(tags) {
+        let res = {};
+        for (let tag of tags) {
+            res['data-tag-'+tag.name] = tag.name;
+        }
+        return res;
+    },
     visibilityIcon (visibility) {
       switch (visibility) {
         case 'private':
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 997c1b31..24b2520f 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -32,7 +32,7 @@
         </div>
       </div>
 
-      <div :class="[userClass, { highlighted: userStyle, 'is-retweet': retweet && !inConversation }]" :style="[ userStyle ]" class="media status">
+      <div :class="[userClass, { highlighted: userStyle, 'is-retweet': retweet && !inConversation }]" :style="[ userStyle ]" class="media status" v-bind="generateTagAttributes(status.tags)">
         <div v-if="!noHeading" class="media-left">
           <router-link :to="userProfileLink" @click.stop.prevent.capture.native="toggleUserExpanded">
             <UserAvatar :compact="compact" :betterShadow="betterShadow" :user="status.user"/>
diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js
index 8e413584..46ca7602 100644
--- a/src/services/entity_normalizer/entity_normalizer.service.js
+++ b/src/services/entity_normalizer/entity_normalizer.service.js
@@ -192,6 +192,8 @@ export const parseStatus = (data) => {
 
     output.statusnet_html = addEmojis(data.content, data.emojis)
 
+    output.tags = data.tags
+
     if (data.pleroma) {
       const { pleroma } = data
       output.text = pleroma.content ? data.pleroma.content['text/plain'] : data.content
-- 
cgit v1.2.3-70-g09d2


From 0f824ff311bd3b1b8a0126ad9d7a2885440d3762 Mon Sep 17 00:00:00 2001
From: Moonman <shitposterclub@gmail.com>
Date: Mon, 20 May 2019 15:23:36 -0400
Subject: switch from method to computed property

---
 src/components/status/status.js  | 10 +++-------
 src/components/status/status.vue |  2 +-
 2 files changed, 4 insertions(+), 8 deletions(-)

(limited to 'src/components/status/status.vue')

diff --git a/src/components/status/status.js b/src/components/status/status.js
index e2d2bb8b..ea4c2b9d 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -274,6 +274,9 @@ const Status = {
     },
     ownStatus () {
       return this.status.user.id === this.$store.state.users.currentUser.id
+    },
+    tags () {
+      return this.status.tags.filter(tagObj => tagObj.hasOwnProperty('name')).map(tagObj => tagObj.name).join(' ')
     }
   },
   components: {
@@ -289,13 +292,6 @@ const Status = {
     AvatarList
   },
   methods: {
-    generateTagAttributes (tags) {
-      let res = {}
-      for (let tag of tags) {
-        res['data-tag-' + tag.name] = tag.name
-      }
-      return res
-    },
     visibilityIcon (visibility) {
       switch (visibility) {
         case 'private':
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 24b2520f..9a062592 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -32,7 +32,7 @@
         </div>
       </div>
 
-      <div :class="[userClass, { highlighted: userStyle, 'is-retweet': retweet && !inConversation }]" :style="[ userStyle ]" class="media status" v-bind="generateTagAttributes(status.tags)">
+      <div :class="[userClass, { highlighted: userStyle, 'is-retweet': retweet && !inConversation }]" :style="[ userStyle ]" class="media status" :data-tags="tags">
         <div v-if="!noHeading" class="media-left">
           <router-link :to="userProfileLink" @click.stop.prevent.capture.native="toggleUserExpanded">
             <UserAvatar :compact="compact" :betterShadow="betterShadow" :user="status.user"/>
-- 
cgit v1.2.3-70-g09d2

