From 6079301ec45c6c13a1f8b5f9f6acf52b5a449331 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Thu, 16 Jul 2020 17:42:16 +0300
Subject: Move user list from reactions to its own component, make favs and rts
 use it

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

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

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index f6b5dd6f..4764f467 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -265,24 +265,30 @@
               class="favs-repeated-users"
             >
               <div class="stats">
-                <div
+                <UserListPopover
                   v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0"
-                  class="stat-count"
+                  :users="statusFromGlobalRepository.rebloggedBy"
                 >
-                  <a class="stat-title">{{ $t('status.repeats') }}</a>
-                  <div class="stat-number">
-                    {{ statusFromGlobalRepository.rebloggedBy.length }}
+                  <div class="stat-count">
+                    <a class="stat-title">{{ $t('status.repeats') }}</a>
+                    <div class="stat-number">
+                      {{ statusFromGlobalRepository.rebloggedBy.length }}
+                    </div>
                   </div>
-                </div>
-                <div
+                </UserListPopover>
+                <UserListPopover
                   v-if="statusFromGlobalRepository.favoritedBy && statusFromGlobalRepository.favoritedBy.length > 0"
-                  class="stat-count"
+                  :users="statusFromGlobalRepository.favoritedBy"
                 >
-                  <a class="stat-title">{{ $t('status.favorites') }}</a>
-                  <div class="stat-number">
-                    {{ statusFromGlobalRepository.favoritedBy.length }}
+                  <div
+                    class="stat-count"
+                  >
+                    <a class="stat-title">{{ $t('status.favorites') }}</a>
+                    <div class="stat-number">
+                      {{ statusFromGlobalRepository.favoritedBy.length }}
+                    </div>
                   </div>
-                </div>
+                </UserListPopover>
                 <div class="avatar-row">
                   <AvatarList :users="combinedFavsAndRepeatsUsers" />
                 </div>
@@ -722,6 +728,11 @@ $status-margin: 0.75em;
 
     .stat-count {
       margin-right: $status-margin;
+      user-select: none;
+
+      &:hover .stat-title {
+        text-decoration: underline;
+      }
 
       .stat-title {
         color: var(--faint, $fallback--faint);
-- 
cgit v1.2.3-70-g09d2