Added commit form fields for delete page confirmation

3 files changed, 56 insertions, 12 deletions

diff --git a/app/assets/javascripts/pages/projects/wikis/components/delete_wiki_modal.vue b/app/assets/javascripts/pages/projects/wikis/components/delete_wiki_modal.vue
index 6a4d3f56229..af0b86ea816 100644
--- a/app/assets/javascripts/pages/projects/wikis/components/delete_wiki_modal.vue
+++ b/app/assets/javascripts/pages/projects/wikis/components/delete_wiki_modal.vue
@@ -1,6 +1,7 @@
 <script>
+import _ from 'underscore';
 import GlModal from '~/vue_shared/components/gl_modal.vue';
-  import { s__} from '~/locale';
+import { s__, sprintf } from '~/locale';
 
 export default {
   components: {
@@ -12,6 +13,11 @@ export default {
       required: false,
       default: '',
     },
+    pageTitle: {
+      type: String,
+      required: false,
+      default: '',
+    },
     csrfToken: {
       type: String,
       required: false,
@@ -19,8 +25,22 @@ export default {
     },
   },
   computed: {
-    text() {
-      return s__('WikiPageConfirmDelete|Are you sure you want to delete this page?')
+    message() {
+     return  sprintf(s__('WikiPageConfirmDelete|Delete %{pageTitle}'),
+        {
+          pageTitle: _.escape(this.pageTitle),
+        },
+        false,
+      );
+    },
+
+    title() {
+      return  sprintf(s__('WikiPageConfirmDelete|Delete Page %{pageTitle}?'),
+        {
+          pageTitle: `'${_.escape(this.pageTitle)}'`,
+        },
+        false,
+      );
     }
   },
   methods: {
@@ -34,17 +54,16 @@ export default {
 <template>
   <gl-modal
     id="delete-wiki-modal"
-    :header-title-text="s__('WikiPageConfirmDelete|Delete Wiki?')"
+    :header-title-text="title"
     footer-primary-button-variant="danger"
-    :footer-primary-button-text="s__('WikiPageConfirmDelete|Delete')"
+    :footer-primary-button-text="s__('WikiPageConfirmDelete|Delete Page')"
     @submit="onSubmit"
   >
-    {{ text }}
-
     <form
         ref="form"
         :action="deleteWikiUrl"
         method="post"
+        class="form-horizontal js-requires-input"
       >
         <input
           ref="method"
@@ -57,6 +76,31 @@ export default {
           name="authenticity_token"
           :value="csrfToken"
         />
+
+        <div class="form-group">
+          <div class="col-sm-12">
+              <label for="commit_message" class="control-label-full-width">Commit Message</label>
+            </div>
+          <div class="col-sm-12">
+            <div class="commit-message-container">
+              <textarea
+                id="commit_message"
+                rows="3"
+                name="commit_message"
+                :value="message"
+                class="form-control js-commit-message" required></textarea>
+            </div>
+            
+          </div>
+        </div>
+        <div class="form-group">
+          <div class="col-sm-12">
+            <label for="branch_name" class="control-label-full-width">Target Branch</label>
+          </div>
+          <div class="col-sm-12">
+            <input type="text" name="branch_name" class="form-control js-commit-message ref-name" required />
+          </div>
+        </div>
       </form>
   </gl-modal>
 </template>
diff --git a/app/assets/javascripts/pages/projects/wikis/index.js b/app/assets/javascripts/pages/projects/wikis/index.js
index 467f65541ec..169fa5d85a8 100644
--- a/app/assets/javascripts/pages/projects/wikis/index.js
+++ b/app/assets/javascripts/pages/projects/wikis/index.js
@@ -15,9 +15,9 @@ document.addEventListener('DOMContentLoaded', () => {
   new GLForm($('.wiki-form'), true); // eslint-disable-line no-new
 
   Vue.use(Translate);
-  const { deleteWikiUrl } = document.getElementById('delete-wiki-button').dataset;
+  const { deleteWikiUrl, pageTitle } = document.getElementById('delete-wiki-button').dataset;
   const deleteWikiModalEl = document.getElementById('delete-wiki-modal');
-  const deleteModal = new Vue({
+  const deleteModal = new Vue({ // eslint-disable-line
     el: deleteWikiModalEl,
     data: {
       deleteWikiUrl: '',
@@ -25,6 +25,7 @@ document.addEventListener('DOMContentLoaded', () => {
     render(createElement) {
       return createElement(deleteWikiModal, {
         props: {
+          pageTitle,
           deleteWikiUrl,
           csrfToken: csrf.token,
         },
diff --git a/app/views/projects/wikis/edit.html.haml b/app/views/projects/wikis/edit.html.haml
index e51fa1abfe4..abc8f7cc04b 100644
--- a/app/views/projects/wikis/edit.html.haml
+++ b/app/views/projects/wikis/edit.html.haml
@@ -28,11 +28,10 @@
       = link_to project_wiki_history_path(@project, @page), class: "btn" do
         = s_("Wiki|Page history")
       - if can?(current_user, :admin_wiki, @project)
-        -# = link_to project_wiki_path(@project, @page), data: { confirm: s_("WikiPageConfirmDelete|Are you sure you want to delete this page?")}, method: :delete, class: "btn btn-danger" do
-        -#   = _("Delete")
         %button.btn.btn-danger{ data: { toggle: 'modal', 
           target: '#delete-wiki-modal', 
-          delete_wiki_url: project_wiki_path(@project, @page) }, 
+          delete_wiki_url: project_wiki_path(@project, @page), 
+          page_title: @page.title.capitalize }, 
           id: 'delete-wiki-button',
           type: 'button' }
           = _('Delete')