fix: Render inbox icon properly (#3219)

app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue

@@ -128,6 +128,10 @@ export default {
       color: var(--w-100);
     }
   }
+
+  .icon {
+    color: var(--white);
+  }
 }
 
 .left {
@@ -138,12 +142,6 @@ export default {
   }
 }
 
-.right {
-  .icon {
-    color: var(--white);
-  }
-}
-
 .message-text--metadata {
   align-items: flex-end;
   display: flex;
@@ -202,6 +200,10 @@ export default {
     .time {
       color: var(--s-400);
     }
+
+    .icon {
+      color: var(--s-400);
+    }
   }
 
   &.is-image {

app/javascript/dashboard/modules/contact/components/ContactDropdownItem.vue

@@ -5,7 +5,7 @@
       <h5 class="option__title">
         {{ name }}
         <span v-if="identifier" class="user-identifier">
-          ( id: {{ identifier }} )
+          (ID: {{ identifier }})
         </span>
       </h5>
       <p class="option__body">

app/javascript/shared/mixins/inboxMixin.js

@@ -64,7 +64,7 @@ export default {
       return this.chatAdditionalAttributes.type || 'facebook';
     },
     inboxBadge() {
-      const badgeKey = '';
+      let badgeKey = '';
       if (this.isATwitterInbox) {
         badgeKey = this.twitterBadge;
       } else if (this.isAFacebookInbox) {