users: add dropdown actions to username tooltips.

app/javascript/src/javascripts/user_tooltips.js

@@ -25,6 +25,19 @@ UserTooltip.initialize = function () {
     onShow: UserTooltip.on_show,
     onHide: UserTooltip.on_hide,
   });
+
+  delegate("body", {
+    allowHTML: true,
+    interactive: true,
+    theme: "common-tooltip",
+    target: ".user-tooltip-menu-button",
+    placement: "bottom",
+    touch: false,
+    trigger: "click",
+    content: (element) => {
+      return $(element).parents(".user-tooltip").find(".user-tooltip-menu").get(0);
+    }
+  });
 };
 
 UserTooltip.on_show = async function (instance) {

app/javascript/src/styles/specific/user_tooltips.scss

@@ -6,9 +6,9 @@
     margin-bottom: 1em;
     display: grid;
     grid:
-      "avatar header-top"
+      "avatar header-top menu"
-      "avatar header-bottom" /
+      "avatar header-bottom menu" /
-      32px 1fr;
+      32px 1fr 32px;
     column-gap: 0.25em;
 
     .user-tooltip-avatar {
@@ -54,6 +54,31 @@
       color: var(--muted-text-color);
       font-size: 0.75em;
     }
+
+    a.user-tooltip-menu-button {
+      color: var(--muted-text-color);
+      grid-area: menu;
+      align-self: center;
+      text-align: center;
+      width: 28px;
+      height: 28px;
+      line-height: 28px;
+      border-radius: 50%;
+
+      &:hover {
+        background-color: var(--subnav-menu-background-color);
+      }
+    }
+
+    > ul.user-tooltip-menu {
+      display: none;
+    }
+
+    ul.user-tooltip-menu {
+      .icon {
+        width: 1.5em;
+      }
+    }
   }
 
   .user-tooltip-stats {

app/views/users/show.html+tooltip.erb

@@ -43,6 +43,55 @@
         <% end %>
       <% end %>
     </div>
+
+    <a class="user-tooltip-menu-button" href="javascript:void(0)">
+      <i class="fas fa-ellipsis-h"></i>
+    </a>
+
+    <ul class="user-tooltip-menu">
+      <li>
+        <%= link_to new_dmail_path(dmail: { to_id: @user.id }) do %>
+          <i class="icon far fa-envelope"></i>
+          Send Message
+        <% end %>
+      </li>
+
+      <% if !@user.is_platinum? %>
+        <li>
+          <%= link_to new_user_upgrade_path(user_id: @user.id) do %>
+            <i class="icon fas fa-gift"></i>
+            Gift Upgrade
+          <% end %>
+        </li>
+      <% end %>
+
+      <% if policy(UserFeedback.new(user: @user)).create? %>
+        <li>
+          <%= link_to new_user_feedback_path(user_feedback: { user_id: @user.id }) do %>
+            <i class="icon fas fa-file-signature"></i>
+            Give Feedback
+          <% end %>
+        </li>
+      <% end %>
+
+      <% if policy(CurrentUser.user).promote? %>
+        <li>
+          <%= link_to edit_admin_user_path(@user.id) do %>
+            <i class="icon fas fa-user-plus"></i>
+            Promote User
+          <% end %>
+        </li>
+      <% end %>
+
+      <% if policy(Ban.new(user: @user)).create? %>
+        <li>
+          <%= link_to new_ban_path(ban: { user_id: @user.id }) do %>
+            <i class="icon fas fa-user-slash"></i>
+            Ban User
+          <% end %>
+        </li>
+      <% end %>
+    </ul>
   </div>
 
   <ul class="user-tooltip-stats">