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() {