FIX: Show names when available

app/assets/javascripts/discourse/helpers/user-avatar.js.es6

@@ -36,7 +36,7 @@ function renderAvatar(user, options) {
 
     if (!username || !avatarTemplate) { return ''; }
 
-    let formattedUsername = formatUsername(username);
+    let displayName = Ember.get(user, 'name') || formatUsername(username);
 
     let title = options.title;
     if (!title && !options.ignoreTitle) {
@@ -49,7 +49,7 @@ function renderAvatar(user, options) {
         // if a description has been provided
         if (description && description.length > 0) {
           // preprend the username before the description
-          title = formattedUsername + " - " + description;
+          title = displayName + " - " + description;
         }
       }
     }
@@ -57,7 +57,7 @@ function renderAvatar(user, options) {
     return avatarImg({
       size: options.imageSize,
       extraClasses: Em.get(user, 'extras') || options.extraClasses,
-      title: title || formattedUsername,
+      title: title || displayName,
       avatarTemplate: avatarTemplate
     });
   } else {

app/assets/javascripts/discourse/lib/transform-post.js.es6

@@ -138,10 +138,12 @@ export default function transformPost(currentUser, site, post, prevPost, nextPos
     postAtts.topicCreatedAt = topic.created_at;
     postAtts.createdByUsername = createdBy.username;
     postAtts.createdByAvatarTemplate = createdBy.avatar_template;
+    postAtts.createdByName = createdBy.name;
 
     postAtts.lastPostUrl = topic.get('lastPostUrl');
     postAtts.lastPostUsername = details.last_poster.username;
     postAtts.lastPostAvatarTemplate = details.last_poster.avatar_template;
+    postAtts.lastPostName = details.last_poster.name;
     postAtts.lastPostAt = topic.last_posted_at;
 
     postAtts.topicReplyCount = topic.get('replyCount');

app/assets/javascripts/discourse/widgets/header.js.es6

@@ -31,11 +31,17 @@ createWidget('header-notifications', {
   html(attrs) {
     const { user } = attrs;
 
+    let avatarAttrs = {
+      template: user.get('avatar_template'),
+      username: user.get('username')
+    };
+
+    if (this.siteSettings.enable_names) {
+      avatarAttrs.name = user.get('name');
+    }
+
     const contents = [
-      avatarImg(this.settings.avatarSize, addExtraUserClasses(user, {
+      avatarImg(this.settings.avatarSize, addExtraUserClasses(user, avatarAttrs))
-        template: user.get('avatar_template'),
-        username: user.get('username')
-      }))
     ];
 
     const unreadNotifications = user.get('unread_notifications');

app/assets/javascripts/discourse/widgets/post.js.es6

@@ -15,7 +15,7 @@ export function avatarImg(wanted, attrs) {
 
   // We won't render an invalid url
   if (!url || url.length === 0) { return; }
-  const title = formatUsername(attrs.username);
+  const title = attrs.name || formatUsername(attrs.username);
 
   let className = 'avatar' + (
     attrs.extraClasses ? " " + attrs.extraClasses : ""
@@ -123,6 +123,7 @@ createWidget('post-avatar', {
       body = avatarFor.call(this, this.settings.size, {
         template: attrs.avatar_template,
         username: attrs.username,
+        name: attrs.name,
         url: attrs.usernameUrl,
         className: 'main-avatar'
       });

app/assets/javascripts/discourse/widgets/topic-map.js.es6

@@ -37,7 +37,12 @@ createWidget('topic-participant', {
   },
 
   html(attrs, state) {
-    const linkContents = [avatarImg('medium', { username: attrs.username, template: attrs.avatar_template })];
+    const linkContents = [
+      avatarImg('medium', {
+        username: attrs.username,
+        template: attrs.avatar_template,
+        name: attrs.name
+      })];
 
     if (attrs.post_count > 2) {
       linkContents.push(h('span.post-count', attrs.post_count.toString()));
@@ -67,7 +72,11 @@ createWidget('topic-map-summary', {
       [
         h('h4', I18n.t('created_lowercase')),
         h('div.topic-map-post.created-at', [
-          avatarFor('tiny', { username: attrs.createdByUsername, template: attrs.createdByAvatarTemplate }),
+          avatarFor('tiny', {
+            username: attrs.createdByUsername,
+            template: attrs.createdByAvatarTemplate,
+            name: attrs.createdByName
+          }),
           dateNode(attrs.topicCreatedAt)
         ])
       ]
@@ -76,7 +85,11 @@ createWidget('topic-map-summary', {
       h('a', { attributes: { href: attrs.lastPostUrl } }, [
         h('h4', I18n.t('last_reply_lowercase')),
         h('div.topic-map-post.last-reply', [
-          avatarFor('tiny', { username: attrs.lastPostUsername, template: attrs.lastPostAvatarTemplate }),
+          avatarFor('tiny', {
+            username: attrs.lastPostUsername,
+            template: attrs.lastPostAvatarTemplate,
+            name: attrs.lastPostName
+          }),
           dateNode(attrs.lastPostAt)
         ])
       ])