@capillarytech/creatives-library 7.10.50 → 7.10.52

package/v2Components/TemplatePreview/index.js

@@ -10,7 +10,7 @@ import React from 'react';
 import _ from 'lodash';
 import { injectIntl, FormattedMessage, intlShape } from 'react-intl';
 // import styled from 'styled-components';
-import {CapColumn, CapRow, CapHeading, CapIcon, CapButton, CapImage} from '@capillarytech/cap-ui-library';
+import { CapColumn, CapRow, CapHeading, CapIcon, CapButton, CapImage, CapLabel } from '@capillarytech/cap-ui-library';
 import './_templatePreview.scss';
 import {updateCharCount} from '../../utils/smsCharCountV2';
 import messages from './messages';
@@ -20,11 +20,11 @@ import {
 } from '../../v2Containers/CreativesContainer/constants';
 import Carousel from '../Carousel';
 import { VIBER, FACEBOOK } from '../../v2Containers/App/constants';
+import whatsappMobileAndroid from './assets/images/whatsapp_mobile_android.svg'
 const wechatBodyNew = require('./assets/images/wechat_mobile_android.svg');
 const smsMobileAndroid = require('./assets/images/sms_mobile_android.svg');
 const lineMobileAndroid = require('../../assets/line.png');
 const viberMobileAndroid = require('./assets/images/viberMobile.svg');
-const whatsappMobileAndroid = require('./assets/images/whatsapp_mobile_android.svg');
 
 const lineImgPlaceholder = require('../../assets/line-image-placeholder.svg');
 const lineStickerPlaceholder = require('../../assets/smiley-placeholder.svg');
@@ -32,10 +32,20 @@ const lineVideoPlaceholder = require('../../assets/rich-video-placeholder.svg');
 const androidPushMessagePhone = require('./assets/images/androidPushMessage.svg');
 const iPhonePushMessagePhone = require('./assets/images/iPhonePushMessage.svg');
 
-import { CAP_COLOR_03, CAP_WHITE, FONT_COLOR_01, CAP_G08, CAP_G06, CAP_G15, CAP_PURPLE01, CAP_G16, CAP_SPACE_08 } from '@capillarytech/cap-ui-library/styled/variables';
+import { 
+  CAP_COLOR_03,
+  CAP_WHITE,
+  FONT_COLOR_01,
+  CAP_G06,
+  CAP_G15,
+  CAP_PURPLE01,
+  CAP_G16,
+  CAP_SPACE_08,
+  CAP_SPACE_16,
+} from '@capillarytech/cap-ui-library/styled/variables';
 import { TEMPLATE, IMAGE_CAROUSEL, IMAGE, STICKER, TEXT, IMAGE_MAP, VIDEO } from '../../v2Containers/Line/Container/constants';
 import CapFacebookPreview from '../../v2Containers/CapFacebookPreview';
