Display provider name for profile social sign-in

Some providers' icons may not be as recognizable as others. For
clarity, display the provider name on the profile social sign-in
page.

app/views/profiles/accounts/_providers.html.haml

@@ -11,11 +11,11 @@
         - if auth_active?(provider)
           - if unlink_allowed
             = link_to unlink_profile_account_path(provider: provider), method: :delete, class: 'provider-btn' do
-              = s_('Profiles|Disconnect')
+              = s_('Profiles|Disconnect %{provider}') % { provider: label_for_provider(provider) }
           - else
             %a.provider-btn
-              = s_('Profiles|Active')
+              = s_('Profiles|%{provider} Active') % { provider: label_for_provider(provider) }
         - elsif link_allowed
           = link_to omniauth_authorize_path(:user, provider), method: :post, class: 'provider-btn gl-text-blue-500' do
-            = s_('Profiles|Connect')
+            = s_('Profiles|Connect %{provider}') % { provider: label_for_provider(provider) }
   = render_if_exists 'profiles/accounts/group_saml_unlink_buttons', group_saml_identities: group_saml_identities

changelogs/unreleased/dblessing-social-connect-text.yml

+---
+title: Display provider name for profile social sign-in connectors
+merge_request: 41198
+author:
+type: changed

locale/gitlab.pot

@@ -18691,6 +18691,9 @@ msgstr ""
 msgid "Profiles| You are going to change the username %{currentUsernameBold} to %{newUsernameBold}. Profile and projects will be redirected to the %{newUsername} namespace but this redirect will expire once the %{currentUsername} namespace is registered by another user or group. Please update your Git repository remotes as soon as possible."
 msgstr ""
 
+msgid "Profiles|%{provider} Active"
+msgstr ""
+
 msgid "Profiles|@username"
 msgstr ""
 
@@ -18742,7 +18745,7 @@ msgstr ""
 msgid "Profiles|Commit email"
 msgstr ""
 
-msgid "Profiles|Connect"
+msgid "Profiles|Connect %{provider}"
 msgstr ""
 
 msgid "Profiles|Connected Accounts"
@@ -18766,6 +18769,9 @@ msgstr ""
 msgid "Profiles|Disconnect"
 msgstr ""
 
+msgid "Profiles|Disconnect %{provider}"
+msgstr ""
+
 msgid "Profiles|Do not show on profile"
 msgstr ""
 

spec/features/profiles/account_spec.rb

@@ -9,6 +9,39 @@ RSpec.describe 'Profile > Account', :js do
     sign_in(user)
   end
 
+  describe 'Social sign-in' do
+    context 'when an identity does not exist' do
+      before do
+        allow(Devise).to receive_messages(omniauth_configs: { google_oauth2: {} })
+      end
+
+      it 'allows the user to connect' do
+        visit profile_account_path
+
+        expect(page).to have_link('Connect Google', href: '/users/auth/google_oauth2')
+      end
+    end
+
+    context 'when an identity already exists' do
+      before do
+        allow(Devise).to receive_messages(omniauth_configs: { twitter: {}, saml: {} })
+
+        create(:identity, user: user, provider: :twitter)
+        create(:identity, user: user, provider: :saml)
+
+        visit profile_account_path
+      end
+
+      it 'allows the user to disconnect when there is an existing identity' do
+        expect(page).to have_link('Disconnect Twitter', href: '/profile/account/unlink?provider=twitter')
+      end
+
+      it 'shows active for a provider that is not allowed to unlink' do
+        expect(page).to have_content('Saml Active')
+      end
+    end
+  end
+
   describe 'Change username' do
     let(:new_username) { 'bar' }
     let(:new_user_path) { "/#{new_username}" }

spec/lib/gitlab/auth/o_auth/provider_spec.rb

@@ -45,7 +45,7 @@ RSpec.describe Gitlab::Auth::OAuth::Provider do
     end
   end
 
-  describe '#config_for' do
+  describe '.config_for' do
     context 'for an LDAP provider' do
       context 'when the provider exists' do
         it 'returns the config' do
@@ -91,4 +91,46 @@ RSpec.describe Gitlab::Auth::OAuth::Provider do
       end
     end
   end
+
+  describe '.label_for' do
+    subject { described_class.label_for(name) }
+
+    context 'when configuration specifies a custom label' do
+      let(:name) { 'google_oauth2' }
+      let(:label) { 'Custom Google Provider' }
+      let(:provider) { OpenStruct.new({ 'name' => name, 'label' => label }) }
+
+      before do
+        stub_omniauth_setting(providers: [provider])
+      end
+
+      it 'returns the custom label name' do
+        expect(subject).to eq(label)
+      end
+    end
+
+    context 'when configuration does not specify a custom label' do
+      let(:provider) { OpenStruct.new({ 'name' => name } ) }
+
+      before do
+        stub_omniauth_setting(providers: [provider])
+      end
+
+      context 'when the name does not correspond to a label mapping' do
+        let(:name) { 'twitter' }
+
+        it 'returns the titleized name' do
+          expect(subject).to eq(name.titleize)
+        end
+      end
+    end
+
+    context 'when the name corresponds to a label mapping' do
+      let(:name) { 'gitlab' }
+
+      it 'returns the mapped name' do
+        expect(subject).to eq('GitLab.com')
+      end
+    end
+  end
 end