UX: show meaningful tooltip for user menu

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

@@ -18,6 +18,10 @@ const HeaderController = DiscourseController.extend({
     return Discourse.User.current() && !this.get('topic.isPrivateMessage');
   }.property('topic.isPrivateMessage'),
 
+  userDisplayName: function() {
+    return (Discourse.SiteSettings.enable_names && this.get('currentUser.name')) ? this.get('currentUser.name') : this.get('currentUser.username');
+  }.property('currentUser.name', 'currentUser.username'),
+
   _resetCachedNotifications: function() {
     // a bit hacky, but if we have no focus, hide notifications first
     const visible = $("#notifications-dropdown").is(":visible");

app/assets/javascripts/discourse/templates/header.hbs

@@ -68,7 +68,7 @@
                data-dropdown="user-dropdown"
                data-render="renderUserDropdown"
                href="#"
-               title='{{i18n 'user.avatar.title'}}'
+               title='{{i18n 'user.avatar.title' name=userDisplayName}}'
                id="current-user">
                  {{bound-avatar currentUser "medium"}}
             </a>

config/locales/client.en.yml

@@ -587,7 +587,7 @@ en:
       registration_ip_address:
         title: "Registration IP Address"
       avatar:
-        title: "Profile Picture"
+        title: "{{name}} profile"
       title:
         title: "Title"