Add back whisper button and add/remove on hover

assets/chat/css/menus/_user-list.scss

@@ -61,36 +61,25 @@
   display: flex;
 
   .user-actions {
+    display: flex;
     position: absolute;
     right: a.$gutter-md;
 
-    .mention-nick,
     .whisper-nick {
+      @include a.icon-background('../img/icon-whisper.svg');
       visibility: hidden;
-      margin-right: a.$gutter-xs;
-      margin-top: 0.45em;
-      display: inline-block;
       opacity: 0.25;
       width: 1em;
       height: 1em;
       &:hover {
         opacity: 1;
       }
     }
-
-    .mention-nick {
-      @include a.icon-background('../img/icon-share.svg');
-    }
-
-    .whisper-nick {
-      @include a.icon-background('../img/icon-whisper.svg');
-    }
   }
 
   &:hover {
     background: #282828;
 
-    .mention-nick,
     .whisper-nick {
       visibility: visible;
     }

assets/chat/js/menus/ChatUserMenu.js

@@ -52,6 +52,20 @@ export default class ChatUserMenu extends ChatMenu {
         true,
       ),
     );
+    this.userActionsNode = this.createUserActionNode();
+    this.container.on('mouseenter', '.user-entry', (e) => {
+      e.currentTarget.appendChild(this.userActionsNode);
+    });
+    this.container.on('mouseleave', '.user-entry', (e) => {
+      e.currentTarget.removeChild(this.userActionsNode);
+    });
+    this.container.on('click', '.whisper-nick', (e) => {
+      ChatMenu.closeMenus(this.chat);
+      const value = this.chat.input.val().toString().trim();
+      const username = $(e.target).parent().parent().data('username');
+      this.chat.input.val(`/whisper ${username} ${value}`).focus();
+      return false;
+    });
     this.container.on('contextmenu', '.users .user-entry', (e) => {
       const userinfo = this.chat.menus.get('user-info');
       if (userinfo) {
@@ -78,6 +92,16 @@ export default class ChatUserMenu extends ChatMenu {
     );
   }
 
+  createUserActionNode() {
+    const userActions = document.createElement('div');
+    userActions.classList.add('user-actions');
+    const whisperButton = document.createElement('i');
+    whisperButton.classList.add('whisper-nick');
+    whisperButton.title = 'Whisper';
+    userActions.append(whisperButton);
+    return userActions;
+  }
+
   show() {
     super.show();
     this.searchinput.focus();