Skip to content

Generic Confirm Modal in JS

Zack Cuddy requested to merge 205900-vue-confirm-modal into master

What does this MR do?

Closes #205900 (closed)

Currently, we cannot call GlModal from HAML very easily. Throughout the backend there are countless uses of the browser default confirm box.

This new component will be used to open the door to replace all those instances of browser confirms with this.

An example of this being implemented can be found here: !24808 (merged)

How to test this on your own GDK

  1. In your JS Hook (ex: javascript/pages/path/index.js)
import initConfirmModal from '~/confirm_modal';

document.addEventListener('DOMContentLoaded', () => {
  initConfirmModal();
});
  1. Add a button in your HAML file
= button_to s_('Geo|Remove'), '#', class: 'btn btn-danger btn-inverted js-confirm-modal-button', data: modal_data_helper_function
  1. Add a helper function that defines the information for your modal (ex. application_helper.rb)
    def modal_data_helper_function
      {
        path: path,
        method: 'delete',
        modal_attributes: {
          modalId: 'geo-entry-removal-modal',
          title: _('Remove tracking database entry'),
          message: _('Tracking database entry will be removed. Are you sure?'),
          okVariant: 'danger',
          okTitle: _('Remove entry')
        }
      }
    end

Screenshots

Confirm
before Browser_Confirm_-_OLD
after Screen_Shot_2020-02-18_at_2.07.54_PM

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

Security

If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team

Closes #205900 (closed)

Edited by Yorick Peterse

Merge request reports

Loading