1 files changed, 10 insertions, 6 deletions

diff --git a/app/assets/javascripts/notes/components/note_awards_list.vue b/app/assets/javascripts/notes/components/note_awards_list.vue
index 941b6d5cab3..813c9f8a261 100644
--- a/app/assets/javascripts/notes/components/note_awards_list.vue
+++ b/app/assets/javascripts/notes/components/note_awards_list.vue
@@ -4,6 +4,7 @@ import tooltip from '~/vue_shared/directives/tooltip';
 import Icon from '~/vue_shared/components/icon.vue';
 import Flash from '../../flash';
 import { glEmojiTag } from '../../emoji';
+import { __, sprintf } from '~/locale';
 
 export default {
   components: {
@@ -108,23 +109,26 @@ export default {
 
       // Add myself to the beginning of the list so title will start with You.
       if (hasReactionByCurrentUser) {
-        namesToShow.unshift('You');
+        namesToShow.unshift(__('You'));
       }
 
       let title = '';
 
       // We have 10+ awarded user, join them with comma and add `and x more`.
       if (remainingAwardList.length) {
-        title = `${namesToShow.join(', ')}, and ${remainingAwardList.length} more.`;
+        title = sprintf(__(`%{listToShow}, and %{awardsListLength} more.`), {
+          listToShow: namesToShow.join(', '),
+          awardsListLength: remainingAwardList.length,
+        });
       } else if (namesToShow.length > 1) {
         // Join all names with comma but not the last one, it will be added with and text.
         title = namesToShow.slice(0, namesToShow.length - 1).join(', ');
         // If we have more than 2 users we need an extra comma before and text.
         title += namesToShow.length > 2 ? ',' : '';
-        title += ` and ${namesToShow.slice(-1)}`; // Append and text
+        title += sprintf(__(` and %{sliced}`), { sliced: namesToShow.slice(-1) }); // Append and text
       } else {
         // We have only 2 users so join them with and.
-        title = namesToShow.join(' and ');
+        title = namesToShow.join(__(' and '));
       }
 
       return title;
@@ -155,7 +159,7 @@ export default {
         awardName: parsedName,
       };
 
-      this.toggleAwardRequest(data).catch(() => Flash('Something went wrong on our end.'));
+      this.toggleAwardRequest(data).catch(() => Flash(__('Something went wrong on our end.')));
     },
   },
 };
@@ -184,7 +188,7 @@ export default {
           :class="{ 'js-user-authored': isAuthoredByMe }"
           class="award-control btn js-add-award"
           title="Add reaction"
-          aria-label="Add reaction"
+          :aria-label="__(`Add reaction`)"
           data-boundary="viewport"
           type="button"
         >