1 files changed, 11 insertions, 0 deletions
diff --git a/web_src/js/components/PullRequestMergeForm.vue b/web_src/js/components/PullRequestMergeForm.vue
index bfe05628e8..1fec12dd5a 100644
--- a/web_src/js/components/PullRequestMergeForm.vue
+++ b/web_src/js/components/PullRequestMergeForm.vue
@@ -25,6 +25,14 @@
           </div>
           <div class="field">
             <textarea name="merge_message_field" rows="5" :placeholder="mergeForm.mergeMessageFieldPlaceHolder" v-model="mergeMessageFieldValue"/>
+            <template v-if="mergeMessageFieldValue !== mergeForm.defaultMergeMessage">
+              <button @click.prevent="clearMergeMessage" class="ui tertiary button">
+                {{ mergeForm.textClearMergeMessage }}
+              </button>
+              <div class="ui label"><!-- TODO: Convert to tooltip once we can use tooltips in Vue templates -->
+                {{ mergeForm.textClearMergeMessageHint }}
+              </div>
+            </template>
           </div>
         </template>
 
@@ -174,6 +182,9 @@ export default {
       this.mergeStyle = name;
       this.autoMergeWhenSucceed = autoMerge;
     },
+    clearMergeMessage() {
+      this.mergeMessageFieldValue = this.mergeForm.defaultMergeMessage;
+    },
   },
 };
 </script>