Add latest changes from gitlab-org/gitlab@15-4-stable-eev15.4.0-rc42

14 files changed, 43 insertions, 68 deletions

diff --git a/app/views/profiles/_email_settings.html.haml b/app/views/profiles/_email_settings.html.haml
index 0ca9acba2de..0fde7fd4f19 100644
--- a/app/views/profiles/_email_settings.html.haml
+++ b/app/views/profiles/_email_settings.html.haml
@@ -25,8 +25,8 @@
     = s_("Profiles|This email will be displayed on your public profile.")
 
 .form-group.gl-form-group
-  - commit_email_link_url = help_page_path('user/profile/index', anchor: 'change-the-email-displayed-on-your-commits', target: '_blank')
-  - commit_email_link_start = '<a href="%{url}">'.html_safe % { url: commit_email_link_url }
+  - commit_email_link_url = help_page_path('user/profile/index', anchor: 'change-the-email-displayed-on-your-commits')
+  - commit_email_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: commit_email_link_url }
   - commit_email_docs_link = s_('Profiles|This email will be used for web based operations, such as edits and merges. %{commit_email_link_start}Learn more.%{commit_email_link_end}').html_safe % { commit_email_link_start: commit_email_link_start, commit_email_link_end: '</a>'.html_safe }
   = form.label :commit_email, s_('Profiles|Commit email')
   .gl-md-form-input-lg
diff --git a/app/views/profiles/active_sessions/index.html.haml b/app/views/profiles/active_sessions/index.html.haml
index f444f236cfc..be835233528 100644
--- a/app/views/profiles/active_sessions/index.html.haml
+++ b/app/views/profiles/active_sessions/index.html.haml
@@ -10,6 +10,7 @@
   .col-lg-8
     .gl-mb-3
 
-      .card.border-0
-        %ul.list-group.list-group-flush
-          = render partial: 'profiles/active_sessions/active_session', collection: @sessions
+      = render Pajamas::CardComponent.new(card_options: { class: 'gl-border-0' }, body_options: { class: 'gl-p-0' }) do |c|
+        - c.body do
+          %ul.list-group.list-group-flush
+            = render partial: 'profiles/active_sessions/active_session', collection: @sessions
diff --git a/app/views/profiles/emails/index.html.haml b/app/views/profiles/emails/index.html.haml
index ef9e7512b57..1b8f0328a04 100644
--- a/app/views/profiles/emails/index.html.haml
+++ b/app/views/profiles/emails/index.html.haml
@@ -38,29 +38,29 @@
         = render partial: 'shared/email_with_badge', locals: { email: @primary_email, verified: current_user.confirmed? }
         %ul
           %li= s_('Profiles|Primary email')
-          - if @primary_email === current_user.commit_email_or_default
+          - if @primary_email == current_user.commit_email_or_default
             %li= s_('Profiles|Commit email')
-          - if @primary_email === current_user.public_email
+          - if @primary_email == current_user.public_email
             %li= s_('Profiles|Public email')
-          - if @primary_email === current_user.notification_email_or_default
+          - if @primary_email == current_user.notification_email_or_default
             %li= s_('Profiles|Default notification email')
       - @emails.reject(&:user_primary_email?).each do |email|
         %li{ data: { qa_selector: 'email_row_content' } }
-          .gl-display-flex.gl-justify-content-space-between{ style: 'flex-flow: wrap-reverse; row-gap: 0.5rem' }
+          .gl-display-flex.gl-justify-content-space-between.gl-flex-wrap.gl-gap-3
             %div
               = render partial: 'shared/email_with_badge', locals: { email: email.email, verified: email.confirmed? }
-            .gl-ml-n3
+              %ul
+                - if email.email == current_user.commit_email_or_default
+                  %li= s_('Profiles|Commit email')
+                - if email.email == current_user.public_email
+                  %li= s_('Profiles|Public email')
+                - if email.email == current_user.notification_email_or_default
+                  %li= s_('Profiles|Notification email')
+            .gl-display-flex.gl-justify-content-end.gl-align-items-flex-end.gl-flex-grow-1.gl-flex-wrap-wrap-reverse.gl-gap-3
               - unless email.confirmed?
                 - confirm_title = "#{email.confirmation_sent_at ? _('Resend confirmation email') : _('Send confirmation email')}"
-                = link_to confirm_title, resend_confirmation_instructions_profile_email_path(email), method: :put, class: 'gl-button btn btn-sm btn-default gl-ml-3'
+                = link_to confirm_title, resend_confirmation_instructions_profile_email_path(email), method: :put, class: 'gl-button btn btn-sm btn-default'
 
