Prevents showing 2 tooltips in pipelines64608-double-tooltips

In pipeline's table two tooltips were being rendered
With this change only one tooltip is trigerred on hover

3 files changed, 16 insertions, 13 deletions

diff --git a/app/assets/javascripts/vue_shared/components/commit.vue b/app/assets/javascripts/vue_shared/components/commit.vue
index ae9b013d980..f7c508c4e23 100644
--- a/app/assets/javascripts/vue_shared/components/commit.vue
+++ b/app/assets/javascripts/vue_shared/components/commit.vue
@@ -152,37 +152,35 @@ export default {
         :href="mergeRequestRef.path"
         :title="mergeRequestRef.title"
         class="ref-name"
+        >{{ mergeRequestRef.iid }}</gl-link
       >
-        {{ mergeRequestRef.iid }}
-      </gl-link>
       <gl-link
         v-else
         v-gl-tooltip
         :href="commitRef.ref_url"
         :title="commitRef.name"
         class="ref-name"
+        >{{ commitRef.name }}</gl-link
       >
-        {{ commitRef.name }}
-      </gl-link>
     </template>
     <icon name="commit" class="commit-icon js-commit-icon" />
 
-    <gl-link :href="commitUrl" class="commit-sha mr-0"> {{ shortSha }} </gl-link>
+    <gl-link :href="commitUrl" class="commit-sha mr-0">{{ shortSha }}</gl-link>
 
-    <div class="commit-title flex-truncate-parent">
-      <tooltip-on-truncate v-if="title" class="flex-truncate-child" :title="title">
+    <div class="commit-title">
+      <span v-if="title" class="flex-truncate-parent">
         <user-avatar-link
           v-if="hasAuthor"
           :link-href="author.path"
           :img-src="author.avatar_url"
           :img-alt="userImageAltDescription"
           :tooltip-text="author.username"
-          class="avatar-image-container"
+          class="avatar-image-container text-decoration-none"
         />
-        <gl-link :href="commitUrl" class="commit-row-message cgray">
-          {{ title }}
-        </gl-link>
-      </tooltip-on-truncate>
+        <tooltip-on-truncate :title="title" class="flex-truncate-child">
+          <gl-link :href="commitUrl" class="commit-row-message cgray">{{ title }}</gl-link>
+        </tooltip-on-truncate>
+      </span>
       <span v-else>{{ __("Can't find HEAD commit for this branch") }}</span>
     </div>
   </div>
diff --git a/app/assets/stylesheets/framework/responsive_tables.scss b/app/assets/stylesheets/framework/responsive_tables.scss
index 6bd44ee19bd..fd6f80e26cb 100644
--- a/app/assets/stylesheets/framework/responsive_tables.scss
+++ b/app/assets/stylesheets/framework/responsive_tables.scss
@@ -155,7 +155,7 @@
   text-overflow: ellipsis;
 
   @include media-breakpoint-up(md) {
-    flex: 0 0 90%;
+    flex: 0 0 85%;
   }
 
   .avatar {
diff --git a/changelogs/unreleased/64608-double-tooltips.yml b/changelogs/unreleased/64608-double-tooltips.yml
new file mode 100644
index 00000000000..f6cb1944d26
--- /dev/null
+++ b/changelogs/unreleased/64608-double-tooltips.yml
@@ -0,0 +1,5 @@
+---
+title: Prevents showing 2 tooltips in pipelines table
+merge_request:
+author:
+type: fixed