diff --git a/app/components/rapid_diffs/diff_file_header_component.html.haml b/app/components/rapid_diffs/diff_file_header_component.html.haml index 3d328292654c1d1cfcd8691a85eae7f1d30c5d6f..22e81aa36aa073cc8bfb58dc9f5830e3cb878a29 100644 --- a/app/components/rapid_diffs/diff_file_header_component.html.haml +++ b/app/components/rapid_diffs/diff_file_header_component.html.haml @@ -1,5 +1,4 @@ -# TODO: add file size --# TODO: add file toggle -# TODO: add comment button -# TODO: add viewed toggle -# TODO: add raw\rendered toggle @@ -18,11 +17,11 @@ = render Pajamas::ButtonComponent.new(category: :tertiary, size: :small, icon: 'chevron-right', button_options: { data: { closed: '', click: 'toggleFile' }, aria: { label: _('Show file contents') } }) .rd-diff-file-title - if @diff_file.submodule? - %span + %span{ data: { testid: 'rd-diff-file-header-submodule' } } = helpers.sprite_icon('folder-git', file_icon: true) %strong = helpers.submodule_link(@diff_file.blob, @diff_file.content_sha, @diff_file.repository) - -# TODO: add copy button + = copy_path_button - else -# TODO: add icons for file types - if @diff_file.renamed_file? @@ -37,7 +36,7 @@ = @diff_file.file_path - if @diff_file.deleted_file? = _("deleted") - -# TODO: add copy button + = copy_path_button - if @diff_file.mode_changed? %small #{@diff_file.a_mode} → #{@diff_file.b_mode} - if @diff_file.stored_externally? && @diff_file.external_storage == :lfs diff --git a/app/components/rapid_diffs/diff_file_header_component.rb b/app/components/rapid_diffs/diff_file_header_component.rb index b60f56f4f55534ab7579fae77e9caac26fa6619c..5b0a88002c2d886cd2bb80585fecc833839b9805 100644 --- a/app/components/rapid_diffs/diff_file_header_component.rb +++ b/app/components/rapid_diffs/diff_file_header_component.rb @@ -2,8 +2,21 @@ module RapidDiffs class DiffFileHeaderComponent < ViewComponent::Base + include ButtonHelper + def initialize(diff_file:) @diff_file = diff_file end + + def copy_path_button + clipboard_button( + text: @diff_file.file_path, + gfm: "`#{@diff_file.file_path}`", + title: _("Copy file path"), + placement: "top", + boundary: "viewport", + testid: "rd-diff-file-copy-clipboard" + ) + end end end diff --git a/spec/components/rapid_diffs/diff_file_header_component_spec.rb b/spec/components/rapid_diffs/diff_file_header_component_spec.rb index 9d4bff596e99f8375d5931bb030ed5586966a44f..42c8ca34ec714af3af811c1a3e5210600146a2ff 100644 --- a/spec/components/rapid_diffs/diff_file_header_component_spec.rb +++ b/spec/components/rapid_diffs/diff_file_header_component_spec.rb @@ -11,13 +11,25 @@ expect(header).to have_text(diff_file.file_path) end + it "renders copy path button" do + clipboard_text = '{"text":"files/ruby/popen.rb","gfm":"`files/ruby/popen.rb`"}' + button_selector = '[data-testid="rd-diff-file-header"] [data-testid="rd-diff-file-copy-clipboard"]' + icon_selector = "#{button_selector} svg use" + + render_component + + expect(page.find(button_selector)['data-clipboard-text']).to eq(clipboard_text) + expect(page.find(button_selector)['title']).to eq(_('Copy file path')) + expect(page.find(icon_selector)['href']).to include('copy-to-clipboard') + end + it "renders submodule info", quarantine: 'https://gitlab.com/gitlab-org/gitlab/-/issues/489868' do allow(diff_file).to receive(:submodule?).and_return(true) allow_next_instance_of(SubmoduleHelper) do |instance| allow(instance).to receive(:submodule_links).and_return(nil) end render_component - expect(page.find('svg use')['href']).to include('folder-git') + expect(page.find('[data-testid="rd-diff-file-header-submodule"] svg use')['href']).to include('folder-git') expect(page).to have_text(diff_file.blob.name) expect(page).to have_text(diff_file.blob.id[0..7]) end