Migrate deprecated bs-callout to alert component in domain verification

What does this MR do and why?

Migrate deprecated bs-callout to Pajamas::AlertComponent in ee/app/views/groups/settings/domain_verification/_lets_encrypt_callout.html.haml

It's a part of Pajamas adoption project

Changed according to migration guide available in next epic: &5213 (closed)

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Before After
domain_verification_old domain_verification_new

How to set up and validate locally

  1. Enable pages in config/gitlab.yml:
development:
  pages:
    enabled: true
  1. Mock domain_verification_available? to return true
  2. Open some group.
  3. Goto Settings -> Domain verification
  4. Create new domain and save it.
  5. Edit created domain and verify messages. Mock related if/elsif/else conditions to see messages:

_lets_encrypt_callout.html.haml

- auto_ssl_available_and_enabled = true # mock it with true to not assign "gl-display-none" class
- if true # mock
  - if true # mock
    - if true # mock
      .form-group.gl-form-group.js-shown-if-auto-ssl{ class: ("gl-display-none" unless auto_ssl_available_and_enabled) }
        = render Pajamas::AlertComponent.new(variant: :warning, dismissible: false) do |c|
          - c.with_body do
            = _("Something went wrong while obtaining the Let's Encrypt certificate.")
          - c.with_actions do
            = link_button_to _('Retry'), retry_auto_ssl_group_settings_domain_verification_path(group, domain_presenter), method: :post, size: :small
    - if true # mock
      .form-group.gl-form-group.js-shown-if-auto-ssl{ class: ("gl-display-none" unless auto_ssl_available_and_enabled) }
        = render Pajamas::AlertComponent.new(dismissible: false, show_icon: false) do |c|
          - c.with_body do
            = _("GitLab is obtaining a Let's Encrypt SSL certificate for this domain. This process can take some time. Please try again later.")
- if true # mock
  .form-group.gl-form-group.js-shown-if-auto-ssl{ class: ("gl-display-none" unless auto_ssl_available_and_enabled) }
    = render Pajamas::AlertComponent.new(variant: :warning, dismissible: false, show_icon: false) do |c|
      - c.with_body do
        = _("A Let's Encrypt SSL certificate can not be obtained until your domain is verified.")

Related to #442181 (closed)

Edited by Taras Tadai

Merge request reports

Loading