From 7a5a0115e886e04b623c1557da64e8fd20c8bd30 Mon Sep 17 00:00:00 2001 From: jerasmus Date: Thu, 26 Jun 2025 11:30:24 +0200 Subject: [PATCH 1/4] Show both author and committer in last commit Ensures committer is also displayed if it differs from the author Changelog: fixed --- .../repository/components/commit_info.vue | 21 +++++++++ .../repository/path_last_commit.query.graphql | 4 ++ .../repository/components/commit_info_spec.js | 44 ++++++++++++++++++- spec/frontend/repository/mock_data.js | 4 ++ 4 files changed, 71 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/repository/components/commit_info.vue b/app/assets/javascripts/repository/components/commit_info.vue index 0a3b2fb9a5fe25..9329eada49789b 100644 --- a/app/assets/javascripts/repository/components/commit_info.vue +++ b/app/assets/javascripts/repository/components/commit_info.vue @@ -51,6 +51,13 @@ export default { truncateAuthorName() { return typeof this.span === 'number' && this.span < 3; }, + differentCommitter() { + // Was this commit committed by a different person than the original author? + return ( + this.commit.authorName !== this.commit.committerName || + this.commit.authorEmail !== this.commit.committerEmail + ); + }, }, methods: { toggleShowDescription() { @@ -64,6 +71,8 @@ export default { i18n: { toggleCommitDescription: __('Toggle commit description'), authored: __('authored'), + and: __('and'), + committed: __('committed'), }, }; @@ -126,6 +135,18 @@ export default { {{ $options.i18n.authored }} + + 
 wrapper.findComponent(GlButton);
 const findUserLink = () => wrapper.findByText(commit.author.name);
 const findCommitterWrapper = () => wrapper.findByTestId('committer');
 const findUserAvatarLink = () => wrapper.findComponent(UserAvatarLink);
-const findAuthorName = () => wrapper.findByText(`${commit.authorName} authored`);
+const findUserAvatarImages = () => wrapper.findAllComponents(UserAvatarImage);
+const findTimeagoTooltips = () => wrapper.findAllComponents(TimeagoTooltip);
 const findCommitRowDescription = () => wrapper.find('pre');
 const findTitleHtml = () => wrapper.findByText(commit.titleHtml);
 
@@ -44,7 +47,6 @@ describe('Repository last commit component', () => {
 
     expect(findUserLink().exists()).toBe(false);
     expect(findUserAvatarLink().exists()).toBe(false);
-    expect(findAuthorName().exists()).toBe(true);
   });
 
   it('truncates author name when commit spans less than 3 lines', () => {
@@ -120,4 +122,42 @@ describe('Repository last commit component', () => {
 
     expect(findTitleHtml().classes()).toContain('gl-italic');
   });
+
+  describe('when committer is different from author', () => {
+    const commitMockWithDifferentCommitter = {
+      author: { name: 'John Doe', email: 'john@example.com' },
+      committerName: 'Jane Smith',
+      committerEmail: 'jane@example.com',
+      committerAvatarUrl: 'https://committer-avatar.com/avatar.jpg',
+      committedDate: '2019-02-01',
+    };
+
+    beforeEach(() => createComponent({ commitMock: commitMockWithDifferentCommitter }));
+
+    it('displays committer information when committer differs from author', () => {
+      const text = findCommitterWrapper().text();
+
+      expect(text).toContain('John Doe');
+      expect(text).toContain('authored');
+      expect(text).toContain('and');
+      expect(text).toContain('Jane Smith');
+      expect(text).toContain('committed');
+    });
+
+    it('displays committer avatar when committer avatar URL is provided', () => {
+      expect(findUserAvatarImages().at(0).props()).toMatchObject({
+        size: 16,
+        imgSrc: commitMockWithDifferentCommitter.committerAvatarUrl,
+      });
+    });
+
+    it('displays both authored and committed dates', () => {
+      const timeagoTooltips = findTimeagoTooltips();
+
+      expect(timeagoTooltips.at(0).props('time')).toBe(commit.authoredDate);
+      expect(timeagoTooltips.at(1).props('time')).toBe(
+        commitMockWithDifferentCommitter.committedDate,
+      );
+    });
+  });
 });
diff --git a/spec/frontend/repository/mock_data.js b/spec/frontend/repository/mock_data.js
index df3cfda8142e62..23c730d8c75789 100644
--- a/spec/frontend/repository/mock_data.js
+++ b/spec/frontend/repository/mock_data.js
@@ -338,8 +338,12 @@ export const createCommitData = ({ pipelineEdges = defaultPipelineEdges, signatu
             descriptionHtml: '',
             message: '',
             webPath: '/commit/123',
+            committerName: 'Test Committer',
+            committerEmail: 'testcommitter@example.com',
+            committedDate: '2019-02-02',
             authoredDate: '2019-01-01',
             authorName: 'Test',
+            authorEmail: 'testauthor@example.com',
             authorGravatar: 'https://test.com',
             author: {
               __typename: 'UserCore',
-- 
GitLab


From 929dc8535a6aa04bd5016c1e4d8d579479c755fc Mon Sep 17 00:00:00 2001
From: jerasmus 
Date: Fri, 27 Jun 2025 09:00:38 +0200
Subject: [PATCH 2/4] Improve computer prop naming

Changed the name for better readability
---
 app/assets/javascripts/repository/components/commit_info.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/app/assets/javascripts/repository/components/commit_info.vue b/app/assets/javascripts/repository/components/commit_info.vue
index 9329eada49789b..2ac5685375b6ff 100644
--- a/app/assets/javascripts/repository/components/commit_info.vue
+++ b/app/assets/javascripts/repository/components/commit_info.vue
@@ -51,8 +51,7 @@ export default {
     truncateAuthorName() {
       return typeof this.span === 'number' && this.span < 3;
     },
-    differentCommitter() {
-      // Was this commit committed by a different person than the original author?
+    isCommitterDifferentFromAuthor() {
       return (
         this.commit.authorName !== this.commit.committerName ||
         this.commit.authorEmail !== this.commit.committerEmail
@@ -136,7 +135,7 @@ export default {
           {{ $options.i18n.authored }}
           
 
-