Small tweaks

src/App.vue

@@ -3499,6 +3499,7 @@ export default {
                             <MessageBox
                                 v-else
                                 :message="msg"
+                                :position="i"
                                 :user="getUser(msg.username)"
                                 :username="username"
                                 :website-url="config.website"

src/components/MessageBox.vue

@@ -9,6 +9,7 @@ export default {
         isMuted: Boolean,   // user is muted by current user
         reactions: Object,  // emoji reactions on the message
         reportEnabled: Boolean, // Report Message webhook is available
+        position: Number,   // position of the message (0 to n), for the emoji menu to know which side to pop
         isDm: Boolean,      // is in a DM thread (hide DM buttons)
         isOp: Boolean,      // current user is Operator (always show takeback button)
         noButtons: Boolean, // hide all message buttons (e.g. for Report Modal)
@@ -240,7 +241,7 @@ export default {
             </div>
 
             <!-- Emoji reactions menu -->
-            <div class="column dropdown is-right" :class="{ 'is-up': i >= 2 }"
+            <div class="column dropdown is-right" :class="{ 'is-up': position >= 2 }"
                 onclick="this.classList.toggle('is-active')">
                 <div class="dropdown-trigger">
                     <button class="button is-small px-2" aria-haspopup="true"

src/components/WhoListRow.vue

@@ -189,8 +189,8 @@ export default {
                 :title="vipConfig.Name"></sup>
         </div>
         <div class="column is-narrow pl-0">
-            <!-- Emoji icon -->
-            <span v-if="user.emoji" class="pr-1 cursor-default" :title="user.emoji">
+            <!-- Emoji icon (Who's Online tab only) -->
+            <span v-if="user.emoji && !isWatchingTab" class="pr-1 cursor-default" :title="user.emoji">
                 {{ user.emoji.split(" ")[0] }}
             </span>
 
@@ -214,9 +214,8 @@ export default {
                 <i class="fa" :class="{ 'fa-comment': !user.dnd, 'fa-comment-slash': user.dnd }"></i>
             </button>
 
-            <!-- Video button (Who List tab) -->
+            <!-- Video button -->
             <button type="button" class="button is-small px-2 py-1"
-                v-if="!isWatchingTab"
                 :disabled="!(user.video & VideoFlag.Active)"
                 :class="videoButtonClass"
                 :title="videoButtonTitle"
@@ -224,8 +223,8 @@ export default {
                 <i class="fa" :class="videoIconClass"></i>
             </button>
 
-            <!-- Boot from Video button (Watching tab) -->
-            <button v-else type="button" class="button is-small px-2 py-1"
+            <!-- Boot from Video button (Watching tab only) -->
+            <button v-if="isWatchingTab" type="button" class="button is-small px-2 py-1"
                 @click="bootUser()"
                 title="Kick this person off your cam">
                 <i class="fa fa-user-xmark has-text-danger"></i>