Replace angle brackets in frontend translations with entity codes

Replace the use of angle brackets in frontent strings with HTML entity
codes so that we can remove these strings from the todolist and they can
be transated again.

Issue: https://gitlab.com/gitlab-org/gitlab/-/issues/228846

app/assets/javascripts/related_issues/constants.js

-import { __ } from '~/locale';
+import { __, sprintf } from '~/locale';
 
 export const issuableTypesMap = {
   ISSUE: 'issue',
@@ -20,9 +20,21 @@ export const linkedIssueTypesTextMap = {
 
 export const autoCompleteTextMap = {
   true: {
-    [issuableTypesMap.ISSUE]: __(' or <#issue id>'),
-    [issuableTypesMap.EPIC]: __(' or <&epic id>'),
-    [issuableTypesMap.MERGE_REQUEST]: __(' or <!merge request id>'),
+    [issuableTypesMap.ISSUE]: sprintf(
+      __(' or %{emphasisStart}#issue id%{emphasisEnd}'),
+      { emphasisStart: '<', emphasisEnd: '>' },
+      false,
+    ),
+    [issuableTypesMap.EPIC]: sprintf(
+      __(' or %{emphasisStart}&epic id%{emphasisEnd}'),
+      { emphasisStart: '<', emphasisEnd: '>' },
+      false,
+    ),
+    [issuableTypesMap.MERGE_REQUEST]: sprintf(
+      __(' or %{emphasisStart}!merge request id%{emphasisEnd}'),
+      { emphasisStart: '<', emphasisEnd: '>' },
+      false,
+    ),
   },
   false: {
     [issuableTypesMap.ISSUE]: '',

ee/app/assets/javascripts/analytics/code_review_analytics/components/merge_request_table.vue

 <script>
 import { escape } from 'lodash';
 import { mapState } from 'vuex';
+import { sanitize } from 'dompurify';
 import { GlTable, GlLink, GlIcon, GlAvatarLink, GlAvatar, GlTooltipDirective } from '@gitlab/ui';
 import { __, sprintf, n__ } from '~/locale';
 import { getTimeago } from '~/lib/utils/datetime_utility';
@@ -39,7 +40,7 @@ export default {
         return n__('1 hour', '%d hours', hours);
       }
 
-      return __('< 1 hour');
+      return sanitize(__('&lt; 1 hour'), { ALLOWED_TAGS: [] });
     },
   },
   tableHeaderFields: [
@@ -117,7 +118,8 @@ export default {
 
     <template #cell(review_time)="{ value }">
       <template v-if="showReviewTime(value)">
-        {{ formatReviewTime(value) }}
+        <!-- eslint-disable-next-line vue/no-v-html-->
+        <span v-html="formatReviewTime(value)"></span>
       </template>
       <template v-else>
         &ndash;

ee/spec/frontend/analytics/code_review_analytics/components/__snapshots__/merge_request_table_spec.js.snap

@@ -148,9 +148,9 @@ exports[`MergeRequestTable component template matches the snapshot 1`] = `
         role="cell"
       >
         <div>
-          
-      2 days
-    
+          <span>
+            2 days
+          </span>
         </div>
       </td>
       <td

lib/gitlab/i18n/html_todo.yml

@@ -16,67 +16,6 @@
 # why this change has been made.
 #
 
-" or <!merge request id>":
-  translations:
-    - " ወይም <!merge request id>"
-    - " ou <!merge request id>"
-    - " または <!merge request id>"
-    - "或 <!合併請求 id>"
-    - " или <!merge request id>"
-    - "或<!merge request id>"
-    - " або <!merge request id>"
-    - " oder <!merge request id>"
-    - " o <!merge request id>"
-    - " 또는 <!merge request id>"
-    - " o <!merge request id>"
-    - " veya <!merge request id>"
-    - " neu <!merge request id>"
-    - " neu <#issue id>"
-" or <#issue id>":
-  translations:
-    - "或 <#issue id>"
-    - " ወይም ‹#issue id›"
-    - " ou <identificación #issue>"
-    - " ou <#issue id>"
-    - " または <#課題 ID>"
-    - " o <#issue id>"
-    - "或 <#議題 id>"
-    - " ou <#issue id>"
-    - " или <#issue id>"
-    - "或 <#issue id>"
-    - " або <#issue id>"
-    - " oder <#issue id>"
-    - " o <#issue id>"
-    - " 또는 <#issue id>"
-    - " ou <#issue id>"
-    - " o <#issue id>"
-    - " veya <#issue id>"
-    - " neu <#issue id>"
-" or <&epic id>":
-  translations:
-    - " ወይም <&epic id>"
-    - " または <&エピックID>"
-    - " 或 <#史詩 id>"
-    - " или <&epic id>"
-    - " 或<#epic id>"
-    - " або <&epic id>"
-    - " oder <&epic id>"
-    - " o <&epic id>"
-    - " veya <&epic id>"
-    - " neu <#epic id>"
-    - " 또는 <&epic id>"
-"< 1 hour":
-  translations:
-    - "1 時間未満"
-    - "< 1 小時"
-    - "< 1 часа"
-    - "< 1小时"
-    - "< 1 години"
-    - "< 1 hora"
-    - "< 1 saat"
-    - "< 1 Stunde"
-    - "< 1시간"
-
 #
 # Strings below are fixed in the source code but the translations are still present in CrowdIn so the
 # locale files will fail the linter. They can be deleted after next CrowdIn sync, likely in:
@@ -313,3 +252,63 @@
     - "Vous êtes sur le point de d’activer la confidentialité. Cela signifie que seuls les membres de l’équipe avec <strong>au moins un accès en tant que rapporteur</strong> seront en mesure de voir et de laisser des commentaires sur le ticket."
     - "Va a activar la confidencialidad. Esto significa que solo los miembros del equipo con como mínimo,<strong>acceso como Reporter</strong> podrán ver y dejar comentarios sobre la incidencia."
     - "あなたは非公開設定をオンにしようとしています。これは、最低でも<strong>報告権限</strong>を持ったチームメンバーのみが課題を表示したりコメントを残したりすることができるようになるということです。"
+" or <!merge request id>":
+  translations:
+    - " ወይም <!merge request id>"
+    - " ou <!merge request id>"
+    - " または <!merge request id>"
+    - "或 <!合併請求 id>"
+    - " или <!merge request id>"
+    - "或<!merge request id>"
+    - " або <!merge request id>"
+    - " oder <!merge request id>"
+    - " o <!merge request id>"
+    - " 또는 <!merge request id>"
+    - " o <!merge request id>"
+    - " veya <!merge request id>"
+    - " neu <!merge request id>"
+    - " neu <#issue id>"
+" or <#issue id>":
+  translations:
+    - "或 <#issue id>"
+    - " ወይም ‹#issue id›"
+    - " ou <identificación #issue>"
+    - " ou <#issue id>"
+    - " または <#課題 ID>"
+    - " o <#issue id>"
+    - "或 <#議題 id>"
+    - " ou <#issue id>"
+    - " или <#issue id>"
+    - "或 <#issue id>"
+    - " або <#issue id>"
+    - " oder <#issue id>"
+    - " o <#issue id>"
+    - " 또는 <#issue id>"
+    - " ou <#issue id>"
+    - " o <#issue id>"
+    - " veya <#issue id>"
+    - " neu <#issue id>"
+" or <&epic id>":
+  translations:
+    - " ወይም <&epic id>"
+    - " または <&エピックID>"
+    - " 或 <#史詩 id>"
+    - " или <&epic id>"
+    - " 或<#epic id>"
+    - " або <&epic id>"
+    - " oder <&epic id>"
+    - " o <&epic id>"
+    - " veya <&epic id>"
+    - " neu <#epic id>"
+    - " 또는 <&epic id>"
+"< 1 hour":
+  translations:
+    - "1 時間未満"
+    - "< 1 小時"
+    - "< 1 часа"
+    - "< 1小时"
+    - "< 1 години"
+    - "< 1 hora"
+    - "< 1 saat"
+    - "< 1 Stunde"
+    - "< 1시간"

locale/gitlab.pot

@@ -56,13 +56,13 @@ msgstr[1] ""
 msgid " or "
 msgstr ""
 
-msgid " or <!merge request id>"
+msgid " or %{emphasisStart}!merge request id%{emphasisEnd}"
 msgstr ""
 
-msgid " or <#issue id>"
+msgid " or %{emphasisStart}#issue id%{emphasisEnd}"
 msgstr ""
 
-msgid " or <&epic id>"
+msgid " or %{emphasisStart}&epic id%{emphasisEnd}"
 msgstr ""
 
 msgid " or references (e.g. path/to/project!merge_request_id)"
@@ -824,6 +824,9 @@ msgstr ""
 msgid "%{webhooks_link_start}%{webhook_type}%{link_end} enable you to send notifications to web applications in response to events in a group or project. We recommend using an %{integrations_link_start}integration%{link_end} in preference to a webhook."
 msgstr ""
 
+msgid "&lt; 1 hour"
+msgstr ""
+
 msgid "&lt;no name set&gt;"
 msgstr ""
 
@@ -1093,9 +1096,6 @@ msgstr ""
 msgid ":%{startLine} to %{endLine}"
 msgstr ""
 
-msgid "< 1 hour"
-msgstr ""
-
 msgid "A 'Runner' is a process which runs a job. You can set up as many Runners as you need."
 msgstr ""