-import { getWhatsappStatusContainer } from '../../v2Containers/Whatsapp/utils';
+import WhatsappStatusContainer from '../WhatsappStatusContainer';
 
 class TemplatePreview extends React.Component { // eslint-disable-line react/prefer-stateless-function
   onPreviewContentClicked = (channel) => {
@@ -137,7 +147,17 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
 
   render() {
     let content = channel && channel.toLowerCase() === 'sms' ? [this.props.content] : this.props.content;
-    const { channel, showTestAndPreviewIcon, module, viberBrandName, viberAccountName, whatsappAccountName, intl, templateData } = this.props;
+    const { 
+      channel,
+      showTestAndPreviewIcon,
+      module,
+      viberBrandName,
+      viberAccountName,
+      whatsappAccountName,
+      whatsappContentLen = 0,
+      intl,
+      templateData,
+    } = this.props;
     const { formatMessage } = intl;
     const { buttonText, imageURL, messageContent: viberMessageContent } = content || {};
     let smsDetails = {};
@@ -194,7 +214,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
       'width': '81%',
     };
     const whatsappSectionStyle = {
-      "padding": '3.5px 0 0',
+      'padding': `4px 0 ${CAP_SPACE_08}`,
       'border-radius': '6px',
       'background-color': CAP_G15,
       'width': '88%',
@@ -284,10 +304,10 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
           {smsDetails.optoutUrlPresent && <CapHeading type="h6">
             <FormattedMessage {...messages.optoutCharactersTotal} values={{optoutUrlLength: smsDetails.optouturlLength}} />
           </CapHeading>}
-          {channel && channel.toLowerCase() === WHATSAPP.toLowerCase() ? (
+          {channel?.toLowerCase() === WHATSAPP.toLowerCase() ? (
             <>
-              {getWhatsappStatusContainer(templateData)}
-              <CapHeading type="h3" style={{ marginTop: '12px' }}>
+              <WhatsappStatusContainer template={templateData} />
+              <CapHeading type="h3" className='margin-t-12'>
                 <FormattedMessage {...messages.whatsappCharactersTotal} values={{charCount: content?.templateMsg?.length}} />
               </CapHeading>
               <CapHeading type="h6">
@@ -332,7 +352,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
               <div>
                 <div className="shell-v2 align-center" id="sms-preview">
                   <CapImage className="preview-image sms" src={smsMobileAndroid} alt="Preview is being generated"/>
-                  <div className="msgContainer sms">
+                  <div className="msg-container sms">
                     <div className={"message-pop sms"}>
                       {content && content.length && content.map((msg, index) =>
                         <CapColumn key={`"message-pop-content-${index}`} className="message-pop-item align-left" style={{ background: '#FFFFFF', color: '#091e42'}}>
@@ -360,7 +380,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
             {channel && channel.toLowerCase() === 'wechat' ?
             ( <div className="shell-v2 align-center" id="sms-preview">
               <CapImage className="preview-image" src={(channel || '').toLowerCase() === 'wechat' ? wechatBodyNew : smsMobileAndroid} alt="Preview is being generated"/>
-              <div className="msgContainer wechat">
+                <div className="msg-container wechat">
                 <div className="message-pop align-left" style={{ background: `${this.props.channel.toLowerCase() === 'wechat' ? '#ffffff' : '#3F51B5'}`, color: `${this.props.channel.toLowerCase() === 'wechat' ? '#333333' : '#ffffff'}`}}>{content}
                 </div>
               </div>
@@ -420,7 +440,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
             <div className="shell-v2 align-center" id="sms-preview">
               <CapImage className="preview-image" src={lineMobileAndroid} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
               <div
-                className="msgContainer line-preview"
+                    className="msg-container line-preview"
                 style={{
                   maxHeight: 330,
                   overflow: 'scroll',
@@ -588,7 +608,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
               <CapImage className="preview-image" src={viberMobileAndroid} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
               <div style={{ position: 'absolute', top: '12%', left: '36%'}}>{viberBrandName}</div>
               <div
-                className="msgContainer viber-preview"
+                    className="msg-container viber-preview"
                 style={{
                   maxHeight: 292,
                   marginLeft: 28,
@@ -662,35 +682,40 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
             </div>
           ) : ''
         }
-            {channel && channel?.toUpperCase() === WHATSAPP ? (
-              <div className="shell-v2 align-center" id="sms-preview">
-                <CapImage
-                  className="preview-image"
-                  src={whatsappMobileAndroid}
-                  alt={formatMessage(messages.previewGenerated)}
-                />
-                <div className='whatsapp-brand-name'>{whatsappAccountName || ""}</div>
-                <div
-                  className="msgContainer"
-                  style={{
-                    maxHeight: 292,
-                    marginLeft: 28,
-                  }}
-                >
-                  <div
-                    className="message-pop align-left"
-                    style={whatsappSectionStyle}>
-                    <p
-                      style={{
-                        "color": CAP_G16,
-                        "margin": '1.5px 6px 1px 7px',
-                      }}>{content?.templateMsg || ''}
-                    </p>
-                    <div style={{ paddingBottom: CAP_SPACE_08 }}></div>
+            {
+              channel && channel?.toUpperCase() === WHATSAPP ? (
+                <>
+                  <div className='shell-v2 align-center'>
+                    <CapImage
+                      className='preview-image'
+                      src={whatsappMobileAndroid}
+                      alt={formatMessage(messages.previewGenerated)}
+                    />
+                    <CapLabel className='whatsapp-brand-name'>
+                      {whatsappAccountName || ''}
+                    </CapLabel>
+                    <div className='msg-container whatsapp-message-container'>
+                      <div className='message-pop align-left' style={whatsappSectionStyle}>
+                        <CapLabel className='whatsapp-content'>
+                          {content?.templateMsg || ''}
+                        </CapLabel>
+                      </div>
+                    </div>
                   </div>
-                </div>
-              </div>
-            ) : ('')
+                  <CapHeading
+                    type='h3'
+                    style={{ textAlign: 'center' }}
+                    className='margin-t-16'
+                  >
+                    <FormattedMessage
+                      {...messages.whatsappMessageLength}
+                      values={{ length: 36 + whatsappContentLen }}
+                    />
+                  </CapHeading>
+                </>
+              ) : (
+                ''
+              )
             }
             {channel && channel.toLowerCase() === FACEBOOK && (
               <div style={{position: 'absolute', left: '80%'}} id="facebook-preview">

package/v2Components/TemplatePreview/messages.js

@@ -34,6 +34,10 @@ export default defineMessages({
     id: 'app.components.TemplatePreview.whatsappUnsubscribeLength',
     defaultMessage: "Includes 36 characters of (Click {{unsubscribe}} to unsubscribe)",
   },
+  whatsappMessageLength: {
+    id: 'app.components.TemplatePreview.whatsappMessageLength',
+    defaultMessage: "1 Message ({length} characters)",
+  },
   smsFormatType: {
     id: 'creatives.componentsV2.TemplatePreview.smsFormatType',
     defaultMessage: 'Message has unicode characters',

package/v2Components/WhatsappStatusContainer/_whatsappStatusContainer.scss

@@ -0,0 +1,13 @@
+.whatsapp-status-container {
+  margin-top: 12px;
+  width: 150%;
+  height: 20px;
+  
+  .cap-colored-tag-v2 {
+    font-weight: normal;
+  }
+
+  .whatsapp-category-tag {
+    margin-left: 8px;
+  }
+}

package/v2Components/WhatsappStatusContainer/index.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { CapRow, CapStatus, CapColoredTag } from '@capillarytech/cap-ui-library';
+import { WHATSAPP } from '../../v2Containers/CreativesContainer/constants';
+import {
+    CATEGORY as WHATSAPP_CATEGORY,
+    STATUS as WHATSAPP_STATUS,
+} from '../../v2Containers/Whatsapp/constants';
+import { getWhatsappCategory, getWhatsappStatus } from '../../v2Containers/Whatsapp/utils';
+import './_whatsappStatusContainer.scss';
+
+export const WhatsappStatusContainer = (props) => {
+
+    const { template } = props;
+
+    const {
+        versions: {
+          base: {
+            content: {
+                [WHATSAPP.toLowerCase()]: {
+                [WHATSAPP_STATUS]: status,
+                [WHATSAPP_CATEGORY]: category,
+              } = {},
+            } = {},
+          } = {},
+        } = {},
+    } = template;
+
+    const categoryObj = getWhatsappCategory(category) || {};
+    const {
+        label: categoryLabel,
+        tagColor: categoryTagColor,
+        tagTextColor: categoryTextColor,
+    } = categoryObj;
+    return (
+        <CapRow type="flex" align="middle" className="whatsapp-status-container">
+            <CapStatus
+                type={status}
+                text={getWhatsappStatus(status)?.label}
+                labelType="label3"
+            />
+            {
+            categoryLabel ? (
+                <CapColoredTag
+                    tagColor={categoryTagColor}
+                    tagTextColor={categoryTextColor}
+                    tagHeight="20px"
+                    tagFontSize="12px"
+                    className="whatsapp-category-tag"
+                >
+                    {categoryLabel}
+                </CapColoredTag>
+            ) : null
+            }
+        </CapRow>
+    )
+}
+
+export default WhatsappStatusContainer;

package/v2Containers/Assets/Gallery/tests/__snapshots__/reducer.test.js.snap

@@ -1,3 +1,5 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
 exports[`galleryReducer Initial State should match snapshot returns the initial state 1`] = `
 Object {
   "assetList": Array [],

package/v2Containers/Cap/messages.js

@@ -80,6 +80,14 @@ export default defineMessages({
     id: `creatives.containersV2.promotions`,
     defaultMessage: 'Promotions',
   },
+  "templateNameLabel": {
+    id: `creatives.containersV2.templateNameLabel`,
+    defaultMessage: 'Template name',
+  },
+  "templateNamePlaceholder": {
+    id: `creatives.containersV2.templateNamePlaceholder`,
+    defaultMessage: 'Enter template name',
+  },
 
     //refresh due to org change messages
 

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -145,6 +145,7 @@ function SlideBoxContent(props) {
       showDisabledFBInfo,
       orgUnitId,
       smsRegister,
+      enableNewChannels,
     } = props;
   const type = (messageDetails.type || '').toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
   const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'default' : 'library', isEditFromCampaigns: (templateData || {}).isEditFromCampaigns};
@@ -172,11 +173,12 @@ function SlideBoxContent(props) {
     });
 
 
-  const isCreateSms = slidBoxContent === 'createTemplate' && channel === constants.SMS;
-  const isCreateFacebook = slidBoxContent === 'createTemplate' && channel === constants.FACEBOOK;
-  const isCreateWhatsapp = slidBoxContent === 'createTemplate' && channel === constants.WHATSAPP;
-  const isCreateMPush = slidBoxContent === 'createTemplate' && channel === constants.MOBILE_PUSH;
-  const isCreateCallTask = slidBoxContent === 'createTemplate' && channel === constants.CALL_TASK;
+  const isCreate = slidBoxContent === 'createTemplate';
+  const isCreateSms = isCreate && channel === constants.SMS;
+  const isCreateFacebook = isCreate && channel === constants.FACEBOOK;
+  const isCreateWhatsapp = isCreate && channel === constants.WHATSAPP;
+  const isCreateMPush = isCreate && channel === constants.MOBILE_PUSH;
+  const isCreateCallTask = isCreate && channel === constants.CALL_TASK;
   let isEditSms = false;
   let isEditEmailWithId = false;
   let isEmailEditWithContent = false;
@@ -188,7 +190,7 @@ function SlideBoxContent(props) {
   let isEditFacebook = false;
   let isEditFTP = false;
   let isEditWhatsapp = false;
-  const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL;
+  const isEmailCreate = isCreate && channel === constants.EMAIL;
   if (templateData && channel) {
     channel = templateData.type;// for edit mode with template data
     isEditSms = slidBoxContent === 'editTemplate' && channel === constants.SMS;
@@ -364,6 +366,7 @@ function SlideBoxContent(props) {
         showDisabledFBInfo={showDisabledFBInfo}
         orgUnitId={orgUnitId}
         smsRegister={smsRegister}
+        enableNewChannels={enableNewChannels}
         />
       )}
       {isPreview && (
@@ -697,9 +700,6 @@ function SlideBoxContent(props) {
       {isEditWhatsapp && (<Whatsapp
         isFullMode={isFullMode}
         templateData={templateData}
-        getFormData={getFormData}
-        getDefaultTags={type}
-        forwardedTags={forwardedTags}
         params={{
           id: templateData._id,
         }}

package/v2Containers/CreativesContainer/SlideBoxHeader.js

@@ -7,6 +7,7 @@ import moment from 'moment';
 import PropTypes from 'prop-types';
 import messages from './messages';
 import whatsppMsg from '../Whatsapp/messages';
+import globalMessages from '../Cap/messages'
 import { MAP_TEMPLATE } from '../WeChat/Wrapper/constants';
 import { NO_COMMUNICATION, FTP, WHATSAPP } from '../App/constants';
 import { isTraiDLTEnable } from '../../utils/common';
@@ -84,7 +85,7 @@ function SlideBoxHeader(props) {
           description={
             isWhatsappEdit && (
               <>
-                {renderWhatsappData("label1", <FormattedMessage {...whatsppMsg.templateNameLabel} />)}
+                {renderWhatsappData("label1", <FormattedMessage {...globalMessages.templateNameLabel} />)}
                 {renderWhatsappData("label2", whatsappName)}
                 {renderWhatsappData("label3", <FormattedMessage {...whatsppMsg.labelSeperator} />)}
                 {renderWhatsappData("label1", <FormattedMessage {...whatsppMsg.templateCategoryLabel} />)}

package/v2Containers/CreativesContainer/index.js

@@ -364,28 +364,6 @@ class Creatives extends React.Component {
           };
           break;
         }
-        case constants.WHATSAPP: {
-          const { messageBody } = templateData;
-          const body = JSON.parse(messageBody || '{}');
-          console.log("getTemplateData body", body);
-          creativesTemplateData = {
-            type: constants.WHATSAPP,
-            edit: true,
-            name: "",
-            versions: {
-              base: {
-                content: {
-                  ...body,
-                  whatsapp: {
-                    ...body.whatsapp,
-                    status: 'approved'
-                  }
-                },
-              },
-            },
-          };
-          break;
-        }
         default:
           break;
       }
@@ -442,8 +420,8 @@ class Creatives extends React.Component {
         if (get(template, "value.versions.base")) {
           const mobilpushTemplate = template.value;
           templateData.accountId = get(mobilpushTemplate, 'definition.accountId');
-          const type = (get(this.props,"messageDetails.type") || '').toLowerCase();
-          if(type === LOYALTY){
+          const type = (get(this.props, "messageDetails.type") || '').toLowerCase();
+          if (type === LOYALTY) {
             templateData.licenseCode = get(mobilpushTemplate, 'definition.licenseCode');
           }
           const androidContent = get(mobilpushTemplate, 'versions.base.ANDROID');
@@ -517,26 +495,6 @@ class Creatives extends React.Component {
           };
         }
         break;
-      case constants.WHATSAPP:
-        if (template.value) {
-          const { Templates, templateData: templateDataProps } = this.props;
-          const { accountDetails: selectedAccountDetails, accountId: selectedAccountId } = templateDataProps || {};
-          const selectedWhatsappAccount = Templates?.selectedWhatsappAccount;
-          const accountDetails = (selectedWhatsappAccount ? selectedWhatsappAccount : selectedAccountDetails);
-          const accountId = selectedAccountId || (selectedWhatsappAccount?.id || '');
-          const { versions } = template.value;
-          const whatsappContent = cloneDeep(versions.base.content.whatsapp);
-          templateData = {
-            channel,
-            accountId,
-            accountName: accountDetails.name,
-            messageBody: whatsappContent.languages[0].content,
-            category: whatsappContent.category,
-            language: whatsappContent.languages[0].language,
-            mediaType: whatsappContent.mediaType,
-          };
-        }
-        break;
       case constants.FACEBOOK: {
         if (template.value) {
           const FacebookAd = template?.value?.versions?.base?.content?.FacebookAd;
@@ -702,11 +660,13 @@ class Creatives extends React.Component {
     });
   }
   handleCloseSlideBox = () => {
+    const { currentChannel = '', slidBoxContent = '' } = this.state;
+    const reloadTemplates = currentChannel === constants.WHATSAPP && slidBoxContent === 'editTemplate';
     this.setState((prevState) => ({
       ...prevState,
       templateData: undefined,
       showSlideBox: false,
-    }), this.props.handleCloseCreatives);
+    }), () => this.props.handleCloseCreatives(reloadTemplates));
   };
   saveMessage = () => {
     this.setState({ isGetFormData: true });
@@ -861,7 +821,24 @@ class Creatives extends React.Component {
   }
   render() {
     const {slidBoxContent, isGetFormData, showSlideBox, templateData, currentChannel, emailCreateMode, templateStep, isLoadingContent, mobilePushCreateMode, isDiscardMessage, weChatTemplateType, weChatMaptemplateStep} = this.state;
-    const {isFullMode, creativesMode, cap, isUploading, channelsToHide, selectedWeChatAccount, forwardedTags, channelsToDisable, selectedOfferDetails, onTestContentClicked, onPreviewContentClicked, getCreativesData, fetchingCmsData, editor, smsRegister} = this.props;
+    const {
+      isFullMode,
+      creativesMode,
+      cap,
+      isUploading,
+      channelsToHide,
+      selectedWeChatAccount,
+      forwardedTags,
+      channelsToDisable,
+      selectedOfferDetails,
+      onTestContentClicked,
+      onPreviewContentClicked,
+      getCreativesData,
+      fetchingCmsData,
+      editor,
+      smsRegister,
+      enableNewChannels,
+    } = this.props;
     const mapTemplateCreate = slidBoxContent === 'createTemplate' && weChatTemplateType === MAP_TEMPLATE && templateStep !== 'modeSelection';
     /* TODO: Instead of passing down same props separately to each component down, write common function to these props and pass it accordingly */
     return (
@@ -942,6 +919,7 @@ class Creatives extends React.Component {
               smsRegister={smsRegister}
               messageStrategy={this.props.strategy}
               orgUnitId={this.props.orgUnitId}
+              enableNewChannels={enableNewChannels}
           />
           }
           footer={this.shouldShowFooter() &&

package/v2Containers/Email/index.js

@@ -2179,7 +2179,9 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     } else {
       this.setState({injectedTags: data.tags});
     }
-    this.props.globalActions.setInjectedTags(data.tags);
+    if (data.tags) {
+      this.props.globalActions.setInjectedTags(data.tags);
+    }
   }
 
   startLoading = (ifEdit) => {

package/v2Containers/Templates/_templates.scss

@@ -19,6 +19,25 @@
 }
 
 .creatives-templates-list {
+
+  .delete-template-confirm {
+    .ant-modal-footer {
+      padding: $CAP_SPACE_16 $CAP_SPACE_24 $CAP_SPACE_24 $CAP_SPACE_24;
+    }
+
+    .ant-modal-header {
+      padding: $CAP_SPACE_24 $CAP_SPACE_24 $CAP_SPACE_08 $CAP_SPACE_24;
+    }
+
+    .ant-modal-body {
+      padding: 0 $CAP_SPACE_24;
+    }
+
+    .ant-modal-close-x {
+      padding: $CAP_SPACE_12;
+    }
+  }
+
   .pagination-container {
     .FACEBOOK {
       .ant-card-body {
@@ -132,20 +151,6 @@
 
     }
   }
-
-  .create-new-link{
-    .ant-anchor-link {
-      display: flex;
-
-      .ant-anchor-link-title {
-        margin: 0;
-      }
-
-      .cap-link-v2-suffix {
-        margin-top: -2px;
-      }
-    }
-  }
 }
 
 .card-title {
@@ -538,40 +543,9 @@
   }
 }
 
-.whatsapp-card-title {
-
-  .whatsapp-status-container {
-    margin-top: 12px;
-    width: 150%;
-    height: 20px;
-
-    .cap-colored-tag-v2 {
-      font-weight: normal;
-    }
-  }
-}
-
 .whatsapp-illustration-desc {
   font-size: 14px;
   color: rgba(0, 0, 0, 0.87);
   margin: 8px 0;
   white-space: pre-wrap;
 }
-
-.delete-template-confirm {
-  .ant-modal-footer {
-    padding: $CAP_SPACE_16 $CAP_SPACE_24 $CAP_SPACE_24 $CAP_SPACE_24;
-  }
-
-  .ant-modal-header {
-    padding: $CAP_SPACE_24 $CAP_SPACE_24 $CAP_SPACE_08 $CAP_SPACE_24;
-  }
-
-  .ant-modal-body {
-    padding: 0 $CAP_SPACE_24;
-  }
-
-  .ant-modal-close-x {
-    padding: $CAP_SPACE_12;
-  }
-}

package/v2Containers/Templates/actions.js

@@ -55,24 +55,18 @@ export function setWeChatAccount(weChatAccount) {
     weChatAccount,
   };
 }
-
 export function setChannelAccount(channel, account) {
-  switch (channel) {
-    case LINE: {
-      return {
-        type: types.SET_LINE_ACCOUNT,
-        account,
-      };
-    }
-    case WHATSAPP: {
-      return {
-        type: types.SET_WHATSAPP_ACCOUNT,
-        account,
-      };
-    }
-    default:
-      return {};
+  const channelTypeMapping = {
+    LINE: types.SET_LINE_ACCOUNT,
+    WHATSAPP: types.SET_WHATSAPP_ACCOUNT,
+  };
+  if (channelTypeMapping[channel]) {
+    return {
+      type: channelTypeMapping[channel],
+      account,
+    };
   }
+  return {};
 }
 
 export function setViberAccount(viberAccount) {