ui: Change the request user icon resolution (#1178) (#1179)

* ui: Change the request user icon resolution (#1178)

* ui: add Badge Earned text

src/app.js

@@ -16924,7 +16924,15 @@ console.log(`isLinux: ${LINUX}`);
         return false;
     };
 
-    $app.methods.userImage = function (user) {
+    $app.methods.userImage = function (user, isIcon, resolution = '64') {
+        if (isIcon) {
+            return user.userIcon
+                ? `${user.userIcon.replace('/file/', '/image/')}${user.userIcon.endsWith('/') ? '256' : '/' + resolution}`
+                : user.currentAvatarThumbnailImageUrl?.replace(
+                      '256',
+                      resolution
+                  ) || user.profilePicOverrideThumbnail;
+        }
         if (typeof user === 'undefined') {
             return '';
         }

src/components/sidebar/FriendItem.vue

@@ -4,7 +4,7 @@
             <div
                 class="avatar"
                 :class="isFriendActiveOrOffline ? undefined : userStatusClass(friend.ref, friend.pendingOffline)">
-                <img v-lazy="userImage(friend.ref)" />
+                <img v-lazy="userImage(friend.ref, true)" />
             </div>
             <div class="detail">
                 <span v-if="!hideNicknames && friend.$nickName" class="name" :style="{ color: friend.ref.$userColour }">

src/localization/en/en.json

@@ -204,6 +204,9 @@
                 },
                 "instance": {
                     "closed": "Instance Closed"
+                },
+                "badge": {
+                    "earned": "Badge Earned"
                 }
             }
         },

src/mixins/dialogs/userDialog.pug

@@ -195,7 +195,7 @@ mixin userDialog
                         el-popover(placement='right' width='500px' trigger='click')
                             img.x-link(
                                 slot='reference'
-                                :src='userDialog.ref.userIcon'
+                                :src='userImage(userDialog.ref, true, "256")'
                                 style='flex: none; width: 120px; height: 120px; border-radius: 12px; object-fit: cover')
                             img.x-link(
                                 :src='userDialog.ref.userIcon'

src/mixins/tabs/profile.pug

@@ -5,7 +5,7 @@ mixin profileTab
             .x-friend-list(style='margin-top: 10px')
                 .x-friend-item(@click='showUserDialog(API.currentUser.id)')
                     .avatar
-                        img(v-lazy='userImage(API.currentUser)')
+                        img(v-lazy='userImage(API.currentUser, true)')
                     .detail
                         span.name(v-text='API.currentUser.displayName')
                         span.extra(v-text='API.currentUser.username')

src/views/tabs/FriendsList.vue

@@ -117,7 +117,7 @@
                 <el-table-column :label="$t('table.friendList.avatar')" width="70" prop="photo">
                     <template slot-scope="scope">
                         <el-popover placement="right" height="500px" trigger="hover">
-                            <img slot="reference" v-lazy="userImage(scope.row)" class="friends-list-avatar" />
+                            <img slot="reference" v-lazy="userImage(scope.row, true)" class="friends-list-avatar" />
                             <img
                                 v-lazy="userImageFull(scope.row)"
                                 class="friends-list-avatar"