-              = link_to profile_email_path(email), data: { confirm: _('Are you sure?'), qa_selector: 'delete_email_link'}, method: :delete, class: 'gl-button btn btn-sm btn-danger gl-ml-3' do
+              = link_to profile_email_path(email), data: { confirm: _('Are you sure?'), qa_selector: 'delete_email_link'}, method: :delete, class: 'gl-button btn btn-sm btn-danger' do
                 %span.sr-only= _('Remove')
                 = sprite_icon('remove')
-          %ul
-            - if email.email === current_user.commit_email_or_default
-              %li= s_('Profiles|Commit email')
-            - if email.email === current_user.public_email
-              %li= s_('Profiles|Public email')
-            - if email.email === current_user.notification_email_or_default
-              %li= s_('Profiles|Notification email')
diff --git a/app/views/profiles/gpg_keys/_form.html.haml b/app/views/profiles/gpg_keys/_form.html.haml
index b3784faed28..9804a3b7735 100644
--- a/app/views/profiles/gpg_keys/_form.html.haml
+++ b/app/views/profiles/gpg_keys/_form.html.haml
@@ -1,6 +1,6 @@
 %div
   = form_for [:profile, @gpg_key], html: { class: 'js-requires-input' } do |f|
-    = form_errors(@gpg_key, pajamas_alert: true)
+    = form_errors(@gpg_key)
 
     .form-group
       = f.label :key, s_('Profiles|Key'), class: 'label-bold'
diff --git a/app/views/profiles/keys/_form.html.haml b/app/views/profiles/keys/_form.html.haml
index a749fbd1eec..6f7eb21b7e0 100644
--- a/app/views/profiles/keys/_form.html.haml
+++ b/app/views/profiles/keys/_form.html.haml
@@ -1,7 +1,7 @@
 - max_date = ::Gitlab::CurrentSettings.max_ssh_key_lifetime_from_now.to_date if ssh_key_expiration_policy_enabled?
 %div
   = form_for [:profile, @key], html: { class: 'js-requires-input' } do |f|
-    = form_errors(@key, pajamas_alert: true)
+    = form_errors(@key)
 
     .form-group
       = f.label :key, s_('Profiles|Key'), class: 'label-bold'
@@ -13,10 +13,12 @@
         = f.text_field :title, class: "form-control gl-form-input input-lg qa-key-title-field", required: true, placeholder: s_('Profiles|Example: MacBook key')
         %p.form-text.text-muted= s_('Profiles|Key titles are publicly visible.')
 
+    .form-row
       .col.form-group
-        = f.label :expires_at, s_('Profiles|Expiration date'), class: 'label-bold'
-        = f.date_field :expires_at, class: "form-control input-lg", min: Date.tomorrow, max: max_date, data: { qa_selector: 'key_expiry_date_field' }
-        %p.form-text.text-muted{ data: { qa_selector: 'key_expiry_date_field_description' } }= ssh_key_expires_field_description
+        .js-access-tokens-expires-at{ data: {min_date: Date.tomorrow, max_date: max_date, default_date_offset: 365, description: ssh_key_expires_field_description } }
+          = f.label :expires_at, s_('Profiles|Expiration date'), class: 'label-bold'
+          = f.text_field :expires_at, class: "gl-datepicker-input form-control gl-form-input", placeholder: 'YYYY-MM-DD', min: Date.tomorrow, max: max_date, data: { js_name: 'expiresAt' }
+          %p.form-text.text-muted= ssh_key_expires_field_description
 
     .js-add-ssh-key-validation-warning.hide
       .bs-callout.bs-callout-warning{ role: 'alert', aria_live: 'assertive' }
diff --git a/app/views/profiles/keys/_key.html.haml b/app/views/profiles/keys/_key.html.haml
index 178ed01c766..de4a19bdad7 100644
--- a/app/views/profiles/keys/_key.html.haml
+++ b/app/views/profiles/keys/_key.html.haml
@@ -16,7 +16,7 @@
         %span.gl-text-truncate.gl-sm-ml-3
           = key.fingerprint
 
-      .gl-mt-3= s_('Profiles|Created%{time_ago}'.html_safe) % { time_ago: time_ago_with_tooltip(key.created_at, html_class: 'gl-ml-2')}
+      .gl-mt-3= html_escape(s_('Profiles|Created%{time_ago}')) % { time_ago: time_ago_with_tooltip(key.created_at, html_class: 'gl-ml-2').html_safe}
 
       .key-list-item-dates
         %span.last-used-at.gl-mr-3
