@capillarytech/creatives-library 8.0.111-alpha.0 → 8.0.111

package/package.json

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

package/v2Components/CapWhatsappCTA/constants.js

@@ -42,4 +42,3 @@ export const KARIX_GUPSHUP_URL_OPTIONS = [
 export const BTN_MAX_LENGTH = 20;
 export const PHONE_NUMBER_MAX_LENGTH = 15;
 export const URL_MAX_LENGTH = 2000;
-export const DYNAMIC_URL_SUFFIX = '{{1}}';

package/v2Components/CapWhatsappCTA/index.js

@@ -20,7 +20,7 @@ import globalMessages from '../../v2Containers/Cap/messages';
 import whatsappMsg from '../../v2Containers/Whatsapp/messages';
 import messages from './messages';
 import './index.scss';
-import { isUrl, isValidText } from '../../v2Containers/Line/Container/Wrapper/utils';
+import { isUrl,isValidText } from '../../v2Containers/Line/Container/Wrapper/utils';
 import TagList from '../../v2Containers/TagList';
 import {
   CTA_OPTIONS,
@@ -33,7 +33,6 @@ import {
   WEBSITE,
   DYNAMIC_URL,
   STATIC_URL,
-  DYNAMIC_URL_SUFFIX,
 } from './constants';
 import {
   INITIAL_CTA_DATA,
@@ -51,7 +50,6 @@ export const CapWhatsappCTA = (props) => {
     tags = [],
     injectedTags = {},
     selectedOfferDetails = [],
-    eventContextTags = [],
   } = props;
   const { formatMessage } = intl;
   const invalidVarRegex = /{{(.*?)}}/g;
@@ -122,8 +120,8 @@ export const CapWhatsappCTA = (props) => {
 
   const ctaOptions = CTA_OPTIONS.map((option) => {
     const { value, label, tooltipLabel } = option;
-    //only disable PHONE_NUMBER if first button is also PHONE_NUMBER
-    const isDisabled = ctaData.length === 2 && ctaData[0].ctaType === PHONE_NUMBER && value === PHONE_NUMBER;
+    //if button 1 is of type-> PHONE_NUMBER, it is disabled in second button
+    const isDisabled = ctaData.length === 2 && ctaData[0].ctaType === value;
     return {
       value,
       label: renderCtaOptions(label, tooltipLabel, isDisabled),
@@ -136,7 +134,8 @@ export const CapWhatsappCTA = (props) => {
     clonedCta.push(cloneDeep(INITIAL_CTA_DATA[0]));
     if (clonedCta.length === 2) {
       clonedCta[1].index = 1;
-      clonedCta[1].ctaType = clonedCta[0].ctaType === PHONE_NUMBER ? WEBSITE : PHONE_NUMBER;
+      clonedCta[1].ctaType =
+        clonedCta[0].ctaType === PHONE_NUMBER ? WEBSITE : PHONE_NUMBER;
     }
     updateHandler(clonedCta, null, true);
   };
@@ -163,13 +162,14 @@ export const CapWhatsappCTA = (props) => {
     let { value, id } = target;
     if (urlType === DYNAMIC_URL) {
       value = value.replace(invalidVarRegex, '');
+      value = `${value}{{1}}`;
     }
     let errorMessage = false;
     if (!isUrl(value)) {
       errorMessage = formatMessage(messages.ctaWebsiteUrlErrorMessage);
     } else if (
-      urlType === STATIC_URL
-      && value.match(invalidVarRegex)?.length > 0
+      urlType === STATIC_URL &&
+      value.match(invalidVarRegex)?.length > 0
     ) {
       errorMessage = formatMessage(messages.staticUrlWithVarErrorMessage);
     }
@@ -178,28 +178,18 @@ export const CapWhatsappCTA = (props) => {
   };
 
   const ctaSaveDisabled = (index) => {
-    const {
-      ctaType, text, phone_number, url,
-    } = ctaData[index] || {};
+    const { ctaType, text, phone_number, url } = ctaData[index] || {};
     if (text === '' || buttonError) {
       return true;
-    } if (ctaType === PHONE_NUMBER && phone_number.length < 5) {
+    } else if (ctaType === PHONE_NUMBER && phone_number.length < 5) {
       return true;
-    } if (ctaType === WEBSITE && (url === '' || urlError)) {
+    } else if (ctaType === WEBSITE && (url === '' || urlError)) {
       return true;
     }
     return false;
   };
 
   const saveCta = (index) => {
-    const clonedIndexCta = cloneDeep(ctaData[index]);
-    // If this is a website CTA with dynamic URL type, ensure {{1}} is added at the end
-    if (clonedIndexCta?.ctaType === WEBSITE && clonedIndexCta?.urlType === DYNAMIC_URL) {
-      if (!clonedIndexCta?.url?.includes(DYNAMIC_URL_SUFFIX)) {
-        clonedIndexCta.url += DYNAMIC_URL_SUFFIX;
-        ctaData[index] = clonedIndexCta;
-      }
-    }
     updateHelper('isSaved', true, index);
   };
   const editCta = (index) => {
@@ -210,9 +200,8 @@ export const CapWhatsappCTA = (props) => {
     const renderArray = [];
     const addBtnDisabled = ctaData.length === 1 && !ctaData[0].isSaved;
     ctaData.forEach((cta) => {
-      const {
-        index, ctaType, text, phone_number, urlType, url, isSaved,
-      } = cta || {};
+      const { index, ctaType, text, phone_number, urlType, url, isSaved } =
+        cta || {};
       //this is to display buttons after they are saved, in both create and edit mode.
       if (isSaved) {
         const ctaIsPhone = ctaType === PHONE_NUMBER;
@@ -240,10 +229,7 @@ export const CapWhatsappCTA = (props) => {
             </CapColumn>
             {ctaIsPhone && (
               <CapColumn span={10} align="left">
-                <CapLabel className="phone">
-                  +
-                  {phone_number}
-                </CapLabel>
+                <CapLabel className="phone">+{phone_number}</CapLabel>
               </CapColumn>
             )}
             {!ctaIsPhone && (
@@ -255,7 +241,7 @@ export const CapWhatsappCTA = (props) => {
                       : formatMessage(messages.ctaWebsiteTypeDynamic)}
                   </CapLabel>
                 </CapColumn>
-                <CapTooltip title={url} placement="top">
+                <CapTooltip title={url} placement={'top'}>
                   <CapColumn span={7} style={{ marginRight: '0px' }}>
                     <CapLabel className="url">{url}</CapLabel>
                   </CapColumn>
@@ -285,7 +271,6 @@ export const CapWhatsappCTA = (props) => {
                   tags={tags}
                   injectedTags={injectedTags}
                   selectedOfferDetails={selectedOfferDetails}
-                  eventContextTags={eventContextTags}
                 />
               </CapColumn>
             )}
@@ -297,7 +282,7 @@ export const CapWhatsappCTA = (props) => {
               >
                 <CapTooltip
                   title={formatMessage(messages.whatsappCtaTagListRevert)}
-                  placement="top"
+                  placement={'top'}
                 >
                   <CapIcon size="s" type="return" />
                 </CapTooltip>
@@ -406,7 +391,6 @@ export const CapWhatsappCTA = (props) => {
                   </CapHeading>
                   <CapInput
                     id={index}
-                    addonAfter={urlType === DYNAMIC_URL && !url.includes(DYNAMIC_URL_SUFFIX) && DYNAMIC_URL_SUFFIX}
                     className="whatsapp-cta-url"
                     onChange={(event) => onUrlChange(event, urlType)}
                     placeholder={
@@ -430,7 +414,7 @@ export const CapWhatsappCTA = (props) => {
                     ? formatMessage(messages.ctaSaveDisabled)
                     : ''
                 }
-                placement="bottom"
+                placement={'bottom'}
               >
                 <div className="button-disabled-tooltip-wrapper">
                   <CapButton
@@ -458,15 +442,15 @@ export const CapWhatsappCTA = (props) => {
     {
       // when first button is not saved, add button is disabled with tooltip
       // eslint-disable-next-line no-unused-expressions
-      ctaData.length < 2
-        && !isEditFlow
-        && renderArray.push(
+      ctaData.length < 2 &&
+        !isEditFlow &&
+        renderArray.push(
           <CapRow>
             <CapTooltip
               title={
                 addBtnDisabled ? formatMessage(messages.ctaAddDisabled) : ''
               }
-              placement="right"
+              placement={'right'}
             >
               <div className="button-disabled-tooltip-wrapper">
                 <CapButton

package/v2Containers/TagList/index.js

@@ -7,7 +7,6 @@
 import PropTypes from 'prop-types';
 
 import React from 'react';
-import { injectIntl } from 'react-intl';
 import { connect } from 'react-redux';
 import { Tree } from 'antd';
 import _ from 'lodash';
@@ -17,20 +16,17 @@ import makeSelectTagList from './selectors';
 import { UserIsAuthenticated } from '../../utils/authWrapper';
 import * as actions from './actions';
 import * as globalActions from '../Cap/actions';
-import messages, { scope } from './messages';
-
 // import styled from styled-components;
 import CapTagList from '../../v2Components/CapTagList';
 import './_tagList.scss';
 import { selectCurrentOrgDetails, makeSelectFetchingSchemaError } from '../Cap/selectors';
-import {
-  handleInjectedData, hasGiftVoucherFeature, hasPromoFeature, hasBadgesFeature, transformBadgeTags,
-} from '../../utils/common';
-import {
-  GIFT_VOUCHER_RELATED_TAGS, PROMO_ENGINE_RELATED_TAGS, BADGES_RELATED_TAGS, BADGES_ENROLL, BADGES_ISSUE,
-} from '../../containers/App/constants';
+import { injectIntl } from 'react-intl';
+import { scope } from './messages';
+import messages from './messages';
+import { handleInjectedData, hasGiftVoucherFeature, hasPromoFeature, hasBadgesFeature, transformBadgeTags } from '../../utils/common';
+import { GIFT_VOUCHER_RELATED_TAGS, PROMO_ENGINE_RELATED_TAGS, BADGES_RELATED_TAGS, BADGES_ENROLL, BADGES_ISSUE } from '../../containers/App/constants';
 
-const {TreeNode} = Tree;
+const TreeNode = Tree.TreeNode;
 
 export class TagList extends React.Component { // eslint-disable-line react/prefer-stateless-function
   constructor(props) {
@@ -56,35 +52,35 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
       this.setState({loading: true});
     }
     if (!_.isEqual(nextProps.injectedTags, this.props.injectedTags)) {
+
       this.setState({loading: false});
     }
     if (!_.isEqual(nextProps.tags, this.props.tags)) {
+
       this.setState({loading: false});
     }
     if (nextProps?.fetchingSchemaError) {
       this.setState({tagsError: nextProps?.fetchingSchemaError});
     }
-  }
 
+  }
   componentDidUpdate(prevProps) {
     if (this.props.tags !== prevProps.tags || this.props.injectedTags !== prevProps.injectedTags || this.props.selectedOfferDetails !== prevProps.selectedOfferDetails) {
       this.generateTags(this.props);
     }
   }
-
   onSelect = (selectedKeys) => {
     this.props.onTagSelect(selectedKeys[0]);
   };
 
-  // onClick = (e, data) => {
+  onClick = (e, data) => {
 
-  // };
+  };
 
   getTagsforContext = (data) => {
     //this.setState({loading: true});
     this.props.onContextChange(data);
   }
-
   generateTags = (props) => {
     let tags = {};
     let injectedTags = {};
@@ -112,26 +108,24 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
     if (eventContextTags?.length) {
       const TAG_HEADER_MSG_LABEL = this.props.intl.formatMessage(messages.entryEvent);
       eventContextTagsObj.eventContextTags = {
-        "name": TAG_HEADER_MSG_LABEL,
-        "desc": TAG_HEADER_MSG_LABEL,
-        "resolved": true,
+        name: TAG_HEADER_MSG_LABEL,
+        desc: TAG_HEADER_MSG_LABEL,
+        resolved: true,
         'tag-header': true,
-        "subtags": {},
+        subtags: {},
       };
 
       eventContextTags.forEach((tag) => {
-        const {
-          tagName, label, profileId, profileName,
-        } = tag || {};
+        const { tagName, label, profileId, profileName } = tag || {};
         if (!profileId || !tagName || !label || !profileName) return;
         // Initializing the tags profile if it doesn't exist
         if (!eventContextTagsObj?.eventContextTags?.subtags?.[profileId]) {
           eventContextTagsObj.eventContextTags.subtags[profileId] = {
-            "name": profileName,
-            "desc": profileName,
-            "resolved": true,
+            name: profileName,
+            desc: profileName,
+            resolved: true,
             "tag-header": true,
-            "subtags": {},
+            subtags: {},
           };
         }
         // Adding the current tag to the profile group
@@ -144,7 +138,6 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
     }
     this.setState({tags: _.merge( {}, tags, injectedTags, eventContextTagsObj )});
   }
-
   populateTags(tagsList) {
     const mainTags = {};
     const excludedTags = [];
@@ -171,8 +164,8 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
       }
       if (!tag['tag-header']) {
         mainTags[tag.value] = {
-          name: tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
-          desc: tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
+          "name": tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
+          "desc": tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
         };
       } else if (tag['tag-header'] && mainTags[tag.value]) {
         mainTags[tag.value].subtags = _.concat(mainTags[tag.value].subtags, tag.subtags);
@@ -252,9 +245,7 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
       };
     };
     offerDetails.forEach((offer) => {
-      const {
-        id, couponName, description, couponSeriesId,
-      } = offer;
+      const { id, couponName, description, couponSeriesId } = offer;
       const couponId = id || couponSeriesId;
       const couponSubTags = {};
       couponTagsKeys.forEach((couponTagKey) => {

package/v2Containers/Whatsapp/index.js

@@ -882,10 +882,6 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
               deleteHandler={deleteHandler}
               isEditFlow={isEditFlow}
               hostName={host}
-              tags={tags || []}
-              injectedTags={injectedTags || {}}
-              selectedOfferDetails={selectedOfferDetails}
-              eventContextTags={eventContextTags}
             />
           )}
         </>
@@ -2701,7 +2697,6 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
               tags={tags || []}
               injectedTags={injectedTags || {}}
               selectedOfferDetails={selectedOfferDetails}
-              eventContextTags={eventContextTags}
             />
           )}
           {isBtnTypeQuickReply && (