UX: Display group fullname in mention autocomplete.

app/assets/javascripts/discourse/helpers/max-usernames.js.es6

@@ -1,10 +0,0 @@
-import { registerUnbound } from 'discourse-common/lib/helpers';
-
-registerUnbound('max-usernames', function(usernames, params) {
-  var maxLength = parseInt(params.max) || 3;
-  if (usernames.length > maxLength){
-    return usernames.slice(0, maxLength).join(", ") + ", +" + (usernames.length - maxLength);
-  } else {
-    return usernames.join(", ");
-  }
-});

app/assets/javascripts/discourse/templates/user-selector-autocomplete.raw.hbs

@@ -1,8 +1,8 @@
-<div class='autocomplete'>
+<div class='user-selector autocomplete'>
   <ul>
     {{#each options.users as |user|}}
-      <li>
-        <a href>
+      <li class="user-selector-item">
+        <a href title="{{user.name}}">
           {{avatar user imageSize="tiny"}}
           <span class='username'>{{user.username}}</span>
           <span class='name'>{{user.name}}</span>
@@ -11,11 +11,11 @@
     {{/each}}
     {{#if options.groups}}
       {{#each options.groups as |group|}}
-        <li>
-          <a href>
+        <li class="user-selector-item">
+          <a href title="{{group.full_name}}">
             <i class='fa fa-users'></i>
             <span class='username'>{{group.name}}</span>
-            <span class='name'>{{max-usernames group.usernames max="3"}}</span>
+            <span class='name'>{{group.full_name}}</span>
           </a>
         </li>
       {{/each}}

app/assets/stylesheets/common/base/compose.scss

@@ -8,26 +8,27 @@
     list-style: none;
     padding: 0;
     margin: 0;
-    li {
+
+    .user-selector-item {
       .fa-users {
         color: lighten($primary, 40%);
         padding: 0 2px;
       }
+
       border-bottom: 1px solid dark-light-diff($primary, $secondary, 90%, -60%);
-      a[href] {
+
+      a {
         padding: 5px;
         display: block;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+
         span.username {
           color: darken($primary, 40%);
-          display: inline-block;
         }
         span.name {
           font-size: 11px;
-          display: inline-block;
-          width: 90px;
-          white-space: nowrap;
-          overflow: hidden;
-          text-overflow: ellipsis;
           vertical-align: middle;
         }
         &.selected {

app/controllers/users_controller.rb

@@ -568,7 +568,7 @@ class UsersController < ApplicationController
 
     if params[:include_groups] == "true"
       to_render[:groups] = Group.search_group(term).map do |m|
-        {name: m.name, usernames: []}
+        { name: m.name, full_name: m.full_name }
       end
     end
 
@@ -576,7 +576,7 @@ class UsersController < ApplicationController
       to_render[:groups] = Group.mentionable(current_user)
                                 .where("name ILIKE :term_like", term_like: "#{term}%")
                                 .map do |m|
-        {name: m.name, usernames: []}
+        { name: m.name, full_name: m.full_name }
       end
     end