mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-11-04 04:57:51 +00:00 
			
		
		
		
	chore: Displayed WhatsApp API provider name in inbox settings (#5346)
This commit is contained in:
		@@ -260,7 +260,7 @@ export default {
 | 
			
		||||
      return this.showAudioRecorder && this.isRecordingAudio;
 | 
			
		||||
    },
 | 
			
		||||
    allowedFileTypes() {
 | 
			
		||||
      if (this.isATwilioWhatsappChannel) {
 | 
			
		||||
      if (this.isATwilioWhatsAppChannel) {
 | 
			
		||||
        return ALLOWED_FILE_TYPES_FOR_TWILIO_WHATSAPP;
 | 
			
		||||
      }
 | 
			
		||||
      return ALLOWED_FILE_TYPES;
 | 
			
		||||
 
 | 
			
		||||
@@ -240,7 +240,7 @@ export default {
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    replyWindowBannerMessage() {
 | 
			
		||||
      if (this.isAWhatsappChannel) {
 | 
			
		||||
      if (this.isAWhatsAppChannel) {
 | 
			
		||||
        return this.$t('CONVERSATION.TWILIO_WHATSAPP_CAN_REPLY');
 | 
			
		||||
      }
 | 
			
		||||
      if (this.isAPIInbox) {
 | 
			
		||||
@@ -256,7 +256,7 @@ export default {
 | 
			
		||||
      return this.$t('CONVERSATION.CANNOT_REPLY');
 | 
			
		||||
    },
 | 
			
		||||
    replyWindowLink() {
 | 
			
		||||
      if (this.isAWhatsappChannel) {
 | 
			
		||||
      if (this.isAWhatsAppChannel) {
 | 
			
		||||
        return REPLY_POLICY.FACEBOOK;
 | 
			
		||||
      }
 | 
			
		||||
      if (!this.isAPIInbox) {
 | 
			
		||||
@@ -265,7 +265,7 @@ export default {
 | 
			
		||||
      return '';
 | 
			
		||||
    },
 | 
			
		||||
    replyWindowLinkText() {
 | 
			
		||||
      if (this.isAWhatsappChannel) {
 | 
			
		||||
      if (this.isAWhatsAppChannel) {
 | 
			
		||||
        return this.$t('CONVERSATION.24_HOURS_WINDOW');
 | 
			
		||||
      }
 | 
			
		||||
      if (!this.isAPIInbox) {
 | 
			
		||||
 
 | 
			
		||||
@@ -277,7 +277,7 @@ export default {
 | 
			
		||||
      return !!this.uiSettings.enter_to_send_enabled;
 | 
			
		||||
    },
 | 
			
		||||
    isPrivate() {
 | 
			
		||||
      if (this.currentChat.can_reply || this.isAWhatsappChannel) {
 | 
			
		||||
      if (this.currentChat.can_reply || this.isAWhatsAppChannel) {
 | 
			
		||||
        return this.isOnPrivateNote;
 | 
			
		||||
      }
 | 
			
		||||
      return true;
 | 
			
		||||
@@ -324,7 +324,7 @@ export default {
 | 
			
		||||
      if (this.isAFacebookInbox) {
 | 
			
		||||
        return MESSAGE_MAX_LENGTH.FACEBOOK;
 | 
			
		||||
      }
 | 
			
		||||
      if (this.isAWhatsappChannel) {
 | 
			
		||||
      if (this.isAWhatsAppChannel) {
 | 
			
		||||
        return MESSAGE_MAX_LENGTH.TWILIO_WHATSAPP;
 | 
			
		||||
      }
 | 
			
		||||
      if (this.isASmsInbox) {
 | 
			
		||||
@@ -341,7 +341,7 @@ export default {
 | 
			
		||||
      return (
 | 
			
		||||
        this.isAWebWidgetInbox ||
 | 
			
		||||
        this.isAFacebookInbox ||
 | 
			
		||||
        this.isAWhatsappChannel ||
 | 
			
		||||
        this.isAWhatsAppChannel ||
 | 
			
		||||
        this.isAPIInbox ||
 | 
			
		||||
        this.isAnEmailChannel ||
 | 
			
		||||
        this.isASmsInbox ||
 | 
			
		||||
@@ -430,7 +430,7 @@ export default {
 | 
			
		||||
        return;
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      if (canReply || this.isAWhatsappChannel) {
 | 
			
		||||
      if (canReply || this.isAWhatsAppChannel) {
 | 
			
		||||
        this.replyType = REPLY_EDITOR_MODES.REPLY;
 | 
			
		||||
      } else {
 | 
			
		||||
        this.replyType = REPLY_EDITOR_MODES.NOTE;
 | 
			
		||||
@@ -586,7 +586,7 @@ export default {
 | 
			
		||||
    setReplyMode(mode = REPLY_EDITOR_MODES.REPLY) {
 | 
			
		||||
      const { can_reply: canReply } = this.currentChat;
 | 
			
		||||
 | 
			
		||||
      if (canReply || this.isAWhatsappChannel) this.replyType = mode;
 | 
			
		||||
      if (canReply || this.isAWhatsAppChannel) this.replyType = mode;
 | 
			
		||||
      if (this.showRichContentEditor) {
 | 
			
		||||
        if (this.isRecordingAudio) {
 | 
			
		||||
          this.toggleAudioRecorder();
 | 
			
		||||
 
 | 
			
		||||
@@ -168,7 +168,7 @@ export default {
 | 
			
		||||
      return (
 | 
			
		||||
        this.isOutgoing &&
 | 
			
		||||
        this.sourceId &&
 | 
			
		||||
        (this.isAnEmailChannel || this.isAWhatsappChannel)
 | 
			
		||||
        (this.isAnEmailChannel || this.isAWhatsAppChannel)
 | 
			
		||||
      );
 | 
			
		||||
    },
 | 
			
		||||
  },
 | 
			
		||||
 
 | 
			
		||||
@@ -116,6 +116,11 @@
 | 
			
		||||
          <woot-color-picker v-model="inbox.widget_color" />
 | 
			
		||||
        </label>
 | 
			
		||||
 | 
			
		||||
        <label v-if="isAWhatsAppChannel" class="medium-9 columns settings-item">
 | 
			
		||||
          {{ $t('INBOX_MGMT.ADD.WHATSAPP.PROVIDERS.LABEL') }}
 | 
			
		||||
          <input v-model="whatsAppAPIProviderName" type="text" disabled />
 | 
			
		||||
        </label>
 | 
			
		||||
 | 
			
		||||
        <label class="medium-9 columns settings-item">
 | 
			
		||||
          {{
 | 
			
		||||
            $t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.LABEL')
 | 
			
		||||
@@ -388,6 +393,18 @@ export default {
 | 
			
		||||
    selectedTabKey() {
 | 
			
		||||
      return this.tabs[this.selectedTabIndex]?.key;
 | 
			
		||||
    },
 | 
			
		||||
    whatsAppAPIProviderName() {
 | 
			
		||||
      if (this.isAWhatsAppCloudChannel) {
 | 
			
		||||
        return this.$t('INBOX_MGMT.ADD.WHATSAPP.PROVIDERS.WHATSAPP_CLOUD');
 | 
			
		||||
      }
 | 
			
		||||
      if (this.is360DialogWhatsAppChannel) {
 | 
			
		||||
        return this.$t('INBOX_MGMT.ADD.WHATSAPP.PROVIDERS.360_DIALOG');
 | 
			
		||||
      }
 | 
			
		||||
      if (this.isATwilioWhatsAppChannel) {
 | 
			
		||||
        return this.$t('INBOX_MGMT.ADD.WHATSAPP.PROVIDERS.TWILIO');
 | 
			
		||||
      }
 | 
			
		||||
      return '';
 | 
			
		||||
    },
 | 
			
		||||
    tabs() {
 | 
			
		||||
      const visibleToAllChannelTabs = [
 | 
			
		||||
        {
 | 
			
		||||
@@ -427,7 +444,7 @@ export default {
 | 
			
		||||
        this.isALineChannel ||
 | 
			
		||||
        this.isAPIInbox ||
 | 
			
		||||
        this.isAnEmailChannel ||
 | 
			
		||||
        this.isAWhatsappChannel
 | 
			
		||||
        this.isAWhatsAppChannel
 | 
			
		||||
      ) {
 | 
			
		||||
        return [
 | 
			
		||||
          ...visibleToAllChannelTabs,
 | 
			
		||||
@@ -447,11 +464,11 @@ export default {
 | 
			
		||||
      return this.$store.getters['inboxes/getInbox'](this.currentInboxId);
 | 
			
		||||
    },
 | 
			
		||||
    inboxName() {
 | 
			
		||||
      if (this.isATwilioSMSChannel || this.isATwilioWhatsappChannel) {
 | 
			
		||||
      if (this.isATwilioSMSChannel || this.isATwilioWhatsAppChannel) {
 | 
			
		||||
        return `${this.inbox.name} (${this.inbox.messaging_service_sid ||
 | 
			
		||||
          this.inbox.phone_number})`;
 | 
			
		||||
      }
 | 
			
		||||
      if (this.isAWhatsappChannel) {
 | 
			
		||||
      if (this.isAWhatsAppChannel) {
 | 
			
		||||
        return `${this.inbox.name} (${this.inbox.phone_number})`;
 | 
			
		||||
      }
 | 
			
		||||
      if (this.isAnEmailChannel) {
 | 
			
		||||
 
 | 
			
		||||
@@ -91,7 +91,7 @@
 | 
			
		||||
    <imap-settings :inbox="inbox" />
 | 
			
		||||
    <smtp-settings v-if="inbox.imap_enabled" :inbox="inbox" />
 | 
			
		||||
  </div>
 | 
			
		||||
  <div v-else-if="isAWhatsappChannel && !isATwilioChannel">
 | 
			
		||||
  <div v-else-if="isAWhatsAppChannel && !isATwilioChannel">
 | 
			
		||||
    <div v-if="inbox.provider_config" class="settings--content">
 | 
			
		||||
      <settings-section
 | 
			
		||||
        :title="$t('INBOX_MGMT.SETTINGS_POPUP.WHATSAPP_SECTION_TITLE')"
 | 
			
		||||
 
 | 
			
		||||
@@ -16,6 +16,9 @@ export default {
 | 
			
		||||
    channelType() {
 | 
			
		||||
      return this.inbox.channel_type;
 | 
			
		||||
    },
 | 
			
		||||
    whatsAppAPIProvider() {
 | 
			
		||||
      return this.inbox.provider || '';
 | 
			
		||||
    },
 | 
			
		||||
    isAPIInbox() {
 | 
			
		||||
      return this.channelType === INBOX_TYPES.API;
 | 
			
		||||
    },
 | 
			
		||||
@@ -47,10 +50,22 @@ export default {
 | 
			
		||||
    isASmsInbox() {
 | 
			
		||||
      return this.channelType === INBOX_TYPES.SMS || this.isATwilioSMSChannel;
 | 
			
		||||
    },
 | 
			
		||||
    isATwilioWhatsappChannel() {
 | 
			
		||||
    isATwilioWhatsAppChannel() {
 | 
			
		||||
      const { medium: medium = '' } = this.inbox;
 | 
			
		||||
      return this.isATwilioChannel && medium === 'whatsapp';
 | 
			
		||||
    },
 | 
			
		||||
    isAWhatsAppCloudChannel() {
 | 
			
		||||
      return (
 | 
			
		||||
        this.channelType === INBOX_TYPES.WHATSAPP &&
 | 
			
		||||
        this.whatsAppAPIProvider === 'whatsapp_cloud'
 | 
			
		||||
      );
 | 
			
		||||
    },
 | 
			
		||||
    is360DialogWhatsAppChannel() {
 | 
			
		||||
      return (
 | 
			
		||||
        this.channelType === INBOX_TYPES.WHATSAPP &&
 | 
			
		||||
        this.whatsAppAPIProvider === 'default'
 | 
			
		||||
      );
 | 
			
		||||
    },
 | 
			
		||||
    chatAdditionalAttributes() {
 | 
			
		||||
      const { additional_attributes: additionalAttributes } = this.chat || {};
 | 
			
		||||
      return additionalAttributes || {};
 | 
			
		||||
@@ -75,15 +90,15 @@ export default {
 | 
			
		||||
        badgeKey = this.facebookBadge;
 | 
			
		||||
      } else if (this.isATwilioChannel) {
 | 
			
		||||
        badgeKey = this.twilioBadge;
 | 
			
		||||
      } else if (this.isAWhatsappChannel) {
 | 
			
		||||
      } else if (this.isAWhatsAppChannel) {
 | 
			
		||||
        badgeKey = 'whatsapp';
 | 
			
		||||
      }
 | 
			
		||||
      return badgeKey || this.channelType;
 | 
			
		||||
    },
 | 
			
		||||
    isAWhatsappChannel() {
 | 
			
		||||
    isAWhatsAppChannel() {
 | 
			
		||||
      return (
 | 
			
		||||
        this.channelType === INBOX_TYPES.WHATSAPP ||
 | 
			
		||||
        this.isATwilioWhatsappChannel
 | 
			
		||||
        this.isATwilioWhatsAppChannel
 | 
			
		||||
      );
 | 
			
		||||
    },
 | 
			
		||||
  },
 | 
			
		||||
 
 | 
			
		||||
@@ -109,7 +109,7 @@ describe('inboxMixin', () => {
 | 
			
		||||
    expect(wrapper.vm.isASmsInbox).toBe(true);
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  it('isATwilioWhatsappChannel returns true if channel type is Twilio and medium is whatsapp', () => {
 | 
			
		||||
  it('isATwilioWhatsAppChannel returns true if channel type is Twilio and medium is WhatsApp', () => {
 | 
			
		||||
    const Component = {
 | 
			
		||||
      render() {},
 | 
			
		||||
      mixins: [inboxMixin],
 | 
			
		||||
@@ -124,7 +124,7 @@ describe('inboxMixin', () => {
 | 
			
		||||
    };
 | 
			
		||||
    const wrapper = shallowMount(Component);
 | 
			
		||||
    expect(wrapper.vm.isATwilioChannel).toBe(true);
 | 
			
		||||
    expect(wrapper.vm.isATwilioWhatsappChannel).toBe(true);
 | 
			
		||||
    expect(wrapper.vm.isATwilioWhatsAppChannel).toBe(true);
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  it('isAnEmailChannel returns true if channel type is email', () => {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user