Ensure we submit the relevant form after confirmation

Passes a form id from the haml partial to the vue
app to target the relevant form we are intercepting
the passed `id` can then be used to manually submit
the form when the confirm button is clicked

app/assets/javascripts/init_confirm_danger.js

@@ -6,7 +6,14 @@ export default () => {
   const el = document.querySelector('.js-confirm-danger');
   if (!el) return null;
 
-  const { phrase, buttonText, confirmDangerMessage, testId = null, disabled = false } = el.dataset;
+  const {
+    removeFormId = null,
+    phrase,
+    buttonText,
+    confirmDangerMessage,
+    testId = null,
+    disabled = false,
+  } = el.dataset;
   return new Vue({
     el,
     provide: {
@@ -20,6 +27,11 @@ export default () => {
           testId,
           disabled: parseBoolean(disabled),
         },
+        on: {
+          confirm: () => {
+            if (removeFormId) document.getElementById(removeFormId).submit();
+          },
+        },
       }),
   });
 };

app/views/groups/settings/_advanced.html.haml

+- remove_form_id = 'js-remove-group-form'
 = render 'groups/settings/export', group: @group
 
 .sub-section
@@ -26,6 +27,6 @@
     = f.submit s_('GroupSettings|Change group URL'), class: 'btn gl-button btn-warning'
 
 = render 'groups/settings/transfer', group: @group
-= render 'groups/settings/remove', group: @group
+= render 'groups/settings/remove', group: @group, remove_form_id: remove_form_id
 = render_if_exists 'groups/settings/restore', group: @group
-= render_if_exists 'groups/settings/immediately_remove', group: @group
+= render_if_exists 'groups/settings/immediately_remove', group: @group, remove_form_id: remove_form_id

app/views/groups/settings/_permanent_deletion.html.haml

+- remove_form_id = local_assigns.fetch(:remove_form_id, nil)
+
 .sub-section
   %h4.danger-title= _('Remove group')
-  = form_tag(group, method: :delete) do
+  = form_tag(group, method: :delete, id: remove_form_id) do
     %p
       = _('Removing this group also removes all child projects, including archived projects, and their resources.')
       %br
       %strong= _('Removed group can not be restored!')
 
-    = render 'groups/settings/remove_button', group: group
+    = render 'groups/settings/remove_button', group: group, remove_form_id: remove_form_id

app/views/groups/settings/_remove.html.haml

+- remove_form_id = local_assigns.fetch(:remove_form_id, nil)
+
 - if group.adjourned_deletion?
-  = render_if_exists 'groups/settings/adjourned_deletion', group: group
+  = render_if_exists 'groups/settings/adjourned_deletion', group: group, remove_form_id: remove_form_id
 - else
-  = render 'groups/settings/permanent_deletion', group: group
-
+  = render 'groups/settings/permanent_deletion', group: group, remove_form_id: remove_form_id

app/views/groups/settings/_remove_button.html.haml

-- confirm_modal_data = { "disabled" => group.paid?, "button-text" => _('Remove group'), "confirm-danger-message" => remove_group_message(group), phrase: group.full_path, 'testid' => 'remove-group-button' }
+- remove_form_id = local_assigns.fetch(:remove_form_id, nil)
+- confirm_modal_data = { "remove_form_id" => remove_form_id, "disabled" => group.paid?, "button-text" => _('Remove group'), "confirm-danger-message" => remove_group_message(group), phrase: group.full_path, 'testid' => 'remove-group-button' }
 
 - if group.paid?
   .gl-alert.gl-alert-info.gl-mb-5{ data: { testid: 'group-has-linked-subscription-alert' } }

ee/app/views/groups/settings/_adjourned_deletion.html.haml

 - return if group.marked_for_deletion?
+- remove_form_id = local_assigns.fetch(:remove_form_id, nil)
 
 - date = permanent_deletion_date(Time.now.utc)
 .sub-section
   %h4.danger-title= _('Remove group')
-  = form_tag(group, method: :delete) do
+  = form_tag(group, method: :delete, id: remove_form_id) do
     %p
       = html_escape(_("Upon performing this action, the contents of this group, its subgroup and projects will be permanently deleted after %{deletion_adjourned_period} days on %{date}. Until that time:")) % { date: tag.strong(date), deletion_adjourned_period: deletion_adjourned_period }
     %ul
       %li= _("The group will be placed in 'pending deletion' state")
       %li= _("The group can be fully restored")
 
-    = render 'groups/settings/remove_button', group: group
+    = render 'groups/settings/remove_button', group: group, remove_form_id: remove_form_id

ee/app/views/groups/settings/_immediately_remove.html.haml

+- remove_form_id = local_assigns.fetch(:remove_form_id, nil)
+
 - if group.marked_for_deletion?
   .sub-section
     %h4.gl-text-red-500= _('Permanently remove group')
-    = form_tag(group, method: :delete) do
+    = form_tag(group, method: :delete, id: remove_form_id) do
       %p
         %strong= _('Removing this group also removes all child projects, including archived projects, and their resources.')
       %p= immediately_remove_group_message(group)
@@ -10,4 +12,4 @@
 
       = hidden_field_tag(:permanently_remove, true)
 
-      = render 'groups/settings/remove_button', group: group
+      = render 'groups/settings/remove_button', group: group, remove_form_id: remove_form_id