diff --git a/app/views/profiles/keys/_key_details.html.haml b/app/views/profiles/keys/_key_details.html.haml
index 8f7ccadd108..8016d989ff1 100644
--- a/app/views/profiles/keys/_key_details.html.haml
+++ b/app/views/profiles/keys/_key_details.html.haml
@@ -19,7 +19,7 @@
           %strong= @key.last_used_at.try(:to_s, :medium) || _('Never')
 
   .col-md-8
-    = form_errors(@key, type: 'key', pajamas_alert: true) unless @key.valid?
+    = form_errors(@key, type: 'key') unless @key.valid?
     %pre.well-pre
       = @key.key
     .card
diff --git a/app/views/profiles/notifications/_email_settings.html.haml b/app/views/profiles/notifications/_email_settings.html.haml
index b4db99a8bd4..c4de33dcd9e 100644
--- a/app/views/profiles/notifications/_email_settings.html.haml
+++ b/app/views/profiles/notifications/_email_settings.html.haml
@@ -1,6 +1,6 @@
 - form = local_assigns.fetch(:form)
 .form-group
-  = form.label :notification_email, class: "label-bold"
+  = form.label :notification_email, _('Notification Email'), class: "label-bold"
   = form.select :notification_email, @user.public_verified_emails, { include_blank: _('Use primary email (%{email})') % { email: @user.email }, selected: @user.notification_email }, class: "select2", disabled: local_assigns.fetch(:email_change_disabled, nil)
   .help-block
     = local_assigns.fetch(:help_text, nil)
diff --git a/app/views/profiles/notifications/show.html.haml b/app/views/profiles/notifications/show.html.haml
index 26c9b2f0ee1..0f4b130a774 100644
--- a/app/views/profiles/notifications/show.html.haml
+++ b/app/views/profiles/notifications/show.html.haml
@@ -25,7 +25,7 @@
       = gitlab_ui_form_for @user, url: profile_notifications_path, method: :put, html: { class: 'update-notifications gl-mt-3' } do |f|
         = render_if_exists 'profiles/notifications/email_settings', form: f
 
-      = label_tag :global_notification_level, "Global notification level", class: "label-bold"
+      = label_tag :global_notification_level, _('Global notification level'), class: "label-bold"
       %br
       .clearfix
       .form-group.float-left.global-notification-setting
diff --git a/app/views/profiles/passwords/edit.html.haml b/app/views/profiles/passwords/edit.html.haml
index 46ae602359f..257255eb4d7 100644
--- a/app/views/profiles/passwords/edit.html.haml
+++ b/app/views/profiles/passwords/edit.html.haml
@@ -15,7 +15,7 @@
       - else
         = _('Change your password or recover your current one')
     = form_for @user, url: profile_password_path, method: :put, html: {class: "update-password"} do |f|
-      = form_errors(@user, pajamas_alert: true)
+      = form_errors(@user)
 
       - unless @user.password_automatically_set?
         .form-group
diff --git a/app/views/profiles/passwords/new.html.haml b/app/views/profiles/passwords/new.html.haml
index 5bcc92dcdfd..6f260eb4cc0 100644
--- a/app/views/profiles/passwords/new.html.haml
+++ b/app/views/profiles/passwords/new.html.haml
@@ -9,7 +9,7 @@
     %br
     = _('After a successful password update you will be redirected to login screen.')
 
-  = form_errors(@user, pajamas_alert: true)
+  = form_errors(@user)
 
   - unless @user.password_automatically_set?
     .form-group.row
diff --git a/app/views/profiles/preferences/show.html.haml b/app/views/profiles/preferences/show.html.haml
index f8737a4e54a..e16108c5c22 100644
--- a/app/views/profiles/preferences/show.html.haml
+++ b/app/views/profiles/preferences/show.html.haml
@@ -1,4 +1,5 @@
 - page_title _('Preferences')
+- add_page_specific_style 'page_bundles/profiles/preferences'
 - @content_class = "limit-container-width" unless fluid_layout
 - user_theme_id = Gitlab::Themes.for_user(@user).id
 - user_color_schema_id = Gitlab::ColorSchemes.for_user(@user).id
@@ -77,10 +78,10 @@
           = s_('Preferences|Choose between fixed (max. 1280px) and fluid (%{percentage}) application layout.').html_safe % { percentage: '100%' }
       .form-group
         = f.label :dashboard, class: 'label-bold' do
-          = s_('Preferences|Homepage content')
+          = s_('Preferences|Dashboard')
         = f.select :dashboard, dashboard_choices, {}, class: 'select2'
         .form-text.text-muted
