Fix: locale issue on issue page header actions

* Unify the header action texts referencing.
* Enhance the IssuableTypeText.

Changelog: fixed

app/assets/javascripts/issues/constants.js

@@ -31,4 +31,7 @@ export const issuableStatusText = {
 export const IssuableTypeText = {
   [TYPE_ISSUE]: __('issue'),
   [TYPE_MERGE_REQUEST]: __('merge request'),
+  [TYPE_ALERT]: __('alert'),
+  [TYPE_INCIDENT]: __('incident'),
+  [TYPE_TEST_CASE]: __('test case'),
 };

app/assets/javascripts/issues/show/components/header_actions.vue

@@ -13,7 +13,7 @@ import * as Sentry from '@sentry/browser';
 import { mapActions, mapGetters, mapState } from 'vuex';
 import { createAlert, VARIANT_SUCCESS } from '~/alert';
 import { EVENT_ISSUABLE_VUE_APP_CHANGE } from '~/issuable/constants';
-import { STATUS_CLOSED, TYPE_INCIDENT, TYPE_ISSUE, IssuableTypeText } from '~/issues/constants';
+import { STATUS_CLOSED, TYPE_ISSUE, IssuableTypeText } from '~/issues/constants';
 import {
   ISSUE_STATE_EVENT_CLOSE,
   ISSUE_STATE_EVENT_REOPEN,
@@ -22,7 +22,7 @@ import {
 import { capitalizeFirstCharacter } from '~/lib/utils/text_utility';
 import { getCookie, parseBoolean, setCookie, isLoggedIn } from '~/lib/utils/common_utils';
 import { visitUrl } from '~/lib/utils/url_utility';
-import { s__, __, sprintf } from '~/locale';
+import { __, sprintf } from '~/locale';
 import eventHub from '~/notes/event_hub';
 import Tracking from '~/tracking';
 import toast from '~/vue_shared/plugins/global_toast';
@@ -172,12 +172,9 @@ export default {
       return this.openState === STATUS_CLOSED;
     },
     issueTypeText() {
-      const issueTypeTexts = {
-        [TYPE_ISSUE]: s__('HeaderAction|issue'),
-        [TYPE_INCIDENT]: s__('HeaderAction|incident'),
-      };
+      const { issueType } = this;
 
-      return issueTypeTexts[this.issueType] ?? this.issueType;
+      return IssuableTypeText[issueType] ?? issueType;
     },
     buttonText() {
       return this.isClosed
@@ -192,11 +189,11 @@ export default {
     },
     dropdownText() {
       return sprintf(__('%{issueType} actions'), {
-        issueType: capitalizeFirstCharacter(this.issueType),
+        issueType: capitalizeFirstCharacter(this.issueTypeText),
       });
     },
     newIssueTypeText() {
-      return sprintf(__('New related %{issueType}'), { issueType: this.issueType });
+      return sprintf(__('New related %{issueType}'), { issueType: this.issueTypeText });
     },
     showToggleIssueStateButton() {
       const canClose = !this.isClosed && this.canUpdateIssue;
@@ -217,7 +214,7 @@ export default {
     },
     copyMailAddressText() {
       return sprintf(__('Copy %{issueType} email address'), {
-        issueType: IssuableTypeText[this.issueType],
+        issueType: this.issueTypeText,
       });
     },
     isMrSidebarMoved() {

locale/gitlab.pot

@@ -22412,12 +22412,6 @@ msgstr ""
 msgid "HeaderAction|Okay!"
 msgstr ""
-msgid "HeaderAction|incident"
-msgstr ""
-
-msgid "HeaderAction|issue"
-msgstr ""
-
 msgid "Headers"
 msgstr ""
@@ -54451,6 +54445,9 @@ msgstr ""
 msgid "in project %{link_to_project}"
 msgstr ""
+msgid "incident"
+msgstr ""
+
 msgid "instance completed"
 msgid_plural "instances completed"
 msgstr[0] ""
@@ -55490,6 +55487,9 @@ msgstr ""
 msgid "terraform states"
 msgstr ""
+msgid "test case"
+msgstr ""
+
 msgid "the correct format."
 msgstr ""

spec/frontend/issues/show/components/header_actions_spec.js

 import Vue, { nextTick } from 'vue';
-import { GlDropdownItem, GlLink, GlModal, GlButton } from '@gitlab/ui';
+import { GlDropdown, GlDropdownItem, GlLink, GlModal, GlButton } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import Vuex from 'vuex';
 import VueApollo from 'vue-apollo';
 import waitForPromises from 'helpers/wait_for_promises';
 import { mockTracking } from 'helpers/tracking_helper';
 import { createAlert, VARIANT_SUCCESS } from '~/alert';
-import { STATUS_CLOSED, STATUS_OPEN, TYPE_INCIDENT, TYPE_ISSUE } from '~/issues/constants';
+import {
+  STATUS_CLOSED,
+  STATUS_OPEN,
+  TYPE_INCIDENT,
+  TYPE_ISSUE,
+  TYPE_TEST_CASE,
+  TYPE_ALERT,
+  TYPE_MERGE_REQUEST,
+} from '~/issues/constants';
 import DeleteIssueModal from '~/issues/show/components/delete_issue_modal.vue';
 import AbuseCategorySelector from '~/abuse_reports/components/abuse_category_selector.vue';
 import HeaderActions from '~/issues/show/components/header_actions.vue';
@@ -14,6 +22,7 @@ import { ISSUE_STATE_EVENT_CLOSE, ISSUE_STATE_EVENT_REOPEN } from '~/issues/show
 import issuesEventHub from '~/issues/show/event_hub';
 import promoteToEpicMutation from '~/issues/show/queries/promote_to_epic.mutation.graphql';
 import * as urlUtility from '~/lib/utils/url_utility';
+import { capitalizeFirstCharacter } from '~/lib/utils/text_utility';
 import eventHub from '~/notes/event_hub';
 import createStore from '~/notes/stores';
 import createMockApollo from 'helpers/mock_apollo_helper';
@@ -690,4 +699,27 @@ describe('HeaderActions component', () => {
       },
     );
   });
+
+  describe('issue type text', () => {
+    it.each`
+      issueType             | expectedText
+      ${TYPE_ISSUE}         | ${'issue'}
+      ${TYPE_INCIDENT}      | ${'incident'}
+      ${TYPE_MERGE_REQUEST} | ${'merge request'}
+      ${TYPE_ALERT}         | ${'alert'}
+      ${TYPE_TEST_CASE}     | ${'test case'}
+      ${'unknown'}          | ${'unknown'}
+    `('$issueType', ({ issueType, expectedText }) => {
+      wrapper = mountComponent({
+        movedMrSidebarEnabled: true,
+        props: { issueType, issuableEmailAddress: 'mock-email-address' },
+      });
+
+      expect(wrapper.findComponent(GlDropdown).attributes('text')).toBe(
+        `${capitalizeFirstCharacter(expectedText)} actions`,
+      );
+      expect(findDropdownBy('copy-email').text()).toBe(`Copy ${expectedText} email address`);
+      expect(findDesktopDropdownItems().at(0).text()).toBe(`New related ${expectedText}`);
+    });
+  });
 });