From f55a4ed58f0ea903c6939a9c28a9256b0eb51981 Mon Sep 17 00:00:00 2001
From: Mitchdev <admin@mitchdev.net>
Date: Sat, 16 Nov 2024 14:40:21 +1300
Subject: [PATCH] Add back whisper button and add/remove on hover

---
 assets/chat/css/menus/_user-list.scss | 15 ++-------------
 assets/chat/img/icon-share.svg        |  2 --
 assets/chat/js/menus/ChatUserMenu.js  | 24 ++++++++++++++++++++++++
 3 files changed, 26 insertions(+), 15 deletions(-)
 delete mode 100644 assets/chat/img/icon-share.svg

diff --git a/assets/chat/css/menus/_user-list.scss b/assets/chat/css/menus/_user-list.scss
index 10e45d14..12fde4d5 100644
--- a/assets/chat/css/menus/_user-list.scss
+++ b/assets/chat/css/menus/_user-list.scss
@@ -61,15 +61,13 @@
   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;
@@ -77,20 +75,11 @@
         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;
     }
diff --git a/assets/chat/img/icon-share.svg b/assets/chat/img/icon-share.svg
deleted file mode 100644
index af15296d..00000000
--- a/assets/chat/img/icon-share.svg
+++ /dev/null
@@ -1,2 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<svg width="1792" height="1792" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg"><path d="M1133 1101l352-352q19-19 19-45t-19-45l-352-352q-30-31-69-14-40 17-40 59v160q-119 0-216 19.5t-162.5 51-114 79-76.5 95.5-44.5 109-21.5 111.5-5 110.5q0 181 167 404 11 12 25 12 7 0 13-3 22-9 19-33-44-354 62-473 46-52 130-75.5t224-23.5v160q0 42 40 59 12 5 24 5 26 0 45-19zm531-685v960q0 119-84.5 203.5t-203.5 84.5h-960q-119 0-203.5-84.5t-84.5-203.5v-960q0-119 84.5-203.5t203.5-84.5h960q119 0 203.5 84.5t84.5 203.5z" fill="#fff"/></svg>
\ No newline at end of file
diff --git a/assets/chat/js/menus/ChatUserMenu.js b/assets/chat/js/menus/ChatUserMenu.js
index 1d421bad..6ffe88a1 100644
--- a/assets/chat/js/menus/ChatUserMenu.js
+++ b/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();