[Feature] Website live chat (#187)

Co-authored-by: Nithin David Thomas <webofnithin@gmail.com>
Co-authored-by: Sojan Jose <sojan@pepalo.com>

app/javascript/dashboard/components/ChatList.vue

@@ -121,7 +121,7 @@ export default {
     fetchData() {
       if (this.chatLists.length === 0) {
         this.$store.dispatch('fetchAllConversations', {
-          inbox: this.conversationInbox,
+          inboxId: this.conversationInbox ? this.conversationInbox : undefined,
           assigneeStatus: this.allMessageType,
           convStatus: this.activeStatusTab,
         });

app/javascript/dashboard/components/layout/SidebarItem.vue

@@ -22,7 +22,7 @@
     <ul v-if="menuItem.hasSubMenu" class="nested vertical menu">
       <router-link
         v-for="child in menuItem.children"
-        :key="child.label"
+        :key="child.id"
         active-class="active flex-container"
         :class="computedInboxClass(child)"
         tag="li"

app/javascript/dashboard/components/widgets/ChannelItem.vue

@@ -1,22 +1,50 @@
 <template>
-  <div class="small-3 columns channel" :class="{ inactive: channel !== 'facebook' }" @click.capture="itemClick">
-    <img src="~dashboard/assets/images/channels/facebook.png" v-if="channel === 'facebook'">
-    <img src="~dashboard/assets/images/channels/twitter.png" v-if="channel === 'twitter'">
-    <img src="~dashboard/assets/images/channels/telegram.png" v-if="channel === 'telegram'">
-    <img src="~dashboard/assets/images/channels/line.png" v-if="channel === 'line'">
-    <h3 class="channel__title">{{channel}}</h3>
-    <!-- <p>This is the most sexiest integration to begin </p> -->
+  <div
+    class="small-3 columns channel"
+    :class="{ inactive: !isActive(channel) }"
+    @click="onItemClick"
+  >
+    <img
+      v-if="channel === 'facebook'"
+      src="~dashboard/assets/images/channels/facebook.png"
+    />
+    <img
+      v-if="channel === 'twitter'"
+      src="~dashboard/assets/images/channels/twitter.png"
+    />
+    <img
+      v-if="channel === 'telegram'"
+      src="~dashboard/assets/images/channels/telegram.png"
+    />
+    <img
+      v-if="channel === 'line'"
+      src="~dashboard/assets/images/channels/line.png"
+    />
+    <img
+      v-if="channel === 'website'"
+      src="~dashboard/assets/images/channels/website.png"
+    />
+    <h3 class="channel__title">
+      {{ channel }}
+    </h3>
   </div>
 </template>
 <script>
-/* global bus */
 export default {
-  props: ['channel'],
-  created() {
+  props: {
+    channel: {
+      type: String,
+      required: true,
+    },
   },
   methods: {
-    itemClick() {
-      bus.$emit('channelItemClick', this.channel);
+    isActive(channel) {
+      return ['facebook', 'website'].includes(channel);
+    },
+    onItemClick() {
+      if (this.isActive(this.channel)) {
+        this.$emit('channel-item-click', this.channel);
+      }
     },
   },
 };