Merge pull request #2849 from h3poteto/iss-2815

refs #2815 Fix username in notifications

src/renderer/components/organisms/Notification/Favourite.vue

@@ -16,8 +16,16 @@
           <icon name="star" scale="0.7"></icon>
         </div>
         <div class="action-detail">
-          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-          >{{ $t('notification.favourite.body') }}
+          <span class="bold" @click="openUser(message.account)">
+            <bdi
+              v-html="
+                $t('notification.favourite.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
+          </span>
         </div>
         <div class="action-icon" role="presentation">
           <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />

src/renderer/components/organisms/Notification/Follow.vue

@@ -15,8 +15,16 @@
           <icon name="user-plus" scale="0.8"></icon>
         </div>
         <div class="action-detail">
-          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-          >{{ $t('notification.follow.body') }}
+          <span class="bold" @click="openUser(message.account)">
+            <bdi
+              v-html="
+                $t('notification.follow.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
+          </span>
         </div>
         <div class="action-icon" role="presentation">
           <FailoverImg :src="message.account.avatar" />

src/renderer/components/organisms/Notification/FollowRequest.vue

@@ -15,9 +15,15 @@
           <icon name="user-plus" scale="0.8"></icon>
         </div>
         <div class="action-detail">
-          {{ $t('notification.follow_request.body') }}
           <span class="bold" @click="openUser(message.account)">
-            <bdi v-html="username(message.account)"></bdi>
+            <bdi
+              v-html="
+                $t('notification.follow_request.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
           </span>
         </div>
         <div class="action-icon" role="presentation">

src/renderer/components/organisms/Notification/PollExpired.vue

@@ -16,8 +16,16 @@
           <icon name="poll-h" scale="0.9"></icon>
         </div>
         <div class="action-detail">
-          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-          >{{ $t('notification.poll_expired.body') }}
+          <span class="bold" @click="openUser(message.account)">
+            <bdi
+              v-html="
+                $t('notification.poll_expired.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
+          </span>
         </div>
         <div class="action-icon" role="presentation">
           <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />

src/renderer/components/organisms/Notification/PollVote.vue

@@ -16,8 +16,16 @@
           <icon name="poll-h" scale="0.9"></icon>
         </div>
         <div class="action-detail">
-          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-          >{{ $t('notification.poll_vote.body') }}
+          <span class="bold" @click="openUser(message.account)">
+            <bdi
+              v-html="
+                $t('notification.poll_vote.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
+          </span>
         </div>
         <div class="action-icon" role="presentation">
           <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />

src/renderer/components/organisms/Notification/Quote.vue

@@ -16,8 +16,16 @@
           <icon name="retweet" scala="0.7"></icon>
         </div>
         <div class="action-detail">
-          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-          >{{ $t('notification.quote.body') }}
+          <span class="bold" @click="openUser(message.account)">
+            <bdi
+              v-html="
+                $t('notification.quote.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
+          </span>
         </div>
         <div class="action-icon" role="presentation">
           <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />

src/renderer/components/organisms/Notification/Reaction.vue

@@ -16,8 +16,16 @@
           {{ message.emoji }}
         </div>
         <div class="action-detail">
-          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-          >{{ $t('notification.reaction.body') }}
+          <span class="bold" @click="openUser(message.account)">
+            <bdi
+              v-html="
+                $t('notification.reaction.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
+          </span>
         </div>
         <div class="action-icon" role="presentation">
           <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />

src/renderer/components/organisms/Notification/Reblog.vue

@@ -16,8 +16,16 @@
           <icon name="retweet" scala="0.7"></icon>
         </div>
         <div class="action-detail">
-          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-          >{{ $t('notification.reblog.body') }}
+          <span class="bold" @click="openUser(message.account)">
+            <bdi
+              v-html="
+                $t('notification.reblog.body', {
+                  username: username(message.account),
+                  interpolation: { escapeValue: false }
+                })
+              "
+            ></bdi>
+          </span>
         </div>
         <div class="action-icon" role="presentation">
           <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />

src/renderer/components/organisms/Notification/Status.vue

@@ -5,8 +5,16 @@
         <icon name="home" scale="0.9"></icon>
       </div>
       <div class="action-detail">
-        <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
-        >{{ $t('notification.status.body') }}
+        <span class="bold" @click="openUser(message.account)">
+          <bdi
+            v-html="
+              $t('notification.status.body', {
+                username: username(message.account),
+                interpolation: { escapeValue: false }
+              })
+            "
+          ></bdi>
+        </span>
       </div>
       <div class="action-icon" role="presentation">
         <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />