@capillarytech/creatives-library 7.17.39-alpha.5 → 7.17.39

package/components/CapTagList/index.js

@@ -183,7 +183,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
           onVisibleChange={this.togglePopoverVisibility}
           content={<div>
             <Spin tip="Getting tags..." spinning={this.props.loading}>
-              <Search style={{ marginBottom: 8, width: '250px'}} placeholder="Search" onChange={this.onChange} />
+              <Search style={{ marginBottom: 8, width: '250px'}} placeholder={this.props.intl.formatMessage(messages.searchText)} onChange={this.onChange} />
               {this.props.moduleFilterEnabled ? <CapSelect getPopupContainer={(triggerNode) => triggerNode.parentNode} style={{width: '250px', marginBottom: '16px', minWidth: 'initial', display: 'inherit'}} onChange={this.props.onContextChange} defaultValue="All" options={options}>
               </CapSelect> : ''}
               <Tree

package/components/CapTagList/messages.js

@@ -34,4 +34,8 @@ export default defineMessages({
     id: 'creatives.components.CapTagList.loyalty',
     defaultMessage: 'Loyalty',
   },
+  "searchText": {
+    id: 'creatives.components.CapTagList.searchText',
+    defaultMessage: 'Search',
+  },
 });

package/components/FormBuilder/index.js

@@ -1516,8 +1516,8 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       this.setState({errorData: formData});
     } else {
       const tempTab = ifError ? currentTab : this.state.currentTab;
-      const version = `Version ${this.state.currentTab}`;
-      formData[tabCount].name = `Copy of ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
+      const version = `${this.props.intl.formatMessage(messages.version)} ${this.state.currentTab}`;
+      formData[tabCount].name = `${this.props.intl.formatMessage(messages.copyOf)} ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
       formData[tabCount].base = false;
       const initialTab = this.state.currentTab;
       this.setState({formData, tabCount: tabCount + 1, currentTab: tabCount + 1, tabKey: formData[tabCount].tabKey}, () => {

package/components/FormBuilder/messages.js

@@ -54,4 +54,12 @@ export default defineMessages({
     id: 'creatives.components.FormBuilder.ok',
     defaultMessage: 'Ok',
   },
+  copyOf: {
+    id: 'creatives.components.FormBuilder.copyOf',
+    defaultMessage: 'Copy of',
+  },
+  Version: {
+    id: 'creatives.components.FormBuilder.version',
+    defaultMessage: 'Version',
+  },
 });

package/containers/Assets/Gallery/index.js

@@ -336,7 +336,7 @@ export class Gallery extends React.Component { // eslint-disable-line react/pref
           <CapInput
             className="search-text"
             style={{width: '210px'}}
-            placeholder="Search"
+            placeholder={this.props.intl.formatMessage(messages.searchText)}
             prefix={<i className="material-icons" style={{color: '#707070', fontSize: '16px'}}>search</i>}
             value={this.state.searchText}
             onChange={(e) => this.searchAsset(e.target.value)}

package/containers/Assets/Gallery/messages.js

@@ -86,4 +86,8 @@ export default defineMessages({
     id: 'creatives.containers.Assets.Gallery.assetDeleteFailed',
     defaultMessage: 'Image deletion failed.',
   },
+  searchText: {
+    id: 'creatives.components.CapTagList.searchText',
+    defaultMessage: 'Search',
+  },
 });

package/containers/Email/index.js

@@ -3104,7 +3104,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
           <CapInput
             className="search-text"
             style={{width: '210px'}}
-            placeholder="Search"
+            placeholder={this.props.intl.formatMessage(messages.searchText)}
             prefix={<i className="material-icons" style={{color: '#707070', fontSize: '16px'}}>search</i>}
             value={this.state.searchText}
             onChange={(e) => this.searchAsset(e.target.value)}

package/containers/Templates/index.js

@@ -866,7 +866,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   duplicateTemplate(template) {
     
     const duplicateObj = _.cloneDeep(template);
-    duplicateObj.name = `Copy of ${template.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
+    duplicateObj.name = `${this.props.intl.formatMessage(messages.copyOf)} ${template.name} ${moment().format('MM-DD-YYYY HH:mm:ss')}`;
     delete duplicateObj._id;
     if (this.state.channel.toLowerCase() === "sms") {
       this.props.smsActions.createTemplate(duplicateObj);

package/containers/Templates/messages.js

@@ -330,4 +330,8 @@ export default defineMessages({
     id: 'creatives.containers.Templates.Line',
     defaultMessage: 'Line',
   },
+  "copyOf": {
+    id: 'creatives.containers.Templates.copyOf',
+    defaultMessage: 'Copy of',
+  },
 });

package/index.js

@@ -124,8 +124,8 @@ const ViberContainer = {Viber, viberReducer, viberSaga};
 const FacebookPreviewContainer = { FacebookPreview, facebookPreviewReducer, facebookPreviewSaga };
 const SmsTraiContainer = {SmsTraiCreate, SmsTraiCreateReducer, SmsTraiCreateSaga};
 const WhatsappContainer = { Whatsapp, whatsappReducer, whatsappSaga };
+const zaloContainer = { Zalo, zaloReducer, zaloSaga };
 const RcsContainer = { Rcs, rcsReducer, rcsSaga };
-const ZaloContainer = { Zalo, zaloReducer, zaloSaga };
 
 const GalleryContainer = {Gallery, galleryReducer, gallerySagas};
 const FTPContainer = {FTP, FTPReducer, FTPSagas};
@@ -173,6 +173,6 @@ export { CapContainer,
   FacebookPreviewContainer,
   SmsTraiContainer,
   WhatsappContainer,
+  zaloContainer,
   RcsContainer,
-  ZaloContainer,
 };

package/package.json

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

package/services/api.js

@@ -90,7 +90,7 @@ function checkStatus(response) {
   const isLoginPage = window.location.pathname.indexOf('/login') !== -1;
   if (!isLoginPage) redirectIfUnauthenticated(response);
 
-  const error = new Error(statusText);
+  const error = new Error({ statusText, status });
   error.response = response;
   error.isError = true;
   error.status = status;
@@ -493,14 +493,14 @@ export const getSenderDetails = (channel, orgUnitId) => {
 export const getCdnTransformationConfig = () => {
   const url = `${API_ENDPOINT}/common/getCdnTransformationConfig`;
   return request(url, getAPICallObject('GET'));
-};
+}
 
 export const getS3UrlFileSizes = (data) => {
   const url = `${API_ENDPOINT}/assets/files/metadata`;
   return request(url, getAPICallObject('POST', data));
-};
+}
 
 export const getTemplateInfoById = ({id, username, oa_id, token}) => {
-  const url = `${API_ENDPOINT}/templates/${id}/Zalo?username=${username}&oa_id=${oa_id}&token=${token}`;
-  return request(url, getAPICallObject('GET'));
-};
+    const url = `${API_ENDPOINT}/templates/${id}/Zalo?username=${username}&oa_id=${oa_id}&token=${token}`;
+    return request(url, getAPICallObject('GET'));
+  }

package/utils/common.js

@@ -294,8 +294,8 @@ export const isTraiDLTEnable = (isFullMode, smsRegister) => {
   return isTraiDltFeature;
 };
 
-
-export const intlKeyGenerator = (value = "") => String(value).replace(/[^a-zA-Z0-9_]/g, "").toLowerCase();
+//Input: " Spaces In Input "---> Output: "spaces_in_input"
+export const intlKeyGenerator = (value = "") => String(value).replace(/[^a-zA-Z0-9_ ]/g, "").replace(/ /g, "_").toLowerCase();
 
 export const handleInjectedData = (data, scope) => {
   let tagType;
@@ -307,6 +307,7 @@ export const handleInjectedData = (data, scope) => {
       } else if (tag?.name === CUSTOMER_EXTENDED_FIELD) {
         tagType = EXTENDED_TAG;
       }
+
       if (tag?.name) {
         const name = tag.name;
         const key = intlKeyGenerator(name);

package/utils/tests/common.test.js

@@ -51,7 +51,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
     const intlKey = intlKeyGenerator("scope");
     expect(intlKey).toEqual('scope');
-    expect(result.tag1.name).toEqual(<FormattedMessage defaultMessage="Registration Fields" id="scope.registrationfields" values={{}} />);
+    expect(result.tag1.name).toEqual(<FormattedMessage defaultMessage="Registration Fields" id="scope.registration_fields" values={{}} />);
   });
 
   it("adds tagType for Registration custom fields", () => {
@@ -65,7 +65,7 @@ describe("handleInjectedData", () => {
     const intlKey = intlKeyGenerator();
     expect(intlKey).toEqual('');
     expect(result.tag1.name).toEqual(
-      <FormattedMessage defaultMessage="Registration custom fields" id="scope.registrationcustomfields_name.CustomTagMessage" values={{}} />
+      <FormattedMessage defaultMessage="Registration custom fields" id="scope.registration_custom_fields_name.CustomTagMessage" values={{}} />
     );
   });
 
@@ -79,7 +79,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
 
     expect(result.tag1.name).toEqual(
-      <FormattedMessage defaultMessage="Customer extended fields" id="scope.customerextendedfields_name.ExtendedTagMessage" values={{}} />
+      <FormattedMessage defaultMessage="Customer extended fields" id="scope.customer_extended_fields_name.ExtendedTagMessage" values={{}} />
     );
   });
   it("adds tagType for Customer extended fields fields", () => {
@@ -157,7 +157,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
 
     expect(result.tag1.subtags.subtag1.desc).toEqual(
-      <FormattedMessage defaultMessage="Enter your first name" id="scope.enteryourfirstname" values={{}} />
+      <FormattedMessage defaultMessage="Enter your first name" id="scope.enter_your_first_name" values={{}} />
     );
   });
   it("replaces subtag name desc with intl key", () => {
@@ -175,7 +175,7 @@ describe("handleInjectedData", () => {
     const result = handleInjectedData(data, "scope");
 
     expect(result.tag1.subtags.subtag1.desc).toEqual(
-      <FormattedMessage defaultMessage="Enter your first name" id="scope.enteryourfirstname" values={{}} />
+      <FormattedMessage defaultMessage="Enter your first name" id="scope.enter_your_first_name" values={{}} />
     );
   });
 });

package/v2Components/CapTagList/index.js

@@ -321,7 +321,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
           trigger="click"
           placement={translationLang === "ja-JP" && channel === 'EMAIL' ? "bottom" : "rightTop"}
           >
-          <CapButton disabled={this?.props?.disabled} isAddBtn type="flat">{label || ''}</CapButton>
+          <CapButton isAddBtn type="flat">{label || ''}</CapButton>
         </CapPopover>
         }
         <CapModal
@@ -358,7 +358,6 @@ CapTagList.propTypes = {
   disableTagsDetails: PropTypes.object,
   currentOrgDetails: PropTypes.object,
   channel: PropTypes.string,
-  disabled: PropTypes.bool
 };
 
 CapTagList.defaultValue = {

package/v2Components/FormBuilder/index.js

@@ -1669,7 +1669,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     } else {
       const tempTab = ifError ? currentTab : this.state.currentTab;
       const version = `Version ${this.state.currentTab}`;
-      formData[tabCount].name = `Copy of ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
+      formData[tabCount].name = `${this.props.intl.formatMessage(messages.copyOf)} ${formData[tempTab - 1].name ? formData[tempTab - 1].name : version}`;
       formData[tabCount].base = false;
       const initialTab = this.state.currentTab;
       this.setState({formData, tabCount: tabCount + 1, currentTab: tabCount + 1, tabKey: formData[tabCount].tabKey}, () => {

package/v2Components/FormBuilder/messages.js

@@ -86,4 +86,8 @@ export default defineMessages({
     id: 'creatives.componentsV2.FormBuilder.imageReUpload',
     defaultMessage: 'Re upload',
   },
+  copyOf: {
+    id: 'creatives.componentsV2.FormBuilder.copyOf',
+    defaultMessage: 'Copy of',
+  },
 });

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -213,7 +213,7 @@ export function SlideBoxContent(props) {
     isEmailPreview = slidBoxContent === 'preview' && channel === constants.EMAIL;
     isMpushPreview = slidBoxContent === 'preview' && channel === constants.MOBILE_PUSH;
     isEditFTP = isEdit && [constants.NO_COMMUNICATION, constants.FTP].includes(channel);
-    isEditZalo = isEdit && channel?.toUpperCase() === constants.ZALO;
+    isEditZalo = isEdit && channel === constants.ZALO
   }
   const isDltEnabled = commonUtil.isTraiDLTEnable(isFullMode, smsRegister);
   const hasJPLocaleHideFeatureEnabled = commonUtil?.hasJPLocaleHideFeatureEnabled();
@@ -510,17 +510,11 @@ export function SlideBoxContent(props) {
       {
         isEditZalo &&
         <Zalo
-          isFullMode={isFullMode}
-          templateData={templateData}
-          getFormData={getFormData}
-          getDefaultTags={type}
-          forwardedTags={forwardedTags}
-          selectedOfferDetails={selectedOfferDetails}
-          location={{
-            pathname: `/zalo/edit`,
-            query,
-            search: '',
-          }}
+            templateData={templateData}
+            location={creativesLocationProps}
+            selectedOfferDetails={selectedOfferDetails}
+            getDefaultTags={type}
+            channel={channel}
         />
       }
       {

package/v2Containers/CreativesContainer/SlideBoxHeader.js

@@ -61,8 +61,9 @@ export function SlideBoxHeader(props) {
       email: <FormattedMessage {...messages.emailHeader} />,
       mobilepush: <FormattedMessage {...messages.pushNotificationHeader} />,
       wechat: <FormattedMessage {...messages.wechat} />,
-      no_communication: 'NO_COMMUNICATION',
-      ftp: 'FTP',
+      line: <FormattedMessage {...messages.lineHeader} />,
+      no_communication: <FormattedMessage {...messages.noCommunication} />,
+      ftp: <FormattedMessage {...messages.ftp} />,
       whatsapp: <FormattedMessage {...messages.whatsappTemplate} />,
       rcs: <FormattedMessage {...messages.rcsCreative} />,
       zalo: <FormattedMessage {...messages.zaloTemplate} />,

package/v2Containers/CreativesContainer/index.js

@@ -1,12 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import {
-  CapSlideBox,
-  CapHeader,
-  CapLink,
-  CapInput,
-  CapNotification,
-} from "@capillarytech/cap-ui-library";
+  CapSlideBox, CapHeader, CapLink, CapInput,
+} from '@capillarytech/cap-ui-library';
 import { injectIntl, FormattedMessage } from 'react-intl';
 import classnames from 'classnames';
 import {isEmpty, get, forEach, cloneDeep} from 'lodash';
@@ -27,10 +23,8 @@ import { gtmPush } from '../../utils/gtmTrackers';
 import './index.scss';
 import * as templateActions from '../Templates/actions';
 import * as globalActions from '../Cap/actions';
-import * as zaloActions from '../Zalo/actions';
 import {isLoading as isLoadingSelector} from './selectors';
 import messages from './messages';
-import zaloMessages from '../Zalo/messages';
 import { MAP_TEMPLATE } from '../WeChat/Wrapper/constants';
 import { makeSelectFetchingCmsData } from '../Email/selectors';
 import { IMAGE as LINE_IMAGE, IMAGE_MAP, IMAGE_CAROUSEL, VIDEO as LINE_VIDEO, TEMPLATE, STICKER } from '../Line/Container/constants';
@@ -103,35 +97,12 @@ export class Creatives extends React.Component {
     }
     this.setState(data);
   };
-
-  actionCallback = () => {
-    CapNotification.error({
-      message: <FormattedMessage {...zaloMessages.zaloFailureNotificationPreview}/>,
-    });
-  };
-
   onPreviewTemplate = (template) => {
-    if (template.type !== constants.ZALO.toLowerCase()) {
-      const templateData = template;
-      const usersList = commonUtil.getMergedUserList(this.props.templateUserList);
-      const userId = parseInt(template.updatedBy, 10);
-      templateData.updatedByName = commonUtil.getUserNameById(userId, usersList );
-      this.setState({ slidBoxContent: 'preview', templateData });
-    } else {
-      const {
-        name = "",
-        sourceAccountIdentifier = "",
-        configs: { token = "" } = {},
-      } = get(this.props, "Templates.weCrmAccounts[0]", {});
-      this.props.zaloActions.getTemplateInfoById({
-        username: name,
-        oa_id: sourceAccountIdentifier,
-        token,
-        id: template?._id,
-        preview: true,
-        actionCallback: this.actionCallback,
-      });
-    }
+    const templateData = template;
+    const usersList = commonUtil.getMergedUserList(this.props.templateUserList);
+    const userId = parseInt(template.updatedBy, 10);
+    templateData.updatedByName = commonUtil.getUserNameById(userId, usersList );
+    this.setState({ slidBoxContent: 'preview', templateData });
   };
   onEditTemplate = () => {
     this.setState({ slidBoxContent: 'editTemplate', showSlideBox: true, templateNameExists: true });
@@ -500,14 +471,6 @@ export class Creatives extends React.Component {
               },
             },
           };
-          break;
-        }
-        case constants.ZALO: {
-          creativesTemplateData = {
-            type: constants.ZALO,
-            ...templateData,
-          };
-          break;
         }
         default:
           break;
@@ -808,15 +771,6 @@ export class Creatives extends React.Component {
         }
       }
         break;
-      case constants.ZALO: {
-        if (template.value) {
-          templateData = {
-            ...template.value,
-          };
-          templateData?.type && delete templateData.type;
-        }
-      }
-        break;
       default:
         break;
     }
@@ -1251,7 +1205,6 @@ Creatives.propTypes = {
   channel: PropTypes.string,
   templateActions: PropTypes.object,
   globalActions: PropTypes.object,
-  zaloActions: PropTypes.object,
   cap: PropTypes.object,
   // isLoading: PropTypes.bool,
   templateUserList: PropTypes.array,
@@ -1280,7 +1233,6 @@ function mapDispatchToProps(dispatch) {
     templateActions: bindActionCreators(templateActions, dispatch),
     globalActions: bindActionCreators(globalActions, dispatch),
     actions: bindActionCreators(actions, dispatch),
-    zaloActions: bindActionCreators(zaloActions, dispatch),
   };
 }
 export default connect(mapStatesToProps, mapDispatchToProps)(injectIntl(Creatives));

package/v2Containers/CreativesContainer/messages.js

@@ -341,5 +341,13 @@ export default defineMessages({
   "wechat": {
     id: `${scope}.wechat`,
     defaultMessage: `Wechat`,
-  }
+  },
+  "ftp": {
+    id: `${scope}.ftp`,
+    defaultMessage: `FTP`,
+  },
+  "noCommunication": {
+    id: `${scope}.noCommunication`,
+    defaultMessage: `NO_COMMUNICATION`,
+  },
 });

package/v2Containers/TagList/index.js

@@ -260,7 +260,6 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
           modalProps={this.props.modalProps}
           currentOrgDetails={this.props.currentOrgDetails}
           channel={this.props.channel}
-          disabled={this.props.disabled}
         />
       </div>
     );
@@ -287,7 +286,6 @@ TagList.propTypes = {
   modalProps: PropTypes.any,
   currentOrgDetails: PropTypes.object,
   channel: PropTypes.string,
-  disabled: PropTypes.bool
 };
 
 const mapStateToProps = createStructuredSelector({

package/v2Containers/Templates/index.js

@@ -869,11 +869,10 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
   }
 
   filterZaloTemplates = (templates) => {
-    let { selectedZaloStatus } = this.state;
-    selectedZaloStatus = !this.props.isFullMode ? ZALO_STATUSES.ENABLE : selectedZaloStatus;
+    const { selectedZaloStatus } = this.state;
     if (selectedZaloStatus) {
-      return templates?.filter((template) => template?.versions?.base?.content?.zalo?.status === selectedZaloStatus);
-    }
+      return templates?.filter((template) => template?.versions?.base?.content?.zalo.status === selectedZaloStatus);
+    } 
     return templates;
   }
 
@@ -1910,12 +1909,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
 
   selectTemplate = (id) => find(this.props.TemplatesList, {_id: id})
 
-  actionCallback = () => {
-    CapNotification.error({
-      message: this.props.intl.formatMessage(zaloMessages.zaloFailureNotificationPreview),
-    });
-  };
-
   handlePreviewClick(template, modeType) {
     if (this.state.channel.toLowerCase() !== ZALO_LOWERCASE) {
       this.togglePreview();
@@ -1958,7 +1951,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         token: token,
         id: template?._id,
         preview: true,
-        actionCallback: this.actionCallback,
       });
     }
   }
@@ -2908,12 +2900,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             ) : null
           }
 
-          {
-            channel.toLowerCase() === ZALO_LOWERCASE && !isFullMode ? (
-              <CapInfoNote message={formatMessage(messages.zaloOnlyApprovedTemplates)} />
-            ) : null
-          }
-
           <CapRow>
             <Pagination onPageChange={templates.length ? this.onPaginationChange : () => {}} paginationSelector="pagination-container">
               {this.getTemplateDataForGrid({ isLoading, loadingTip, channel: this.state.channel, templates: this.state.searchingZaloTemplate ? this.state.searchedZaloTemplates : this.props.TemplatesList, filterContent, handlers: { handlePreviewClick: this.handlePreviewClick, handleEditClick: this.handleEditClick}})}

package/v2Containers/Templates/messages.js

@@ -502,8 +502,4 @@ export default defineMessages({
     id: `${scope}.zaloPreview`,
     defaultMessage: 'Open preview in new tab',
   },
-  "zaloOnlyApprovedTemplates": {
-    id: `${scope}.zaloOnlyApprovedTemplates`,
-    defaultMessage: 'Only enabled/approved templates are shown here',
-  },
 });