Merge branch '271530-improve-user-menu' into 'master'

Improve user dropdown items

See merge request gitlab-org/gitlab!53175

app/assets/stylesheets/framework/header.scss

@@ -516,28 +516,8 @@
     left: auto;
     max-height: $dropdown-max-height-lg;
 
-    li.current-user {
-      padding: $dropdown-item-padding-y $dropdown-item-padding-x;
-
-      .user-name {
-        display: block;
-      }
-
     .user-status {
-        margin-right: 0;
       max-width: 240px;
-        font-size: $gl-font-size-small;
-
-        gl-emoji {
-          font-size: $gl-font-size-small;
-        }
-
-        .user-status-emoji {
-          gl-emoji {
-            font-size: $gl-font-size;
-          }
-        }
-      }
     }
 
     svg {

app/views/layouts/header/_current_user_dropdown.html.haml

@@ -2,18 +2,12 @@
 
 %ul
   %li.current-user
-    .user-name.gl-font-weight-bold
-      = current_user.name
-      - if current_user&.status && user_status_set_to_busy?(current_user.status)
-        %span.gl-font-weight-normal.gl-text-gray-500= s_("UserProfile|(Busy)")
-    = current_user.to_reference
-    - if current_user.status
-      .user-status.d-flex.align-items-center.gl-mt-2.has-tooltip{ title: current_user.status.message_html, data: { html: 'true', placement: 'bottom' } }
-        - if show_status_emoji?(current_user.status)
-          .user-status-emoji.d-flex.align-items-center
-            = emoji_icon current_user.status.emoji
-        %span.user-status-message.str-truncated
-          = current_user.status.message_html.html_safe
+    - if current_user_menu?(:profile)
+      = link_to current_user, class: 'gl-line-height-20!', data: { user: current_user.username, testid: 'user-profile-link' } do
+        = render 'layouts/header/current_user_dropdown_item'
+    - else
+      .gl-py-3.gl-px-4
+        = render 'layouts/header/current_user_dropdown_item'
   %li.divider
   - if can?(current_user, :update_user_status, current_user)
     %li
@@ -22,9 +16,6 @@
           = s_('SetStatusModal|Edit status')
         - else
           = s_('SetStatusModal|Set status')
-  - if current_user_menu?(:profile)
-    %li
-      = link_to s_("CurrentUser|Profile"), current_user, class: 'profile-link', data: { user: current_user.username }
   - if current_user_menu?(:start_trial)
     %li
       %a.trial-link{ href: trials_link_url }
@@ -32,7 +23,9 @@
         = emoji_icon('rocket')
   - if current_user_menu?(:settings)
     %li
-      = link_to s_("CurrentUser|Settings"), profile_path, data: { qa_selector: 'settings_link' }
+      = link_to s_("CurrentUser|Edit profile"), profile_path, data: { qa_selector: 'edit_profile_link' }
+    %li
+      = link_to s_("CurrentUser|Preferences"), profile_preferences_path
   = render_if_exists 'layouts/header/buy_pipeline_minutes', project: @project, namespace: @group
   = render_if_exists 'layouts/header/upgrade'
 

app/views/layouts/header/_current_user_dropdown_item.html.haml

+.gl-font-weight-bold
+  = current_user.name
+  - if current_user&.status && user_status_set_to_busy?(current_user.status)
+    %span.gl-font-weight-normal.gl-text-gray-500= s_("UserProfile|(Busy)")
+= current_user.to_reference
+- if current_user.status
+  .user-status.d-flex.align-items-center.gl-mt-2.gl-mr-0.gl-font-sm.has-tooltip{ title: current_user.status.message_html, data: { html: 'true', placement: 'bottom' } }
+    - if show_status_emoji?(current_user.status)
+      .user-status-emoji.d-flex.align-items-center
+        = emoji_icon current_user.status.emoji
+    %span.user-status-message.str-truncated
+      = current_user.status.message_html.html_safe

changelogs/unreleased/271530-improve-user-menu.yml

+---
+title: Improve user dropdown items
+merge_request: 53175
+author:
+type: changed

doc/README.md

@@ -80,7 +80,7 @@ Learn more about GitLab account management:
 |:-----------------------------------------------------------|:------------|
 | [User account](user/profile/index.md)                      | Manage your account. |
 | [Authentication](topics/authentication/index.md)           | Account security with two-factor authentication, set up your SSH keys, and deploy keys for secure access to your projects. |
-| [Profile settings](user/profile/index.md#profile-settings) | Manage your profile settings, two factor authentication, and more. |
+| [User settings](user/profile/index.md#user-settings) | Manage your user settings, two factor authentication, and more. |
 | [User permissions](user/permissions.md)                    | Learn what each role in a project can do. |
 
 ### Git and GitLab

doc/administration/troubleshooting/debug.md

@@ -235,7 +235,7 @@ separate Rails process to debug the issue:
 
 1. Log in to your GitLab account.
 1. Copy the URL that is causing problems (e.g. `https://gitlab.com/ABC`).
-1. Create a Personal Access Token for your user (Profile Settings -> Access Tokens).
+1. Create a Personal Access Token for your user (User Settings -> Access Tokens).
 1. Bring up the [GitLab Rails console.](../operations/rails_console.md#starting-a-rails-console-session)
 1. At the Rails console, run:
 

doc/api/avatar.md

@@ -10,7 +10,7 @@ info: To determine the technical writer assigned to the Stage/Group associated w
 
 ## Get a single avatar URL
 
-Get a single [avatar](../user/profile/index.md#profile-settings) URL for a user with the given email address.
+Get a single [avatar](../user/profile/index.md#user-settings) URL for a user with the given email address.
 
 If:
 

doc/integration/github.md

@@ -179,7 +179,9 @@ If you're getting the message `Signing in using your GitHub account without a pr
 GitLab account is not allowed. Create a GitLab account first, and then connect it to your
 GitHub account` when signing in, in GitLab:
 
-1. Go to your **Profile > Account**.
-1. Under the "Social sign-in" section, click **Connect** near the GitHub icon.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Account**.
+1. In the **Social sign-in** section, select **Connect to GitHub**.
 
 After that, you should be able to sign in via GitHub successfully.

doc/integration/gitlab.md

@@ -12,11 +12,9 @@ To enable the GitLab.com OmniAuth provider you must register your application wi
 GitLab.com generates an application ID and secret key for you to use.
 
 1. Sign in to GitLab.com.
-
-1. On the upper right corner, click on your avatar and go to your **Settings**.
-
-1. Select **Applications** in the left menu.
-
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Applications**.
 1. Provide the required details for **Add new application**.
    - Name: This can be anything. Consider something like `<Organization>'s GitLab` or `<Your Name>'s GitLab` or something else descriptive.
    - Redirect URI:
@@ -29,10 +27,8 @@ GitLab.com generates an application ID and secret key for you to use.
    The first link is required for the importer and second for the authorization.
 
 1. Select **Save application**.
-
 1. You should now see an **Application ID** and **Secret**. Keep this page open as you continue
    configuration.
-
 1. On your GitLab server, open the configuration file.
 
    For Omnibus package:
@@ -50,10 +46,9 @@ GitLab.com generates an application ID and secret key for you to use.
    ```
 
 1. See [Initial OmniAuth Configuration](omniauth.md#initial-omniauth-configuration) for initial settings.
-
 1. Add the provider configuration:
 
-   For Omnibus package:
+   For Omnibus installations:
 
    ```ruby
    gitlab_rails['omniauth_providers'] = [
@@ -76,16 +71,13 @@ GitLab.com generates an application ID and secret key for you to use.
    ```
 
 1. Change `'YOUR_APP_ID'` to the Application ID from the GitLab.com application page.
-
 1. Change `'YOUR_APP_SECRET'` to the secret from the GitLab.com application page.
-
 1. Save the configuration file.
-
 1. Based on how GitLab was installed, implement these changes by using
    the appropriate method:
 
-   - Omnibus GitLab: [Reconfigure GitLab](../administration/restart_gitlab.md#omnibus-gitlab-reconfigure).
-   - Source: [Restart GitLab](../administration/restart_gitlab.md#installations-from-source).
+   - Omnibus GitLab: [reconfigure GitLab](../administration/restart_gitlab.md#omnibus-gitlab-reconfigure).
+   - Source: [restart GitLab](../administration/restart_gitlab.md#installations-from-source).
 
 On the sign-in page, there should now be a GitLab.com icon following the
 regular sign-in form. Select the icon to begin the authentication process.

doc/integration/gitpod.md

@@ -33,7 +33,9 @@ To learn more about Gitpod, see their [features](https://www.gitpod.io/features/
 
 With the Gitpod integration enabled for your GitLab instance, to enable it for yourself:
 
-1. Select your avatar in the top-right corner, then select **Settings > Preferences**.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Account**.
 1. Under **Integrations**, locate the **Gitpod** section.
 1. Check the **Enable Gitpod integration** checkbox and select the **Save changes** button.
 

doc/integration/jenkins.md

@@ -70,9 +70,10 @@ Grant a GitLab user access to the select GitLab projects.
 
 Create a personal access token to authorize Jenkins' access to GitLab.
 
-1. Log in to GitLab as the user to be used with Jenkins.
-1. Click your avatar, then **Settings**.
-1. Click **Access Tokens** in the sidebar.
+1. Sign in to GitLab as the user to be used with Jenkins.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Access Tokens**.
 1. Create a personal access token with the **API** scope checkbox checked. For more details, see
    [Personal access tokens](../user/profile/personal_access_tokens.md).
 1. Record the personal access token's value, because it's required in [Configure the Jenkins server](#configure-the-jenkins-server) section.

doc/integration/jira_development_panel.md

@@ -77,10 +77,10 @@ To ensure that regular user account maintenance doesn't impact your integration,
 create and use a single-purpose `jira` user in GitLab.
 
 1. In GitLab, create a new application to allow Jira to connect with your GitLab account.
-
 1. Sign in to the GitLab account that you want Jira to use to connect to GitLab.
-1. In the top right corner, click your profile avatar.
-1. Click **Settings > Applications** to display the form to create a new application.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Applications**.
 1. In the **Name** field, enter a descriptive name for the integration, such as `Jira`.
 1. In the **Redirect URI** field, enter `https://<gitlab.example.com>/login/oauth/callback`,
    replacing `<gitlab.example.com>` with your GitLab instance domain. For example, if you are using GitLab.com,
@@ -94,8 +94,7 @@ create and use a single-purpose `jira` user in GitLab.
 
    ![GitLab application setup](img/jira_dev_panel_gl_setup_1.png)
 
-1. Check **API** in the Scopes section, and uncheck any other checkboxes.
-
+1. Check **API** in the **Scopes** section, and clear any other checkboxes.
 1. Click **Save application**. GitLab displays the generated **Application ID**
    and **Secret** values. Copy these values, which you use in Jira.
 

doc/integration/kerberos.md

@@ -115,9 +115,10 @@ existing GitLab account. To do so:
 
 If you're not an administrator:
 
-1. Select your avatar in the upper-right corner, and select **Settings**.
-1. Select Account. In the **Social sign-in** section, select
-   **Connect Kerberos SPNEGO**.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Account**.
+1. In the **Social sign-in** section, select **Connect Kerberos SPNEGO**.
    If you don't see a **Social sign-in** Kerberos option, follow the
    requirements in [Enable single sign-on](#enable-single-sign-on).
 

doc/integration/oauth_provider.md

@@ -43,16 +43,17 @@ levels. The default callback URL is `http://your-gitlab.example.com/users/auth/g
 
 ## Add an application through the profile
 
-To add a new application via your profile, select your avatar in the top right, and then select
-**Settings > Applications**. You can then enter a **Name**, **Redirect URI** and
-OAuth 2 scopes as defined in [Authorized Applications](#authorized-applications).
+To add a new application via your profile:
 
-- The **Redirect URI** is the URL where users are sent after they authorize with GitLab.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Applications**.
+1. Enter a **Name**, **Redirect URI** and OAuth 2 scopes as defined in [Authorized Applications](#authorized-applications).
+   The **Redirect URI** is the URL where users are sent after they authorize with GitLab.
+1. Select **Save application**. GitLab displays:
 
-When you select **Save application**, GitLab displays:
-
-- Application ID: OAuth 2 Client ID.
-- Secret: OAuth 2 Client Secret.
+   - Application ID: OAuth 2 Client ID.
+   - Secret: OAuth 2 Client Secret.
 
 ## OAuth applications in the Admin Area
 

doc/integration/omniauth.md

@@ -138,9 +138,10 @@ provider such as Twitter can be enabled. Follow the steps below to enable an
 OmniAuth provider for an existing user.
 
 1. Sign in normally - whether standard sign in, LDAP, or another OmniAuth provider.
-1. Go to profile settings (the silhouette icon in the top right corner).
-1. Select the "Account" tab.
-1. Under "Connected Accounts" select the desired OmniAuth provider, such as Twitter.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Account**.
+1. In the **Connected Accounts** section, select the desired OmniAuth provider, such as Twitter.
 1. The user is redirected to the provider. After the user authorizes GitLab,
    they are redirected back to GitLab.
 

doc/integration/sourcegraph.md

@@ -87,9 +87,12 @@ You can skip this step if you already have your GitLab repositories searchable i
 
 If a GitLab administrator has enabled Sourcegraph, you can enable this feature in your user preferences.
 
-1. In GitLab, click your avatar in the top-right corner, then click **Settings**. On the left-hand nav, click **Preferences**.
-1. Under **Integrations**, find the **Sourcegraph** section.
-1. Check **Enable Sourcegraph**.
+In GitLab:
+
+1. In the top-right corner, select your avatar.
+1. Select **Preferences**.
+1. In the **Integrations** section, select the checkbox under **Sourcegraph**.
+1. Select **Save changes**.
 
 ![Sourcegraph user preferences](img/sourcegraph_user_preferences_v12_5.png)
 

doc/integration/trello_power_up.md

@@ -38,8 +38,11 @@ If your instance's URL is `https://example.com`, your API URL is `https://exampl
 Your GitLab personal access token enables your GitLab account to be accessed
 from Trello.
 
-> Find it in GitLab by clicking on your avatar (upright corner), from which you access
-your user **Settings** > **Access Tokens**.
+To find it in GitLab:
+
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Access Tokens**.
 
 Learn more about generating a personal access token in the
 [Personal Access Token Documentation](../user/profile/personal_access_tokens.md).

doc/integration/vault.md

@@ -18,12 +18,15 @@ The following assumes you already have Vault installed and running.
 
 1. **Get the OpenID Connect client ID and secret from GitLab:**
 
-   First you must create a GitLab application to obtain an application ID and secret for authenticating into Vault. To do this, sign in to GitLab and follow these steps:
-
-   1. On GitLab, click your avatar on the top-right corner, and select your user **Settings > Applications**.
-   1. Fill out the application **Name** and [**Redirect URI**](https://www.vaultproject.io/docs/auth/jwt#redirect-uris),
-      making sure to select the **OpenID** scope.
-   1. Save application.
+   First you must create a GitLab application to obtain an application ID and secret for authenticating into Vault.
+   To do this, sign in to GitLab and follow these steps:
+
+   1. In the top-right corner, select your avatar.
+   1. Select **Edit profile**.
+   1. In the left sidebar, select **Applications**.
+   1. Fill out the application **Name** and [**Redirect URI**](https://www.vaultproject.io/docs/auth/jwt#redirect-uris).
+   1. Select the **OpenID** scope.
+   1. Select **Save application**.
    1. Copy client ID and secret, or keep the page open for reference.
 
    ![GitLab OAuth provider](img/gitlab_oauth_vault_v12_6.png)

doc/raketasks/features.md

@@ -15,7 +15,13 @@ This command enables the namespaces feature introduced in GitLab 4.0. It moves e
 The **repository location changes as part of this task**, so you must **update all your Git URLs** to
 point to the new location.
 
-The username can be changed at **Profile > Account**.
+To change your username:
+
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Account**.
+1. In the **Change username** section, type the new username.
+1. Select **Update username**.
 
 For example:
 

doc/ssh/README.md

@@ -182,8 +182,9 @@ Now you can copy the SSH key you created to your GitLab account.
    If you're using an RSA key, substitute accordingly.
 
 1. Navigate to `https://gitlab.com` or your local GitLab instance URL and sign in.
-1. Select your avatar in the upper right corner, and click **Settings**
-1. Click **SSH Keys**.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **SSH Keys**.
 1. Paste the public key that you copied into the **Key** text box.
 1. Make sure your key includes a descriptive name in the **Title** text box, such as _Work Laptop_ or
    _Home Workstation_.

doc/subscriptions/gitlab_com/index.md

@@ -93,7 +93,7 @@ The **Seat usage** page lists all users occupying seats. Details for each user i
 
 - Full name
 - Username
-- Public email address (if they have provided one in their [profile settings](../../user/profile/index.md#profile-settings))
+- Public email address (if they have provided one in their [user settings](../../user/profile/index.md#user-settings))
 
 The Seat usage listing is updated live, but the usage statistics on the billing page are updated
 only once per day. For this reason there can be a minor difference between the seat usage listing
@@ -247,8 +247,11 @@ Quotas apply to:
   subgroups, and nested projects. To view the group's usage, navigate to the group,
   then **Settings > Usage Quotas**.
 - Your personal account, where the minutes are available for your personal projects.
-  To view and buy personal minutes, click your avatar, then
-  **Settings > [Usage Quotas](https://gitlab.com/profile/usage_quotas#pipelines-quota-tab)**.
+  To view and buy personal minutes:
+
+  1. In the top-right corner, select your avatar.
+  1. Select **Edit profile**.
+  1. In the left sidebar, select **[Usage Quotas](https://gitlab.com/profile/usage_quotas#pipelines-quota-tab)**.
 
 Only pipeline minutes for GitLab shared runners are restricted. If you have a
 specific runner set up for your projects, there is no limit to your build time on GitLab SaaS.
@@ -282,10 +285,12 @@ To purchase additional minutes for your group on GitLab SaaS:
 
 To purchase additional minutes for your personal namespace:
 
-1. Click your avatar, then go to **Settings > Usage Quotas**.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Usage Quotas**.
 1. Select **Buy additional minutes** and GitLab redirects you to the Customers Portal.
 1. Locate the subscription card that's linked to your personal namespace on GitLab SaaS, click **Buy more CI minutes**, and complete the details about the transaction. Once we have processed your payment, the extra CI minutes are synced to your personal namespace.
-1. To confirm the available CI minutes for your personal projects, click your avatar, then go to **Settings > Usage Quotas**.
+1. To confirm the available CI minutes for your personal projects, go to the **Usage Quotas** settings again.
 
    The **Additional minutes** displayed now includes the purchased additional CI minutes, plus any minutes rolled over from last month.
 

doc/user/group/saml_sso/index.md

@@ -22,7 +22,7 @@ SAML SSO is not supported at the subgroup level.
 
 ## Configuring your Identity Provider
 
-1. Navigate to the group and click **Settings > SAML SSO**.
+1. Navigate to the group and select **Settings > SAML SSO**.
 1. Configure your SAML server using the **Assertion consumer service URL**, **Identifier**, and **GitLab single sign-on URL**. Alternatively GitLab provides [metadata XML configuration](#metadata-configuration). See [specific identity provider documentation](#providers) for more details.
 1. Configure the SAML response to include a NameID that uniquely identifies each user.
 1. Configure [required assertions](group_managed_accounts.md#assertions) if using [Group Managed Accounts](group_managed_accounts.md).
@@ -57,7 +57,7 @@ We recommend setting the NameID format to `Persistent` unless using a field (suc
 
 GitLab provides metadata XML that can be used to configure your Identity Provider.
 
-1. Navigate to the group and click **Settings > SAML SSO**.
+1. Navigate to the group and select **Settings > SAML SSO**.
 1. Copy the provided **GitLab metadata URL**.
 1. Follow your Identity Provider's documentation and paste the metadata URL when it's requested.
 
@@ -69,8 +69,8 @@ After you set up your identity provider to work with GitLab, you must configure
 1. Find the SSO URL from your Identity Provider and enter it the **Identity provider single sign-on URL** field.
 1. Find and enter the fingerprint for the SAML token signing certificate in the **Certificate** field.
 1. Select the access level to be applied to newly added users in the **Default membership role** field. The default access level is 'Guest'.
-1. Click the **Enable SAML authentication for this group** toggle switch.
-1. Click the **Save changes** button.
+1. Select the **Enable SAML authentication for this group** toggle switch.
+1. Select the **Save changes** button.
 
 ![Group SAML Settings for GitLab.com](img/group_saml_settings_v13_3.png)
 
@@ -216,7 +216,7 @@ To link SAML to your existing GitLab.com account:
 
 1. Sign in to your GitLab.com account.
 1. Locate and visit the **GitLab single sign-on URL** for the group you're signing in to. A group owner can find this on the group's **Settings > SAML SSO** page. If the sign-in URL is configured, users can connect to the GitLab app from the Identity Provider.
-1. Click **Authorize**.
+1. Select **Authorize**.
 1. Enter your credentials on the Identity Provider if prompted.
 1. You are then redirected back to GitLab.com and should now have access to the group. In the future, you can use SAML to sign in to GitLab.com.
 
@@ -225,7 +225,7 @@ On subsequent visits, you should be able to go [sign in to GitLab.com with SAML]
 ### Signing in to GitLab.com with SAML
 
 1. Sign in to your identity provider.
-1. From the list of apps, click on the "GitLab.com" app (The name is set by the administrator of the identity provider).
+1. From the list of apps, select the "GitLab.com" app. (The name is set by the administrator of the identity provider.)
 1. You are then signed in to GitLab.com and redirected to the group.
 
 ### Configure user settings from SAML response
@@ -293,10 +293,15 @@ Users can unlink SAML for a group from their profile page. This can be helpful i
 - Your SAML NameID has changed and so GitLab can no longer find your user.
 
 WARNING:
-Unlinking an account removes all roles assigned to that user within the group.
+Unlinking an account removes all roles assigned to that user in the group.
 If a user re-links their account, roles need to be reassigned.
 
-For example, to unlink the `MyOrg` account, the following **Disconnect** button is available under **Profile > Accounts**:
+For example, to unlink the `MyOrg` account:
+
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Account**.
+1. In the **Social sign-in** section, select **Disconnect** next to the connected account.
 
 ![Unlink Group SAML](img/unlink_group_saml.png)
 

doc/user/profile/account/delete_account.md

@@ -17,20 +17,21 @@ Deleting a user will delete all projects in that user namespace.
 
 ## As a user
 
-As a user, you can delete your own account by:
+As a user, to delete your own account:
 
-1. Clicking on your avatar.
-1. Navigating to **Settings > Account**.
-1. Selecting **Delete account**.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Account**.
+1. Select **Delete account**.
 
 ## As an administrator
 
-As an administrator, you can delete a user account by:
+As an administrator, to delete a user account:
 
-1. Navigating to **Admin Area > Overview > Users**.
-1. Selecting a user.
-1. Under the **Account** tab, clicking:
-   - **Delete user** to delete only the user but maintaining their
+1. Go to **Admin Area > Overview > Users**.
+1. Select a user.
+1. Under the **Account** tab, select:
+   - **Delete user** to delete only the user but maintain their
      [associated records](#associated-records).
    - **Delete user and contributions** to delete the user and
      their associated records.

doc/user/profile/account/index.md

 ---
-redirect_to: '../index.md#profile-settings'
+redirect_to: '../index.md#user-settings'
 ---
 
-This document was moved to [../index.md#profile-settings](../index.md#profile-settings).
+This document was moved to [../index.md#user-settings](../index.md#user-settings).
 
 <!-- This redirect file can be deleted after February 1, 2021. -->
 <!-- Before deletion, see: https://docs.gitlab.com/ee/development/documentation/#move-or-rename-a-page -->

doc/user/profile/account/two_factor_authentication.md

@@ -44,7 +44,7 @@ To enable 2FA:
 
 1. **In GitLab:**
    1. Sign in to your GitLab account.
-   1. Go to your [**Profile settings**](../index.md#profile-settings).
+   1. Go to your [**User settings**](../index.md#user-settings).
    1. Go to **Account**.
    1. Select **Enable Two-factor Authentication**.
 1. **On your device (usually your phone):**
@@ -246,7 +246,7 @@ Search for `security.webauth.u2f` and double click on it to toggle to `true`.
 To set up 2FA with a U2F device:
 
 1. Sign in to your GitLab account.
-1. Go to your [**Profile settings**](../index.md#profile-settings).
+1. Go to your [**User settings**](../index.md#user-settings).
 1. Go to **Account**.
 1. Click **Enable Two-Factor Authentication**.
 1. Connect your U2F device.
@@ -282,7 +282,7 @@ and the following mobile browsers:
 To set up 2FA with a WebAuthn compatible device:
 
 1. Sign in to your GitLab account.
-1. Go to your [**Profile settings**](../index.md#profile-settings).
+1. Go to your [**User settings**](../index.md#user-settings).
 1. Go to **Account**.
 1. Select **Enable Two-Factor Authentication**.
 1. Plug in your WebAuthn device.
@@ -349,7 +349,7 @@ request and you're automatically signed in.
 If you ever need to disable 2FA:
 
 1. Sign in to your GitLab account.
-1. Go to your [**Profile settings**](../index.md#profile-settings).
+1. Go to your [**User settings**](../index.md#user-settings).
 1. Go to **Account**.
 1. Click **Disable**, under **Two-Factor Authentication**.
 
@@ -434,7 +434,7 @@ a new set of recovery codes with SSH:
    When prompted for a two-factor code, enter one of the recovery codes obtained
    from the command-line output.
 
-After signing in, visit your **Profile settings > Account**  immediately to set
+After signing in, visit your **User settings > Account**  immediately to set
 up two-factor authentication with a new device.
 
 ### Regenerate 2FA recovery codes
@@ -443,8 +443,8 @@ To regenerate 2FA recovery codes, you need access to a desktop browser:
 
 1. Navigate to GitLab.
 1. Sign in to your GitLab account.
-1. Go to your [**Profile settings**](../index.md#profile-settings).
-1. Select **{account}** **Account > Two-Factor Authentication (2FA)**.
+1. Go to your [**User settings**](../index.md#user-settings).
+1. Select **Account > Two-Factor Authentication (2FA)**.
 1. If you've already configured 2FA, click **Manage two-factor authentication**.
 1. In the **Register Two-Factor Authenticator** pane, click **Regenerate recovery codes**.
 

doc/user/profile/active_sessions.md

@@ -14,9 +14,11 @@ review the sessions, and revoke any you don't recognize.
 
 ## Listing all active sessions
 
-1. Click your avatar.
-1. Select **Settings**.
-1. Click **Active Sessions** in the sidebar.
+To list all active sessions:
+
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Active Sessions**.
 
 ![Active sessions list](img/active_sessions_list.png)
 
@@ -29,8 +31,12 @@ exceeds 100, the oldest ones are deleted.
 
 ## Revoking a session
 
-1. Use the previous steps to navigate to **Active Sessions**.
-1. Click on **Revoke** besides a session. The current session cannot be revoked, as this would sign you out of GitLab.
+To revoke an active session:
+
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Active Sessions**.
+1. Select **Revoke** next to a session. The current session cannot be revoked, as this would sign you out of GitLab.
 
 NOTE:
 When any session is revoked all **Remember me** tokens for all

doc/user/profile/personal_access_tokens.md

@@ -33,13 +33,14 @@ You can create as many personal access tokens as you like from your GitLab
 profile.
 
 1. Sign in to GitLab.
-1. In the upper-right corner, click your avatar and select **Settings**.
-1. On the  **User Settings** menu, select **Access Tokens**.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **Access Tokens**.
 1. Choose a name and optional expiry date for the token.
 1. Choose the [desired scopes](#limiting-scopes-of-a-personal-access-token).
-1. Click the **Create personal access token** button.
+1. Select **Create personal access token**.
 1. Save the personal access token somewhere safe. If you navigate away or refresh
-your page, and you did not save the token, you must create a new one.
+   your page, and you did not save the token, you must create a new one.
 
 ### Revoking a personal access token
 

doc/user/profile/preferences.md

@@ -12,9 +12,8 @@ of GitLab to their liking.
 
 To navigate to your profile's preferences:
 
-1. Click your avatar.
-1. Select **Settings**.
-1. Click **Preferences** in the sidebar.
+1. In the top-right corner, select your avatar.
+1. Select **Preferences**.
 
 ## Navigation theme
 
@@ -36,8 +35,7 @@ The default theme is Indigo. You can choose between 10 themes:
 - Light Red
 - Dark
 - Light
-
-![Profile preferences navigation themes](img/profil-preferences-navigation-theme.png)
+- [Dark Mode](#dark-mode)
 
 ## Dark mode
 
@@ -47,7 +45,8 @@ GitLab has started work on dark mode! The dark mode Alpha release is available i
 spirit of iteration and the lower expectations of
 [Alpha versions](https://about.gitlab.com/handbook/product/gitlab-the-product/#alpha).
 
-Progress on dark mode is tracked in the [Dark theme epic](https://gitlab.com/groups/gitlab-org/-/epics/2902). See the epic for:
+Progress on dark mode is tracked in the [Dark theme epic](https://gitlab.com/groups/gitlab-org/-/epics/2902).
+See the epic for:
 
 - A list of known issues.
 - Our planned direction and next steps.
@@ -60,14 +59,15 @@ the future, we plan to make it configurable in its own section along with suppor
 [different navigation themes](https://gitlab.com/gitlab-org/gitlab/-/issues/219512).
 
 NOTE:
-Dark theme currently only works with the 'Dark' syntax highlighting.
+Dark theme only works with the **Dark** syntax highlighting theme.
 
 ## Syntax highlighting theme
 
 NOTE:
 GitLab uses the [rouge Ruby library](http://rouge.jneen.net/ "Rouge website")
 for syntax highlighting outside of any Editor context. The WebIDE (like Snippets)
-uses [Monaco Editor](https://microsoft.github.io/monaco-editor/) and it's provided [Monarch](https://microsoft.github.io/monaco-editor/monarch.html) library for
+uses [Monaco Editor](https://microsoft.github.io/monaco-editor/) and it's provided
+[Monarch](https://microsoft.github.io/monaco-editor/monarch.html) library for
 syntax highlighting. For a list of supported languages, visit the documentation of
 the respective libraries.
 
@@ -121,7 +121,7 @@ You have 8 options here that you can use for your default dashboard view:
 - Your projects' activity
 - Starred projects' activity
 - Your groups
-- Your [to-dos](../todos.md)
+- Your [To-Do List](../todos.md)
 - Assigned Issues
 - Assigned Merge Requests
 - Operations Dashboard **(PREMIUM)**

doc/user/project/integrations/overview.md

@@ -13,7 +13,7 @@ functionality to GitLab.
 ## Accessing integrations
 
 You can find the available integrations under your project's
-**Settings ➔ Integrations** page.
+**Settings > Integrations** page.
 
 There are more than 20 integrations to integrate with. Click on the one that you
 want to configure.

doc/user/project/issues/issue_data_and_actions.md

@@ -201,7 +201,7 @@ issue's description are listed in the [issue history](#issue-history). **(PREMIU
 
 You can mention a user or a group present in your GitLab instance with `@username` or
 `@groupname`. All mentioned users are notified via to-do items and emails,
-unless they have disabled all notifications in their profile settings.
+unless they have disabled all [notifications](#notifications) in their user settings.
 This is controlled in the [notification settings](../../profile/notifications.md).
 
 Mentions for yourself (the current logged in user) are highlighted
@@ -245,8 +245,8 @@ Also:
 
 - You can mention a user or a group present in your GitLab instance with
   `@username` or `@groupname` and they are notified via to-do items
-  and emails, unless they have [disabled all notifications](#notifications)
-  in their profile settings.
+  and emails, unless they have disabled all [notifications](#notifications)
+  in their user settings.
 - Mentions for yourself (the current logged-in user) are highlighted
   in a different color, which allows you to quickly see which comments involve you.
 

doc/user/project/merge_requests/reviewing_and_managing_merge_requests.md

@@ -82,11 +82,10 @@ Click **Expand file** on any file to view the changes for that file.
 
 For larger merge requests, consider reviewing one file at a time. To enable this feature:
 
-1. In the top right corner of the navigation bar, click your user avatar.
-1. Click **Settings**.
-1. In the left sidebar, go to **Preferences**.
+1. In the top-right corner, select your avatar.
+1. Select **Preferences**.
 1. Scroll to the **Behavior** section and select **Show one file at a time on merge request's Changes tab**.
-1. Click **Save changes** to apply.
+1. Select **Save changes**.
 
 After you enable this setting, GitLab displays only one file at a time in the **Changes** tab when you review merge requests. You can click **Prev** and **Next** to view other changed files.
 
@@ -97,7 +96,7 @@ this behavior, you can do so from your **User preferences** (as explained above)
 merge request:
 
 1. Go to the merge request's **Changes** tab.
-1. Click the cog icon (**{settings}**) to reveal the merge request's settings dropdown.
+1. Select the cog icon (**{settings}**) to reveal the merge request's settings dropdown.
 1. Select or deselect the checkbox **Show one file at a time** to change the setting accordingly.
 
 This change overrides the choice you made in your user preferences and persists until you clear your
@@ -109,11 +108,11 @@ browser's cookies or change this behavior again.
 
 To seamlessly navigate among commits in a merge request:
 
-1. Click the **Commits** tab.
-1. Click a commit to open it in the single-commit view.
+1. Select the **Commits** tab.
+1. Select a commit to open it in the single-commit view.
 1. Navigate through the commits by either:
 
-   - Clicking **Prev** and **Next** buttons on the top-right of the page.
+   - Selecting **Prev** and **Next** buttons on the top-right of the page.
    - Using the <kbd>X</kbd> and <kbd>C</kbd> keyboard shortcuts.
 
 ![Merge requests commit navigation](img/commit_nav_v13_4.png)

doc/user/project/repository/gpg_signed_commits/index.md

@@ -138,27 +138,25 @@ started:
    gpg --armor --export 30F2B65B9246B6CA
    ```
 
-1. Finally, copy the public key and [add it in your profile settings](#adding-a-gpg-key-to-your-account)
+1. Finally, copy the public key and [add it in your user settings](#adding-a-gpg-key-to-your-account)
 
 ## Adding a GPG key to your account
 
 NOTE:
-Once you add a key, you cannot edit it, only remove it. In case the paste
-didn't work, you'll have to remove the offending key and re-add it.
+After you add a key, you cannot edit it, only remove it. In case the paste
+didn't work, you have to remove the offending key and re-add it.
 
-You can add a GPG key in your profile's settings:
+You can add a GPG key in your user settings:
 
-1. On the upper right corner, click on your avatar and go to your **Settings**.
-
-   ![Settings dropdown](../../../profile/img/profile_settings_dropdown.png)
-
-1. Navigate to the **GPG keys** tab and paste your _public_ key in the 'Key'
-   box.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **GPG Keys**.
+1. Paste your _public_ key in the **Key** text box.
 
    ![Paste GPG public key](img/profile_settings_gpg_keys_paste_pub.png)
 
-1. Finally, click on **Add key** to add it to GitLab. You will be able to see
-   its fingerprint, the corresponding email address and creation date.
+1. Select **Add key** to add it to GitLab. You can see the key's fingerprint, the corresponding
+   email address, and creation date.
 
    ![GPG key single page](img/profile_settings_gpg_keys_single_key.png)
 
@@ -248,22 +246,24 @@ in case your key has been compromised.
 
 To revoke a GPG key:
 
-1. On the upper right corner, click on your avatar and go to your **Settings**.
-1. Navigate to the **GPG keys** tab.
-1. Click on **Revoke** besides the GPG key you want to delete.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **GPG Keys**.
+1. Select **Revoke** next to the GPG key you want to delete.
 
 ## Removing a GPG key
 
 Removing a key **does not unverify** already signed commits. Commits that were
-verified by using this key will stay verified. Only unpushed commits will stay
-unverified once you remove this key. To unverify already signed commits, you need
+verified by using this key stay verified. Only unpushed commits stay
+unverified after you remove this key. To unverify already signed commits, you need
 to [revoke the associated GPG key](#revoking-a-gpg-key) from your account.
 
 To remove a GPG key from your account:
 
-1. On the upper right corner, click on your avatar and go to your **Settings**.
-1. Navigate to the **GPG keys** tab.
-1. Click on the trash icon besides the GPG key you want to delete.
+1. In the top-right corner, select your avatar.
+1. Select **Edit profile**.
+1. In the left sidebar, select **GPG Keys**.
+1. Select the trash icon (**{remove}**) next to the GPG key you want to delete.
 
 ## Rejecting commits that are not signed **(PREMIUM)**
 

doc/user/upgrade_email_bypass.md

@@ -116,7 +116,7 @@ LDAP Users remain confirmed if all of the following conditions are met:
 
 - The ["User email confirmation at sign-up" option](../security/user_email_confirmation.md) is set to false.
 - The first sign-in is based on user LDAP credentials.
-- The user has added and verified [a secondary email address](profile/index.md#profile-settings) some time later.
+- The user has added and verified [a secondary email address](profile/index.md#user-settings) some time later.
 
 NOTE:
 Confirmation timestamps (primary vs. secondary) are different.
@@ -124,6 +124,6 @@ Confirmation timestamps (primary vs. secondary) are different.
 Users remain unconfirmed by the background migration if any of the following conditions are met:
 
 - They [create an account through GitLab](profile/account/create_accounts.md).
-- They [swap their primary email address](profile/index.md#profile-settings) and verify it.
+- They [swap their primary email address](profile/index.md#user-settings) and verify it.
 - If they have two email addresses with the same `confirmed_at` timestamp due to the linked [security issue](https://gitlab.com/gitlab-org/gitlab/-/issues/121664).
 - [LDAP is introduced](../administration/auth/ldap/index.md), and users' primary email address matches that in LDAP.

locale/gitlab.pot

@@ -8664,13 +8664,13 @@ msgstr ""
 msgid "CurrentUser|Buy Pipeline minutes"
 msgstr ""
 
-msgid "CurrentUser|One of your groups is running out"
+msgid "CurrentUser|Edit profile"
 msgstr ""
 
-msgid "CurrentUser|Profile"
+msgid "CurrentUser|One of your groups is running out"
 msgstr ""
 
-msgid "CurrentUser|Settings"
+msgid "CurrentUser|Preferences"
 msgstr ""
 
 msgid "CurrentUser|Start an Ultimate trial"

qa/qa/page/main/menu.rb

@@ -6,7 +6,7 @@ module QA
       class Menu < Page::Base
         view 'app/views/layouts/header/_current_user_dropdown.html.haml' do
           element :sign_out_link
-          element :settings_link
+          element :edit_profile_link
         end
 
         view 'app/views/layouts/header/_default.html.haml' do
@@ -115,10 +115,10 @@ module QA
           sign_out if signed_in?
         end
 
-        def click_settings_link
+        def click_edit_profile_link
           retry_until(reload: false) do
             within_user_menu do
-              click_link 'Settings'
+              click_element(:edit_profile_link)
             end
 
             has_text?('User Settings')

qa/qa/resource/personal_access_token.rb

@@ -15,7 +15,7 @@ module QA
       end
 
       def fabricate!
-        Page::Main::Menu.perform(&:click_settings_link)
+        Page::Main::Menu.perform(&:click_edit_profile_link)
         Page::Profile::Menu.perform(&:click_access_tokens)
 
         Page::Profile::PersonalAccessTokens.perform do |token_page|

qa/qa/resource/ssh_key.rb

@@ -22,7 +22,7 @@ module QA
       end
 
       def fabricate!
-        Page::Main::Menu.perform(&:click_settings_link)
+        Page::Main::Menu.perform(&:click_edit_profile_link)
         Page::Profile::Menu.perform(&:click_ssh_keys)
 
         Page::Profile::SSHKeys.perform do |profile_page|

qa/qa/specs/features/browser_ui/1_manage/login/2fa_ssh_recovery_spec.rb

@@ -48,7 +48,7 @@ module QA
 
       def enable_2fa_for_user(user)
         Flow::Login.while_signed_in(as: user) do
-          Page::Main::Menu.perform(&:click_settings_link)
+          Page::Main::Menu.perform(&:click_edit_profile_link)
           Page::Profile::Menu.perform(&:click_account)
           Page::Profile::Accounts::Show.perform(&:click_enable_2fa_button)
 

qa/qa/specs/features/browser_ui/1_manage/login/register_spec.rb

@@ -58,7 +58,7 @@ module QA
             # this is the only test that exercise this UI.
             # Other tests should use the API for this purpose.
             Flow::Login.sign_in(as: user)
-            Page::Main::Menu.perform(&:click_settings_link)
+            Page::Main::Menu.perform(&:click_edit_profile_link)
             Page::Profile::Menu.perform(&:click_account)
             Page::Profile::Accounts::Show.perform do |show|
               show.delete_account(user.password)

qa/qa/specs/features/browser_ui/3_create/repository/ssh_key_support_spec.rb

@@ -21,7 +21,7 @@ module QA
     # Note this context ensures that the example it contains is executed after the example above. Be aware of the order of execution if you add new examples in either context.
     context 'after adding an ssh key' do
       it 'can delete an ssh key', testcase: 'https://gitlab.com/gitlab-org/quality/testcases/-/issues/930' do
-        Page::Main::Menu.perform(&:click_settings_link)
+        Page::Main::Menu.perform(&:click_edit_profile_link)
         Page::Profile::Menu.perform(&:click_ssh_keys)
         Page::Profile::SSHKeys.perform do |ssh_keys|
           ssh_keys.remove_key(key.title)

qa/qa/specs/features/ee/browser_ui/1_manage/instance/instance_audit_logs_spec.rb

@@ -65,7 +65,7 @@ module QA
         before do
           sign_in
           new_email_address = 'new_email@example.com'
-          Page::Main::Menu.perform(&:click_settings_link)
+          Page::Main::Menu.perform(&:click_edit_profile_link)
           Page::Profile::Menu.perform(&:click_emails)
           Support::Retrier.retry_until(sleep_interval: 3) do
             Page::Profile::Emails.perform do |emails|
@@ -91,7 +91,7 @@ module QA
             login_page.sign_in_using_credentials(user: user)
           end
 
-          Page::Main::Menu.perform(&:click_settings_link)
+          Page::Main::Menu.perform(&:click_edit_profile_link)
           Page::Profile::Menu.perform(&:click_password)
           Page::Profile::Password.perform do |password_page|
             password_page.update_password('new_password', user.password)

qa/qa/tools/revoke_all_personal_access_tokens.rb

@@ -27,7 +27,7 @@ module QA
 
         Runtime::Browser.visit(ENV['GITLAB_ADDRESS'], Page::Main::Login)
         Page::Main::Login.perform(&:sign_in_using_credentials)
-        Page::Main::Menu.perform(&:click_settings_link)
+        Page::Main::Menu.perform(&:click_edit_profile_link)
         Page::Profile::Menu.perform(&:click_access_tokens)
 
         token_name = 'api-test-token'

spec/features/admin/users/user_spec.rb

@@ -171,7 +171,7 @@ RSpec.describe 'Admin::Users::User' do
         it 'logs in as the user when impersonate is clicked' do
           subject
 
-          expect(page.find(:css, '.header-user .profile-link')['data-user']).to eql(another_user.username)
+          expect(page.find(:css, '[data-testid="user-profile-link"]')['data-user']).to eql(another_user.username)
         end
 
         it 'sees impersonation log out icon' do
@@ -205,7 +205,7 @@ RSpec.describe 'Admin::Users::User' do
         it 'logs out of impersonated user back to original user' do
           subject
 
-          expect(page.find(:css, '.header-user .profile-link')['data-user']).to eq(current_user.username)
+          expect(page.find(:css, '[data-testid="user-profile-link"]')['data-user']).to eq(current_user.username)
         end
 
         it 'is redirected back to the impersonated users page in the admin after stopping' do

spec/features/profiles/user_visits_profile_spec.rb

@@ -39,7 +39,7 @@ RSpec.describe 'User visits their profile' do
       find(:css, '.header-user-dropdown-toggle').click
 
       page.within ".header-user" do
-        click_link "Profile"
+        click_link user.username
       end
     end