Fix Comment and close button text for work items and merge requests

What does this MR do and why?

This MR fixes the close and reopen button text on work items so it follows GitLab's word list and Pajamas guidance. Buttons and modals used & instead of and, and used title case for the interpolated work item type name (for example Issue instead of issue).

Changes:

  • Work item state toggle: WorkItem|Comment & close %{workItemType} and WorkItem|Comment & reopen %{workItemType} become Comment and close and Comment and reopen.
  • Notes comment form (app/assets/javascripts/notes/i18n.js): %{actionText} & close %{noteable} and %{actionText} & reopen %{noteable} use and instead of &. This path renders the buttons for merge requests, tickets, epics, and incidents, so Comment & close merge request becomes Comment and close merge request.
  • Sentence case for the interpolated work item type name in work_item_state_toggle.vue and work_item_close_confirm_modal.vue, via a new lowercaseWorkItemType computed property.

Two components duplicate the same modal strings, so both were updated to stay consistent: the inline modals in work_item_state_toggle.vue (used by the header More actions dropdown) and work_item_close_confirm_modal.vue (used by the description and /close quick action paths).

The locale/gitlab.pot msgids were updated for the ampersand changes. The sentence case change needed no .pot update, because only the interpolated value changes, not the msgid.

Specs were updated across the frontend, feature, and shared example suites. Two QA page objects match on the button text, so they were updated too: qa/qa/page/project/work_item/show.rb and qa/qa/ee/page/group/work_item/epic/show.rb.

Out of scope: the error message WorkItem|Something went wrong while updating the %{workItemType}. Please try again. keeps title case, because it's shared with about a dozen sidebar widget components. Changing it only at this call site would create a new inconsistency.

A quarantined test block in ee/spec/features/work_items/issues/related_issues_spec.rb already expected the lowercase strings, so this change brings the app in line with it (quarantine issue linked below).

Before After
Comment & close Issue Comment and close issue
Comment & close merge request Comment and close merge request
Close Issue Close issue

References

Screenshots or screen recordings

Before After
Screenshot_2026-08-11_at_15.56.50 Screenshot_2026-08-11_at_16.03.16
Screenshot_2026-08-11_at_15.56.57 Screenshot_2026-08-11_at_15.58.29
Screenshot_2026-08-11_at_15.57.23 Screenshot_2026-08-11_at_15.58.54

How to set up and validate locally

  1. Open an issue.
  2. Type a comment in the comment box and check that the button reads Comment and close issue.
  3. Clear the comment box and check that the button reads Close issue.
  4. Open the header More actions dropdown and check the same button text there.
  5. Mark the issue as blocked by another open issue, then close it from the header More actions dropdown, and check the confirmation modal text.

Testing

yarn jest spec/frontend/work_items ee/spec/frontend/work_items passes (241 suites, 4931 tests). The Ruby :js feature specs were not run locally and rely on CI.

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Brendan Lynch

Merge request reports

Loading
Loading