diff --git a/app/assets/javascripts/project.js b/app/assets/javascripts/project.js index 36b6a5ed3768124877167e8216740e5b51d86e3e..3131e71d9d642d4ae45748290757a07e6304614f 100644 --- a/app/assets/javascripts/project.js +++ b/app/assets/javascripts/project.js @@ -17,13 +17,14 @@ export default class Project { $('a', $cloneOptions).on('click', (e) => { const $this = $(e.currentTarget); const url = $this.attr('href'); + const activeText = $this.find('.dropdown-menu-inner-title').text(); e.preventDefault(); $('.is-active', $cloneOptions).not($this).removeClass('is-active'); $this.toggleClass('is-active'); $projectCloneField.val(url); - $cloneBtnText.text($this.text()); + $cloneBtnText.text(activeText); return $('.clone').text(url); }); diff --git a/app/assets/stylesheets/pages/projects.scss b/app/assets/stylesheets/pages/projects.scss index 2c83b30500d7beaaa6b9229ee757f369e0dde6ac..2dc0c288a6d5e91417eb1859e13b570cd3303bd5 100644 --- a/app/assets/stylesheets/pages/projects.scss +++ b/app/assets/stylesheets/pages/projects.scss @@ -395,6 +395,18 @@ } } } + + .clone-dropdown-btn { + background-color: $white-light; + } + + .clone-options-dropdown { + min-width: 240px; + + .dropdown-menu-inner-content { + min-width: 320px; + } + } } .project-repo-buttons { diff --git a/app/helpers/application_settings_helper.rb b/app/helpers/application_settings_helper.rb index 5bb84984142f6686996e6339b7aa3d9f5df8d767..dccde46fa3345fd17aa29918a2d8724eb6e82c35 100644 --- a/app/helpers/application_settings_helper.rb +++ b/app/helpers/application_settings_helper.rb @@ -30,9 +30,9 @@ module ApplicationSettingsHelper def enabled_project_button(project, protocol) case protocol when 'ssh' - ssh_clone_button(project, 'bottom', append_link: false) + ssh_clone_button(project, append_link: false) else - http_clone_button(project, 'bottom', append_link: false) + http_clone_button(project, append_link: false) end end diff --git a/app/helpers/button_helper.rb b/app/helpers/button_helper.rb index 8e8feeea1d8c03b4d8b37c8d60118df59ff68fc9..d06cf2de2c36e1e1fff184e313c35e57edf0967f 100644 --- a/app/helpers/button_helper.rb +++ b/app/helpers/button_helper.rb @@ -56,42 +56,36 @@ module ButtonHelper end end - def http_clone_button(project, placement = 'right', append_link: true) - klass = 'http-selector' - klass << ' has-tooltip' if current_user.try(:require_extra_setup_for_git_auth?) - + def http_clone_button(project, append_link: true) protocol = gitlab_config.protocol.upcase + dropdown_description = http_dropdown_description(protocol) + append_url = project.http_url_to_repo if append_link + + dropdown_item_with_description(protocol, dropdown_description, href: append_url) + end + + def http_dropdown_description(protocol) + if current_user.try(:require_password_creation_for_git?) + _("Set a password on your account to pull or push via %{protocol}.") % { protocol: protocol } + else + _("Create a personal access token on your account to pull or push via %{protocol}.") % { protocol: protocol } + end + end - tooltip_title = - if current_user.try(:require_password_creation_for_git?) - _("Set a password on your account to pull or push via %{protocol}.") % { protocol: protocol } - else - _("Create a personal access token on your account to pull or push via %{protocol}.") % { protocol: protocol } - end + def ssh_clone_button(project, append_link: true) + dropdown_description = _("You won't be able to pull or push project code via SSH until you add an SSH key to your profile") if current_user.try(:require_ssh_key?) + append_url = project.ssh_url_to_repo if append_link - content_tag (append_link ? :a : :span), protocol, - class: klass, - href: (project.http_url_to_repo if append_link), - data: { - html: true, - placement: placement, - container: 'body', - title: tooltip_title - } + dropdown_item_with_description('SSH', dropdown_description, href: append_url) end - def ssh_clone_button(project, placement = 'right', append_link: true) - klass = 'ssh-selector' - klass << ' has-tooltip' if current_user.try(:require_ssh_key?) + def dropdown_item_with_description(title, description, href: nil) + button_content = content_tag(:strong, title, class: 'dropdown-menu-inner-title') + button_content << content_tag(:span, description, class: 'dropdown-menu-inner-content') if description - content_tag (append_link ? :a : :span), 'SSH', - class: klass, - href: (project.ssh_url_to_repo if append_link), - data: { - html: true, - placement: placement, - container: 'body', - title: _('Add an SSH key to your profile to pull or push via SSH.') - } + content_tag (href ? :a : :span), + button_content, + class: "#{title.downcase}-selector", + href: (href if href) end end diff --git a/app/views/shared/_clone_panel.html.haml b/app/views/shared/_clone_panel.html.haml index 3d9c90c38fe49cc2dd594398fc05602a1c8d6918..fba08092351694652c850878cf21e231aa871d95 100644 --- a/app/views/shared/_clone_panel.html.haml +++ b/app/views/shared/_clone_panel.html.haml @@ -7,7 +7,7 @@ %span = enabled_project_button(project, enabled_protocol) - else - %a#clone-dropdown.clone-dropdown-btn.btn{ href: '#', data: { toggle: 'dropdown' } } + %a#clone-dropdown.btn.clone-dropdown-btn{ href: '#', data: { toggle: 'dropdown' } } %span = default_clone_protocol.upcase = icon('caret-down') diff --git a/changelogs/unreleased/39455-clone-dropdown-should-not-have-a-tooltip.yml b/changelogs/unreleased/39455-clone-dropdown-should-not-have-a-tooltip.yml new file mode 100644 index 0000000000000000000000000000000000000000..cb522cb7611fa84c594df3ce2dcf12a8e905cd48 --- /dev/null +++ b/changelogs/unreleased/39455-clone-dropdown-should-not-have-a-tooltip.yml @@ -0,0 +1,5 @@ +--- +title: Removed tooltip from clone dropdown +merge_request: 15334 +author: +type: other diff --git a/spec/helpers/button_helper_spec.rb b/spec/helpers/button_helper_spec.rb index e515876133362db5b5ef9b08a787af7b04f37695..d2c7867febbc77d2f8cf0c3650728058b1745ed5 100644 --- a/spec/helpers/button_helper_spec.rb +++ b/spec/helpers/button_helper_spec.rb @@ -26,9 +26,10 @@ describe ButtonHelper do context 'when user has password automatically set' do let(:user) { create(:user, password_automatically_set: true) } - it 'shows a password tooltip' do - expect(element.attr('class')).to include(has_tooltip_class) - expect(element.attr('data-title')).to eq('Set a password on your account to pull or push via HTTP.') + it 'shows the password text on the dropdown' do + description = element.search('.dropdown-menu-inner-content').first + + expect(description.inner_text).to eq 'Set a password on your account to pull or push via HTTP.' end end end @@ -39,17 +40,10 @@ describe ButtonHelper do end context 'when user has no personal access tokens' do - it 'has a personal access token tooltip ' do - expect(element.attr('class')).to include(has_tooltip_class) - expect(element.attr('data-title')).to eq('Create a personal access token on your account to pull or push via HTTP.') - end - end - - context 'when user has a personal access token' do - it 'shows no tooltip' do - create(:personal_access_token, user: user) + it 'has a personal access token text on the dropdown description ' do + description = element.search('.dropdown-menu-inner-content').first - expect(element.attr('class')).not_to include(has_tooltip_class) + expect(description.inner_text).to eq 'Create a personal access token on your account to pull or push via HTTP.' end end end @@ -63,6 +57,41 @@ describe ButtonHelper do end end + describe 'ssh_button' do + let(:user) { create(:user) } + let(:project) { build_stubbed(:project) } + + def element + element = helper.ssh_clone_button(project) + + Nokogiri::HTML::DocumentFragment.parse(element).first_element_child + end + + before do + allow(helper).to receive(:current_user).and_return(user) + end + + context 'without an ssh key on the user' do + it 'shows a warning on the dropdown description' do + description = element.search('.dropdown-menu-inner-content').first + + expect(description.inner_text).to eq "You won't be able to pull or push project code via SSH until you add an SSH key to your profile" + end + end + + context 'with an ssh key on the user' do + before do + create(:key, user: user) + end + + it 'there is no warning on the dropdown description' do + description = element.search('.dropdown-menu-inner-content').first + + expect(description).to eq nil + end + end + end + describe 'clipboard_button' do let(:user) { create(:user) } let(:project) { build_stubbed(:project) }