@capillarytech/creatives-library 7.10.60 → 7.10.62

package/config/app.js

@@ -17,6 +17,7 @@ const config = {
   },
   development: {
     api_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/arya/api/v1/creatives',
+    //api_endpoint: 'http://localhost:2022/arya/api/v1/creatives',
     campaigns_api_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/iris/v2/campaigns',
     campaigns_api_org_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/iris/v2/org/campaign',
     auth_endpoint: 'https://crm-nightly-new.cc.capillarytech.com/arya/api/v1/auth',

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "7.10.60",
+  "version": "7.10.62",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/v2Components/TemplatePreview/index.js

@@ -154,7 +154,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
       viberBrandName,
       viberAccountName,
       whatsappAccountName,
-      whatsappContentLen = 0,
+      whatsappContentLen,
       intl,
       templateData,
     } = this.props;
@@ -293,6 +293,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
     );
 
     const whatsappUpdatedAccountName = whatsappAccountName || _.get(templateData, 'versions.base.content.whatsapp.accountName', '');
+    const whatsappUpdatedLen = whatsappContentLen !== undefined ? 36 + whatsappContentLen : content?.templateMsg?.length;
 
     return (
       <CapRow>
@@ -711,7 +712,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
                   >
                     <FormattedMessage
                       {...messages.whatsappMessageLength}
-                      values={{ length: 36 + whatsappContentLen }}
+                      values={{ length: whatsappUpdatedLen }}
                     />
                   </CapHeading>
                 </>

package/v2Containers/Templates/index.js

@@ -1041,19 +1041,31 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
               isEmpty(this.state.searchText) &&
               !isLoading &&
               <div style={this.isFullMode() ? { height: "calc(100vh - 325px)", overflow: 'auto' } : {}}>
-                {isEmpty(templates) && <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel)} />}
-                {!isEmpty(templates) && isEmpty(filteredTemplates) && <CapHeader
-                  title={
-                    <CapHeading type="h3" style={{ textAlign: "center", marginTop: CAP_SPACE_44 }}>
-                      {this.props.intl.formatMessage(messages.noFilteredWhatsappTemplatesTitle)}
-                    </CapHeading>
-                  }
-                  description={
-                    <CapLabel style={{ textAlign: "center" }}>
-                      {this.props.intl.formatMessage(messages.noFilteredWhatsappTemplatesDesc)}
-                    </CapLabel>
-                  }
-                />}
+                  {this.isFullMode() && isEmpty(templates) && <CapIllustration buttonClassName={`create-new-${channelLowerCase}`} {...this.getChannelTypeIllustrationInfo(currentChannel)} />}
+                  {this.isFullMode() && !isEmpty(templates) && isEmpty(filteredTemplates) && <CapHeader
+                    title={
+                      <CapHeading type="h3" style={{ textAlign: "center", marginTop: CAP_SPACE_44 }}>
+                        {this.props.intl.formatMessage(messages.noFilteredWhatsappTemplatesTitle)}
+                      </CapHeading>
+                    }
+                    description={
+                      <CapLabel style={{ textAlign: "center" }}>
+                        {this.props.intl.formatMessage(messages.noFilteredWhatsappTemplatesDesc)}
+                      </CapLabel>
+                    }
+                  />}
+                  {!this.isFullMode() && isEmpty(filteredTemplates) && <CapHeader
+                    title={
+                      <CapHeading type="h3" style={{ textAlign: "center", marginTop: CAP_SPACE_44 }}>
+                        {this.props.intl.formatMessage(messages.noApprovedWhatsappTemplatesTitle)}
+                      </CapHeading>
+                    }
+                    description={
+                      <CapLabel style={{ textAlign: "center" }}>
+                        {this.props.intl.formatMessage(messages.noApprovedWhatsappTemplatesDesc)}
+                      </CapLabel>
+                    }
+                  />}
               </div>
             )
           }

package/v2Containers/Templates/messages.js

