Add domain verification operation views

Related issue #375492 (closed)

What does this MR do and why?

Add domain verification operation views.

The feature is under feature flag: domain_verification_operation

The haml views are copy from app/views/projects/pages_domains/. The main differences:

• Add a new project select component in create form
• UI changed(design link) and follow the new Pajamas design system
• Action link url changed
• Need add new documentation page replace the doc link

dependent MRs:

• !116641 (merged)
• !116626 (merged)

design link Figma

/cc @daveliu @qk44077907

Screenshots or screen recordings

Empty index page	Index page with domains

New domain page

Edit domain page

How to set up and validate locally

1. simulate the SaaS locally:

   export GITLAB_SIMULATE_SAAS=1

2. Upload Premium license to enable domain_verification feature

3. Enable pages in gitlab.yml:

   pages:
     enabled: true
     access_control: false
     host: example.com
     port: 80
     external_http: true
     external_https: true

4. enable domain_verification_operation feature in console:

   Feature.enable(:domain_verification_operation)

5. Change application settings in rails console:

   ApplicationSetting.current.update(pages_domain_verification_enabled: true, lets_encrypt_terms_of_service_accepted: true, 
   lets_encrypt_notification_email: "test@gitlab.com")

6. Visit domain verification page http://localhost:3000/groups/flightjs/-/settings/domain_verification

7. Click the Add Domain button.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

ee/app/assets/javascripts/domain_verification/index.js

+export function initRemoveButtonBehavior() {
+  const emptyState = document.querySelector('.js-domain-empty-state');
+
+  function removeRowSuccessCallback() {
+    this.closest('tr').classList.add('gl-display-none!');
+
+    const labelsCount = document.querySelectorAll('.js-domain-row:not(.gl-display-none\\!)').length;
+
+    if (labelsCount < 1 && emptyState) {
+      emptyState.classList.remove('gl-display-none');
+    }
+  }
+
+  document.querySelectorAll('.js-remove-domain').forEach((button) => {
+    button.addEventListener('ajax:success', removeRowSuccessCallback);
+  });
+}