Added User Popovers to Commit Items and Member Lists

app/assets/javascripts/diffs/components/commit_item.vue

@@ -5,6 +5,7 @@ import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
 import CIIcon from '~/vue_shared/components/ci_icon.vue';
 import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
 import CommitPipelineStatus from '~/projects/tree/components/commit_pipeline_status_component.vue';
+import initUserPopovers from '../../user_popovers';
 
 /**
  * CommitItem
@@ -38,6 +39,12 @@ export default {
     authorName() {
       return (this.commit.author && this.commit.author.name) || this.commit.author_name;
     },
+    authorClass() {
+      return this.commit.author && this.commit.author.name ? 'js-user-link' : '';
+    },
+    authorId() {
+      return this.commit.author && this.commit.author.name ? this.commit.author.id : '';
+    },
     authorUrl() {
       return (
         (this.commit.author && this.commit.author.web_url) || `mailto:${this.commit.author_email}`
@@ -49,6 +56,11 @@ export default {
       );
     },
   },
+  created() {
+    this.$nextTick(() => {
+      initUserPopovers(this.$el.querySelectorAll('.js-user-link'));
+    });
+  },
 };
 </script>
 
@@ -81,7 +93,13 @@ export default {
         </button>
 
         <div class="commiter">
-          <a :href="authorUrl" v-text="authorName"></a> {{ s__('CommitWidget|authored') }}
+          <a
+            :href="authorUrl"
+            :class="authorClass"
+            :data-user-id="authorId"
+            v-text="authorName"
+          ></a>
+          {{ s__('CommitWidget|authored') }}
           <time-ago-tooltip :time="commit.authored_date" />
         </div>
 

app/helpers/commits_helper.rb

@@ -154,7 +154,7 @@ module CommitsHelper
     if user.nil?
       mail_to(source_email, text, link_options)
     else
-      link_to(text, user_path(user), link_options)
+      link_to(text, user_path(user), {class: "commit-#{options[:source]}-link js-user-link",data: {user_id: user.id}})
     end
   end
 

app/views/admin/users/_user.html.haml

@@ -3,7 +3,7 @@
     = image_tag avatar_icon_for_user(user), class: "avatar", alt: ''
   .row-main-content
     .user-name.row-title.str-truncated-100
-      = link_to user.name, [:admin, user]
+      = link_to user.name, [:admin, user], class: "js-user-link", data: { user_id: user.id }
     - if user.blocked?
       %span.badge.badge-danger blocked
     - if user.admin?

app/views/shared/members/_member.html.haml

@@ -10,7 +10,7 @@
     - if user
       = image_tag avatar_icon_for_user(user, 40), class: "avatar s40", alt: ''
       .user-info
-        = link_to user.name, user_path(user), class: 'member'
+        = link_to user.name, user_path(user), class: 'member js-user-link', data: { user_id: user.id }
         = user_status(user)
         %span.cgray= user.to_reference