1 files changed, 17 insertions, 12 deletions
diff --git a/app/assets/javascripts/sidebar/components/assignees/assignees.vue b/app/assets/javascripts/sidebar/components/assignees/assignees.vue
index 0074d7099dc..805c21d0965 100644
--- a/app/assets/javascripts/sidebar/components/assignees/assignees.vue
+++ b/app/assets/javascripts/sidebar/components/assignees/assignees.vue
@@ -1,5 +1,5 @@
 <script>
-import { __ } from '~/locale';
+import { __, sprintf } from '~/locale';
 import tooltip from '~/vue_shared/directives/tooltip';
 
 export default {
@@ -62,7 +62,8 @@ export default {
       return this.numberOfHiddenAssignees > 0;
     },
     hiddenAssigneesLabel() {
-      return `+ ${this.numberOfHiddenAssignees} more`;
+      const { numberOfHiddenAssignees } = this;
+      return sprintf(__('+ %{numberOfHiddenAssignees} more'), { numberOfHiddenAssignees });
     },
     collapsedTooltipTitle() {
       const maxRender = Math.min(this.defaultRenderCount, this.users.length);
@@ -103,12 +104,15 @@ export default {
         // Everyone can merge
         return null;
       } else if (cannotMergeCount === assigneesCount && assigneesCount > 1) {
-        return 'No one can merge';
+        return __('No one can merge');
       } else if (assigneesCount === 1) {
-        return 'Cannot merge';
+        return __('Cannot merge');
       }
 
-      return `${canMergeCount}/${assigneesCount} can merge`;
+      return sprintf(__('%{canMergeCount}/%{assigneesCount} can merge'), {
+        canMergeCount,
+        assigneesCount,
+      });
     },
   },
   methods: {
@@ -128,7 +132,7 @@ export default {
       return `${this.rootPath}${user.username}`;
     },
     assigneeAlt(user) {
-      return `${user.name}'s avatar`;
+      return sprintf(__("%{userName}'s avatar"), { userName: user.name });
     },
     assigneeUsername(user) {
       return `@${user.username}`;
@@ -153,7 +157,7 @@ export default {
       data-placement="left"
       data-boundary="viewport"
     >
-      <i v-if="hasNoUsers" aria-label="None" class="fa fa-user"> </i>
+      <i v-if="hasNoUsers" :aria-label="__('None')" class="fa fa-user"> </i>
       <button
         v-for="(user, index) in users"
         v-if="shouldRenderCollapsedAssignee(index)"
@@ -185,9 +189,12 @@ export default {
       </span>
       <template v-if="hasNoUsers">
         <span class="assign-yourself no-value qa-assign-yourself">
-          None
+          {{ __('None') }}
           <template v-if="editable">
-            - <button type="button" class="btn-link" @click="assignSelf">assign yourself</button>
+            -
+            <button type="button" class="btn-link" @click="assignSelf">
+              {{ __('assign yourself') }}
+            </button>
           </template>
         </span>
       </template>
@@ -232,9 +239,7 @@ export default {
             <template v-if="showLess">
               {{ hiddenAssigneesLabel }}
             </template>
-            <template v-else>
-              - show less
-            </template>
+            <template v-else>{{ __('- show less') }}</template>
           </button>
         </div>
       </template>