Add more merging statuses to use randomly

Add merge active status messages and use one of
them randomly.

app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merging.vue

 <script>
+import { MERGE_ACTIVE_STATUS_PHRASES } from '../../constants';
 import statusIcon from '../mr_widget_status_icon.vue';
 
 export default {
@@ -13,6 +14,13 @@ export default {
       default: () => ({}),
     },
   },
+  data() {
+    const statusCount = MERGE_ACTIVE_STATUS_PHRASES.length;
+
+    return {
+      mergeStatus: MERGE_ACTIVE_STATUS_PHRASES[Math.floor(Math.random() * statusCount)],
+    };
+  },
 };
 </script>
 <template>
@@ -20,8 +28,8 @@ export default {
     <status-icon status="loading" />
     <div class="media-body">
       <h4>
-        {{ s__('mrWidget|Merging! Drum roll, please…') }}
-        <gl-emoji data-name="drum" />
+        {{ mergeStatus.message }}
+        <gl-emoji :data-name="mergeStatus.emoji" />
       </h4>
       <section class="mr-info-list">
         <p>

app/assets/javascripts/vue_merge_request_widget/constants.js

@@ -25,3 +25,30 @@ export const SP_HELP_CONTENT = s__(
 );
 export const SP_HELP_URL = 'https://about.gitlab.com/blog/2019/07/12/guide-to-ci-cd-pipelines/';
 export const SP_ICON_NAME = 'status_notfound';
+
+export const MERGE_ACTIVE_STATUS_PHRASES = [
+  {
+    message: s__('mrWidget|Merging! Drum roll, please…'),
+    emoji: 'drum',
+  },
+  {
+    message: s__("mrWidget|Merging! We're almost there…"),
+    emoji: 'sparkles',
+  },
+  {
+    message: s__('mrWidget|Merging! Changes will land soon…'),
+    emoji: 'airplane_arriving',
+  },
+  {
+    message: s__('mrWidget|Merging! Changes are being shipped…'),
+    emoji: 'ship',
+  },
+  {
+    message: s__("mrWidget|Merging! Everything's good…"),
+    emoji: 'relieved',
+  },
+  {
+    message: s__('mrWidget|Merging! This is going to be great…'),
+    emoji: 'heart_eyes',
+  },
+];

changelogs/unreleased/kp-add-more-merging-status-phrases.yml

+---
+title: Show a random predefined message while MR merging is in progress
+merge_request: 60521
+author:
+type: added

locale/gitlab.pot

@@ -38147,9 +38147,24 @@ msgstr ""
 msgid "mrWidget|Merged by"
 msgstr ""
 
+msgid "mrWidget|Merging! Changes are being shipped…"
+msgstr ""
+
+msgid "mrWidget|Merging! Changes will land soon…"
+msgstr ""
+
 msgid "mrWidget|Merging! Drum roll, please…"
 msgstr ""
 
+msgid "mrWidget|Merging! Everything's good…"
+msgstr ""
+
+msgid "mrWidget|Merging! This is going to be great…"
+msgstr ""
+
+msgid "mrWidget|Merging! We're almost there…"
+msgstr ""
+
 msgid "mrWidget|More information"
 msgstr ""
 

spec/features/merge_request/user_sees_merge_widget_spec.rb

@@ -445,7 +445,7 @@ RSpec.describe 'Merge request > User sees merge widget', :js do
       wait_for_requests
 
       expect(page).not_to have_button('Merge')
-      expect(page).to have_content('Merging! Drum roll, please…')
+      expect(page).to have_content('Merging!')
     end
   end
 

spec/frontend/vue_mr_widget/components/states/mr_widget_merging_spec.js

@@ -31,7 +31,7 @@ describe('MRWidgetMerging', () => {
         .trim()
         .replace(/\s\s+/g, ' ')
         .replace(/[\r\n]+/g, ' '),
-    ).toContain('Merging! Drum roll, please…');
+    ).toContain('Merging!');
   });
 
   it('renders branch information', () => {