@@ -354,6 +354,14 @@ export default defineMessages({
     id: `${scope}.noFilteredWhatsappTemplatesDesc`,
     defaultMessage: 'Please try searching with another term or apply different filter',
   },
+  "noApprovedWhatsappTemplatesTitle": {
+    id: `${scope}.noFilteredWhatsappTemplatesDesc`,
+    defaultMessage: 'Sorry, we couldn’t find any approved templates',
+  },
+  "noApprovedWhatsappTemplatesDesc": {
+    id: `${scope}.noFilteredWhatsappTemplatesDesc`,
+    defaultMessage: 'Please try creating a new template, once it is approved by Whatsapp it will be available here',
+  },
   "smsTitleIllustartion": {
     id: `${scope}.smsTitleIllustartion`,
     defaultMessage: 'Create an SMS {template}',

package/v2Containers/TemplatesV2/index.js

@@ -51,7 +51,7 @@ export class TemplatesV2 extends React.Component { // eslint-disable-line react/
       isFullMode,
       onChannelChange,
       showDisabledFBInfo,
-      enableNewChannels,
+      enableNewChannels = [],
     } = props;
 
     const defaultPanes = {

package/v2Containers/Whatsapp/index.js

@@ -29,7 +29,11 @@ import {
   CAP_WHITE,
 } from '@capillarytech/cap-ui-library/styled/variables';
 import { makeSelectWhatsapp, makeSelectAccount } from './selectors';
-import { isLoadingMetaEntities } from '../Cap/selectors';
+import {
+  isLoadingMetaEntities,
+  makeSelectMetaEntities,
+  setInjectedTags,
+} from '../Cap/selectors';
 import * as WhatsappActions from './actions';
 import './index.scss';
 import {
@@ -47,11 +51,10 @@ import {
 } from './constants';
 import { DATE_DISPLAY_FORMAT, TIME_DISPLAY_FORMAT } from '../App/constants';
 import messages from './messages';
-import globalMessages from '../Cap/messages'
+import globalMessages from '../Cap/messages';
 import withCreatives from '../../hoc/withCreatives';
 import TemplatePreview from '../../v2Components/TemplatePreview';
 import TagList from '../TagList';
-import { makeSelectMetaEntities, setInjectedTags } from '../Cap/selectors';
 import { validateTags } from '../../utils/tagValidations';
 
 let varMap = {};
@@ -76,7 +79,7 @@ export const Whatsapp = (props) => {
     metaEntities,
     injectedTags,
     loadingTags,
-    getFormData
+    getFormData,
   } = props || {};
   const { formatMessage } = intl;
   const { TextArea } = CapInput;
@@ -130,9 +133,8 @@ export const Whatsapp = (props) => {
         configs = {},
         name = '',
       } = accountObj;
-      const { accessToken = '' } = configs;
       setAccountId(sourceAccountIdentifier);
-      setAccessToken(accessToken);
+      setAccessToken(configs.accessToken || '');
       setAccountName(name);
     }
   }, [accountData.selectedWhatsappAccount]);
@@ -182,7 +184,7 @@ export const Whatsapp = (props) => {
     const validVarArr = msg.match(validVarRegex) || [];
     const templateMessageArray = [];
     //removing $'' which was added for twilio enter handling
-    msg = msg.slice(2, -1);
+    // msg = msg.slice(2, -1);
     //removing Click {{unsubscribe}} to unsubscribe
     msg = msg.replace(
       `Click ${validVarArr[validVarArr.length - 1]} to unsubscribe`,
@@ -266,7 +268,7 @@ export const Whatsapp = (props) => {
     }
   }, [metaEntities, isEditFlow]);
 
-    //performs tag validation
+  //performs tag validation
   useEffect(() => {
     if (
       !isFullMode &&
@@ -494,11 +496,16 @@ export const Whatsapp = (props) => {
             languages: [
               {
                 language: 'en',
-                content: 
-                  isEditFlow 
-                  ? `${updatedSmsEditor.join('')} ${formatMessage(messages.templateMessageUnsubscribeText)}`
-                  : `$'${templateMessage}\nClick {{${
-                    addedVarCount + 1 }}} to unsubscribe'`,
+                content: isEditFlow
+                  ? `${updatedSmsEditor.join('')} ${formatMessage(
+                      messages.templateMessageUnsubscribeText,
+                    )}`
+                  : `${templateMessage}\n${formatMessage(
+                      messages.modifiedUnsubscribeText,
+                      {
+                        value: `{{${addedVarCount + 1}}}`,
+                      },
+                    )}`,
               },
             ],
             mediaType: 'TEXT',
@@ -555,7 +562,7 @@ export const Whatsapp = (props) => {
       validity: true,
       type: 'WHATSAPP',
     });
-  }
+  };
 
   const isDisableDone = () => {
     //if template name is not entered
@@ -884,22 +891,20 @@ export const Whatsapp = (props) => {
       <TemplatePreview
         channel={WHATSAPP}
         content={{ templateMsg }}
-        whatsappContentLen={isEditFlow ? updatedSmsEditor.join('').length : templateMessage.length}
+        whatsappContentLen={
+          isEditFlow ? updatedSmsEditor.join('').length : templateMessage.length
+        }
         whatsappAccountName={accountName}
       />
     );
   };
 
-  const isEditDoneDisabled = () => {
-    return isTagValidationError || Object.values(varMap).some( (inputValue) => {
-      if (inputValue === '') {
-        return true;
-      }
-    });
-  }
+  const isEditDoneDisabled = () =>
+    isTagValidationError ||
+    Object.values(varMap).some((inputValue) => inputValue === '');
   return (
     <CapSpin spinning={spin}>
-      <CapRow className='cap-whatsapp-creatives'>
+      <CapRow className="cap-whatsapp-creatives">
         <CapColumn span={14}>
           {isEditFlow ? editModeContent : createModeContent}
           <div className="whatsapp-scroll-div" />

package/v2Containers/Whatsapp/messages.js

@@ -135,6 +135,10 @@ export default defineMessages({
     id: `${prefix}.templateMessageUnsubscribeText`,
     defaultMessage: 'Click {{unsubscribe}} to unsubscribe',
   },
+  modifiedUnsubscribeText: {
+    id: `${prefix}.modifiedUnsubscribeText`,
+    defaultMessage: 'Click {value} to unsubscribe',
+  },
   unsubscribeTextTooltip: {
     id: `${prefix}.unsubscribeTextTooltip`,
     defaultMessage: 'This is non-editable',

package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap

@@ -9072,7 +9072,7 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -18241,7 +18241,7 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -24989,7 +24989,7 @@ T&C
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               />
             </Whatsapp__WhatsappFooter>
           </div>
@@ -32441,7 +32441,7 @@ T&C
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               />
             </Whatsapp__WhatsappFooter>
           </div>
@@ -40697,7 +40697,7 @@ T&C
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               />
             </Whatsapp__WhatsappFooter>
           </div>
@@ -50011,7 +50011,7 @@ T&C
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               />
             </Whatsapp__WhatsappFooter>
           </div>
@@ -59333,7 +59333,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -68733,7 +68733,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -78392,7 +78392,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -88306,7 +88306,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -98481,7 +98481,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -108917,7 +108917,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -119614,7 +119614,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -129010,7 +129010,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -138664,7 +138664,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"
@@ -148579,7 +148579,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
             </CapRow>
             <Whatsapp__WhatsappFooter>
               <div
-                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 jTxhHk"
+                className="Whatsapp__WhatsappFooter-sc-1ceifzy-0 fCfwuz"
               >
                 <CapButton
                   className="whatsapp-create-btn"

package/v2Containers/Whatsapp/utils.js

@@ -18,7 +18,7 @@ export const getWhatsappContent = (template) => {
         } = {},
     } = template;
     //removing $'' which was added for twilio enter handling
-    let text = languages[0]?.content?.slice(2, -1) || '';
+    let text = languages[0]?.content || '';
     const validVarRegex = /{{([1-9]|1[0-9])}}/g;
     const validVarArr = text.match(validVarRegex) || [];
     //removing Click {{unsubscribe}} to unsubscribe