chore: Replace inboxMixin with useInbox composable

2024-08-23 15:07:27 +05:30
parent 8473e72a7e
commit 6577b40f90
15 changed files with 378 additions and 66 deletions
@@ -1,10 +1,9 @@
 <script>
 import { MESSAGE_TYPE, MESSAGE_STATUS } from 'shared/constants/messages';
-import inboxMixin from 'shared/mixins/inboxMixin';
+import { useInbox } from 'shared/composables/useInbox';
 import { messageTimestamp } from 'shared/helpers/timeHelper';

 export default {
-  mixins: [inboxMixin],
  props: {
    sender: {
      type: Object,
@@ -55,10 +54,33 @@ export default {
      default: 0,
    },
  },
+  setup(props) {
+    const {
+      inbox,
+      isAWhatsAppChannel,
+      isATwilioChannel,
+      isAFacebookInbox,
+      isASmsInbox,
+      isATelegramChannel,
+      isALineChannel,
+      isAWebWidgetInbox,
+      isAPIInbox,
+      isAnEmailChannel,
+    } = useInbox({ inboxId: props.inboxId });
+    return {
+      inbox,
+      isAWhatsAppChannel,
+      isATwilioChannel,
+      isAFacebookInbox,
+      isASmsInbox,
+      isATelegramChannel,
+      isALineChannel,
+      isAWebWidgetInbox,
+      isAPIInbox,
+      isAnEmailChannel,
+    };
+  },
  computed: {
-    inbox() {
-      return this.$store.getters['inboxes/getInbox'](this.inboxId);
-    },
    isIncoming() {
      return MESSAGE_TYPE.INCOMING === this.messageType;
    },
@@ -1,10 +1,9 @@
 <script>
 import DyteVideoCall from './integrations/Dyte.vue';
-import inboxMixin from 'shared/mixins/inboxMixin';
+import { useInbox } from 'shared/composables/useInbox';

 export default {
  components: { DyteVideoCall },
-  mixins: [inboxMixin],
  props: {
    messageId: {
      type: [String, Number],
@@ -19,14 +18,20 @@ export default {
      default: 0,
    },
  },
+  setup(props) {
+    const { isAPIInbox, isAWebWidgetInbox } = useInbox({
+      inboxId: props.inboxId,
+    });
+    return {
+      isAPIInbox,
+      isAWebWidgetInbox,
+    };
+  },
  computed: {
    showDyteIntegration() {
      const isEnabledOnTheInbox = this.isAPIInbox || this.isAWebWidgetInbox;
      return isEnabledOnTheInbox && this.contentAttributes.type === 'dyte';
    },
-    inbox() {
-      return this.$store.getters['inboxes/getInbox'](this.inboxId);
-    },
  },
 };
 </script>