From df527088e90b5b0649099ccba22ae515d42fbbdc Mon Sep 17 00:00:00 2001
From: SarawutKl <nop_zixcross@hotmail.com>
Date: Mon, 5 Oct 2020 00:27:11 +0700
Subject: [PATCH] fix: Replace Whatsapp inbox icon (#1311)

---
 app/javascript/dashboard/components/layout/Sidebar.vue |  1 +
 .../dashboard/components/layout/SidebarItem.vue        | 10 ++++++----
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/app/javascript/dashboard/components/layout/Sidebar.vue b/app/javascript/dashboard/components/layout/Sidebar.vue
index c99816683..0b06cfdc0 100644
--- a/app/javascript/dashboard/components/layout/Sidebar.vue
+++ b/app/javascript/dashboard/components/layout/Sidebar.vue
@@ -258,6 +258,7 @@ export default {
           label: inbox.name,
           toState: frontendURL(`accounts/${this.accountId}/inbox/${inbox.id}`),
           type: inbox.channel_type,
+          phoneNumber: inbox.phone_number,
         })),
       };
     },
diff --git a/app/javascript/dashboard/components/layout/SidebarItem.vue b/app/javascript/dashboard/components/layout/SidebarItem.vue
index e75b40619..396033f76 100644
--- a/app/javascript/dashboard/components/layout/SidebarItem.vue
+++ b/app/javascript/dashboard/components/layout/SidebarItem.vue
@@ -59,7 +59,7 @@ import router from '../../routes';
 import adminMixin from '../../mixins/isAdmin';
 import { INBOX_TYPES } from 'shared/mixins/inboxMixin';
 
-const getInboxClassByType = type => {
+const getInboxClassByType = (type, phoneNumber) => {
   switch (type) {
     case INBOX_TYPES.WEB:
       return 'ion-earth';
@@ -71,7 +71,9 @@ const getInboxClassByType = type => {
       return 'ion-social-twitter';
 
     case INBOX_TYPES.TWILIO:
-      return 'ion-android-textsms';
+      return phoneNumber.startsWith('whatsapp')
+        ? 'ion-social-whatsapp-outline'
+        : 'ion-android-textsms';
 
     case INBOX_TYPES.API:
       return 'ion-cloud';
@@ -119,8 +121,8 @@ export default {
   },
   methods: {
     computedInboxClass(child) {
-      const { type } = child;
-      const classByType = getInboxClassByType(type);
+      const { type, phoneNumber } = child;
+      const classByType = getInboxClassByType(type, phoneNumber);
       return classByType;
     },
     newLinkClick() {