diff --git a/app/assets/stylesheets/page_bundles/commits.scss b/app/assets/stylesheets/page_bundles/commits.scss
index 589cc7988f97123e9e3c74d80a674a58f3ace3f0..e43f99914f7b3586748c59cb3c60d463b2b0497f 100644
--- a/app/assets/stylesheets/page_bundles/commits.scss
+++ b/app/assets/stylesheets/page_bundles/commits.scss
@@ -4,10 +4,6 @@
+ .commits-row {
border-top: 1px solid var(--gray-50, $gray-50);
}
-
- + .commits-empty {
- display: none;
- }
}
.add-review-item {
diff --git a/app/assets/stylesheets/page_bundles/merge_request.scss b/app/assets/stylesheets/page_bundles/merge_request.scss
index 68abb1c980f22a18523476066ced30a17c6032ff..4219bd25f916728debbe81ba643f4cb87ebf6b4e 100644
--- a/app/assets/stylesheets/page_bundles/merge_request.scss
+++ b/app/assets/stylesheets/page_bundles/merge_request.scss
@@ -60,19 +60,6 @@ $comparison-empty-state-height: 62px;
min-height: $comparison-empty-state-height;
}
-.commits-empty {
- text-align: center;
-
- h4 {
- padding-top: 20px;
- padding-bottom: 10px;
- }
-
- svg {
- width: 230px;
- }
-}
-
.nothing-here-block {
img {
width: 230px;
diff --git a/app/views/projects/merge_requests/_commits.html.haml b/app/views/projects/merge_requests/_commits.html.haml
index ee0ab984d6fb609b0541379998cf06cb88762200..b4d62a200d3351ab3afd5787a32dce2f0fad3985 100644
--- a/app/views/projects/merge_requests/_commits.html.haml
+++ b/app/views/projects/merge_requests/_commits.html.haml
@@ -1,13 +1,11 @@
- can_update_merge_request = can?(current_user, :update_merge_request, @merge_request)
- if @commits.empty? && @context_commits.empty?
- .commits-empty.mt-5
- = custom_icon ('illustration_no_commits')
- %h4
- = _('There are no commits yet.')
- - if can_update_merge_request
- %p
- = _('Push commits to the source branch or add previously merged commits to review them.')
+ = render Pajamas::EmptyStateComponent.new(svg_path: 'illustrations/empty-state/empty-commit-md.svg',
+ title: _('There are no commits yet')) do |c|
+
+ - c.with_description do
+ %p= _('Push commits to the source branch or add previously merged commits to review them.')
= render Pajamas::ButtonComponent.new(variant: 'confirm', button_options: { class: 'add-review-item-modal-trigger', data: { commits_empty: 'true', context_commits_empty: 'true' } }) do
= _('Add previously merged commits')
- else
diff --git a/app/views/projects/merge_requests/creations/_new_submit.html.haml b/app/views/projects/merge_requests/creations/_new_submit.html.haml
index 996928ba377815bebc9475888a664c57703b895c..2d0807b82f9613cda33578f79ef242f759d6d845 100644
--- a/app/views/projects/merge_requests/creations/_new_submit.html.haml
+++ b/app/views/projects/merge_requests/creations/_new_submit.html.haml
@@ -28,7 +28,7 @@
#diff-notes-app.tab-content
#new.commits.tab-pane.active
- .commits-empty.gl-text-left.gl-my-5.gl-text-gray-500
+ .gl-text-left.gl-my-5.gl-text-gray-500
%p
= _("There are no commits yet.")
- else
diff --git a/app/views/shared/icons/_illustration_no_commits.svg b/app/views/shared/icons/_illustration_no_commits.svg
deleted file mode 100644
index 34f177d7efad10d30daaed2c3c5bdf3a4712d95f..0000000000000000000000000000000000000000
--- a/app/views/shared/icons/_illustration_no_commits.svg
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/ee/spec/frontend/security_configuration/corpus_management/__snapshots__/empty_state_spec.js.snap b/ee/spec/frontend/security_configuration/corpus_management/__snapshots__/empty_state_spec.js.snap
index 636885b899a0ae57db863688ec2d42100523f3b5..2404ff380c0ad727a7d6c4f32725c0514a5570b2 100644
--- a/ee/spec/frontend/security_configuration/corpus_management/__snapshots__/empty_state_spec.js.snap
+++ b/ee/spec/frontend/security_configuration/corpus_management/__snapshots__/empty_state_spec.js.snap
@@ -11,7 +11,7 @@ exports[`EE - CorpusManagement - EmptyState should render correct content 1`] =
alt=""
class="gl-dark-invert-keep-hue gl-max-w-full"
height="144"
- src="/illustrations/no_commits.svg"
+ src="/illustrations/empty-state/empty-commit-md.svg"
/>
{
let wrapper;
diff --git a/ee/spec/frontend/security_configuration/corpus_management/empty_state_spec.js b/ee/spec/frontend/security_configuration/corpus_management/empty_state_spec.js
index f8cfe288f07c2c6e2aff9b0ffdb3aa5fce3d5e54..a56c81de56c6aa103cafc0a3027ac36974152b56 100644
--- a/ee/spec/frontend/security_configuration/corpus_management/empty_state_spec.js
+++ b/ee/spec/frontend/security_configuration/corpus_management/empty_state_spec.js
@@ -4,7 +4,7 @@ import { shallowMount } from '@vue/test-utils';
import EmptyState from 'ee/security_configuration/corpus_management/components/empty_state.vue';
const TEST_CORPUS_HELP_PATH = '/docs/corpus-management';
-const TEST_EMPTY_STATE_SVG_PATH = '/illustrations/no_commits.svg';
+const TEST_EMPTY_STATE_SVG_PATH = '/illustrations/empty-state/empty-commit-md.svg';
describe('EE - CorpusManagement - EmptyState', () => {
let wrapper;
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 0ec9466fe93078d6785d151dc8ac93af3c19ddae..62f4e644833cb23138caba42be6192ece1e2caad 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -50693,6 +50693,9 @@ msgstr ""
msgid "There are no closed merge requests"
msgstr ""
+msgid "There are no commits yet"
+msgstr ""
+
msgid "There are no commits yet."
msgstr ""
diff --git a/spec/views/projects/merge_requests/_commits.html.haml_spec.rb b/spec/views/projects/merge_requests/_commits.html.haml_spec.rb
index 4ce6755b89d208af9f37b271616145cc82cfe820..346cf203c67e551f7d8deba7a02abb29ef2badb9 100644
--- a/spec/views/projects/merge_requests/_commits.html.haml_spec.rb
+++ b/spec/views/projects/merge_requests/_commits.html.haml_spec.rb
@@ -39,4 +39,24 @@
expect(rendered).to have_css('.js-loading-signature-badge')
end
+
+ context 'when MR has no commits' do
+ let(:merge_request) { create(:merge_request, source_project: create(:project, :custom_repo)) }
+
+ it 'renders empty state' do
+ assign(:context_commits, [])
+
+ render
+
+ expect(rendered).to have_css('.gl-empty-state')
+ end
+
+ it 'renders the svg' do
+ assign(:context_commits, [])
+
+ render
+
+ expect(rendered).to include('empty-commit-md')
+ end
+ end
end