-          = s_('Preferences|Choose what content you want to see on your homepage.')
+          = s_('Preferences|Choose what content you want to see by default on your dashboard.')
 
       = render_if_exists 'profiles/preferences/group_overview_selector', f: f # EE-specific
 
diff --git a/app/views/profiles/show.html.haml b/app/views/profiles/show.html.haml
index a64968cdcbb..f38d6021b18 100644
--- a/app/views/profiles/show.html.haml
+++ b/app/views/profiles/show.html.haml
@@ -2,8 +2,6 @@
 - page_title s_("Profiles|Edit Profile")
 - @content_class = "limit-container-width" unless fluid_layout
 - gravatar_link = link_to Gitlab.config.gravatar.host, 'https://' + Gitlab.config.gravatar.host
-- availability = availability_values
-- custom_emoji = @user.status&.customized?
 
 = gitlab_ui_form_for @user, url: profile_path, method: :put, html: { multipart: true, class: 'edit-user js-edit-user gl-mt-3 js-quick-submit gl-show-field-errors js-password-prompt-form', remote: true }, authenticity_token: true do |f|
   .row.js-search-settings-section
@@ -43,39 +41,12 @@
       %h4.gl-mt-0= s_("Profiles|Current status")
       %p= s_("Profiles|This emoji and message will appear on your profile and throughout the interface.")
     .col-lg-8
-      = f.fields_for :status, @user.status do |status_form|
-        - emoji_button = render Pajamas::ButtonComponent.new(button_options: { title: s_("Profiles|Add status emoji"),
-            class: 'js-toggle-emoji-menu emoji-menu-toggle-button has-tooltip' } ) do
-          - if custom_emoji
-            = emoji_icon(@user.status.emoji, class: 'gl-mr-0!')
-          %span#js-no-emoji-placeholder.no-emoji-placeholder{ class: ('hidden' if custom_emoji) }
-            = sprite_icon('slight-smile', css_class: 'award-control-icon-neutral')
-            = sprite_icon('smiley', css_class: 'award-control-icon-positive')
-            = sprite_icon('smile', css_class: 'award-control-icon-super-positive')
-        - reset_message_button = render Pajamas::ButtonComponent.new(icon: 'close',
-          button_options: { id: 'js-clear-user-status-button',
-            class: 'has-tooltip',
-            title: s_("Profiles|Clear status") } )
-
-        = status_form.hidden_field :emoji, id: 'js-status-emoji-field'
-        .form-group.gl-form-group
-          = status_form.label :message, s_("Profiles|Your status")
-          .input-group{ role: 'group' }
-            .input-group-prepend
-              = emoji_button
-            = status_form.text_field :message,
-              id: 'js-status-message-field',
-              class: 'form-control gl-form-input input-lg',
-              placeholder: s_("Profiles|What's your status?")
-            .input-group-append
-              = reset_message_button
-        .form-group.gl-form-group
-          = status_form.gitlab_ui_checkbox_component :availability,
-            s_("Profiles|Busy"),
-            help_text: s_('Profiles|An indicator appears next to your name and avatar.'),
-            checkbox_options: { data: { testid: "user-availability-checkbox" } },
-            checked_value: availability["busy"],
-            unchecked_value: availability["not_set"]
+      #js-user-profile-set-status-form
+        = f.fields_for :status, @user.status do |status_form|
+          = status_form.hidden_field :emoji, data: { js_name: 'emoji' }
+          = status_form.hidden_field :message, data: { js_name: 'message' }
+          = status_form.hidden_field :availability, data: { js_name: 'availability' }
+          = status_form.hidden_field :clear_status_after, data: { js_name: 'clearStatusAfter' }
     .col-lg-12
       %hr
   .row.user-time-preferences.js-search-settings-section
diff --git a/app/views/profiles/two_factor_auths/show.html.haml b/app/views/profiles/two_factor_auths/show.html.haml
index c1eaa84e99d..855c73fd323 100644
--- a/app/views/profiles/two_factor_auths/show.html.haml
+++ b/app/views/profiles/two_factor_auths/show.html.haml
@@ -81,7 +81,7 @@
     .col-lg-8
       - registration = webauthn_enabled ? @webauthn_registration : @u2f_registration
       - if registration.errors.present?
-        = form_errors(registration, pajamas_alert: true)
+        = form_errors(registration)
       - if webauthn_enabled
         = render "authentication/register", target_path: create_webauthn_profile_two_factor_auth_path
       - else