@capillarytech/creatives-library 7.17.19 → 7.17.21-alpha.0

package/package.json

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

package/utils/common.js

@@ -6,6 +6,7 @@ import {
   CARD_RELATED_TAGS,
   CARD_BASED_SCOPE,
 } from '../containers/App/constants';
+import { apiMessageFormatHandler } from './commonUtils';
 
 export function getUserNameById(userId, allUserList) {
   let userName = "";
@@ -262,3 +263,61 @@ export const isTraiDLTEnable = (isFullMode, smsRegister) => {
   const isTraiDltFeature = isTraiDltFeatureForOrg && isTraiEnableforLib;
   return isTraiDltFeature;
 };
+
+export const intlKeyGenerator = (value = "") => {
+  return value.replace(/[^a-zA-Z0-9_]/g, "");
+};
+
+export const handleInjectedData = (data, scope) => {
+  let temp = _.cloneDeep(data);
+  let tagType;
+  for (const tagKey in temp) {
+    if (temp.hasOwnProperty(tagKey)) {
+      const tag = temp[tagKey];
+
+      if (tag?.name === "Registration custom fields") {
+        tagType = "CustomTagMessage";
+      } else if (tag?.name === "Customer extended fields") {
+        tagType = "ExtendedTagMessage";
+      }
+
+      if (tag?.name) {
+        const name = tag?.name;
+        const key = intlKeyGenerator(name);
+        const id = tagType
+          ? `${scope}.${key}_name.${tagType}`
+          : `${scope}.${key}`;
+
+        tag["name"] = apiMessageFormatHandler(id, name);
+      }
+
+      if (tag["subtags"]) {
+        for (const subtagKey in tag["subtags"]) {
+          if (tag["subtags"].hasOwnProperty(subtagKey)) {
+            const subtag = tag["subtags"][subtagKey];
+            if (subtag?.name) {
+              const name = subtag?.name;
+              const key = intlKeyGenerator(name);
+              const id = tagType
+                ? `${scope}.${key}_name.${tagType}`
+                : `${scope}.${key}`;
+
+              subtag["name"] = apiMessageFormatHandler(id, name);
+            }
+            if (subtag?.desc) {
+              const desc = subtag?.desc;
+              const key = intlKeyGenerator(desc);
+              const id = tagType
+                ? `${scope}.${key}_desc.${tagType}`
+                : `${scope}.${key}`;
+
+              subtag["desc"] = apiMessageFormatHandler(id, desc);
+            }
+          }
+        }
+      }
+      tagType="";
+    }
+  }
+  return temp;
+};

package/utils/commonUtils.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { FormattedMessage } from 'react-intl';
+
+export const apiMessageFormatHandler = (id, fallback) => (
+    <FormattedMessage id={id} defaultMessage={fallback} />
+);

package/v2Components/CapTagList/index.js

@@ -43,6 +43,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
       dynamicDateValue: '',
       showModal: false,
       translationLang: '',
+      tagsList: []
     };
     this.renderTags = this.renderTags.bind(this);
     this.getSearchedExpandedKeys = this.getSearchedExpandedKeys.bind(this);
@@ -53,16 +54,25 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
   componentDidMount() {
     const user = localStorage.getItem('user');
     let locale = 'en';
+    moment.locale(locale);
     if (user) {
       locale = JSON.parse(user).lang || locale;
     }
     locale = this.getTranslationMappedLocale(locale);
-    moment.locale(locale);
     this.setState({
       translationLang: locale,
     });
   }
 
+  componentDidUpdate(prevProps, prevState){
+    if (this.props.tags !== prevProps.tags || this.state.searchValue !== prevState.searchValue) {
+      let temp = this.renderTags(this.props.tags, this.state.searchValue);
+      this.setState({
+        tagsList: temp
+      });
+    }
+  }
+
   onChange = (e) => {
     const value = e.target.value;
     let expandedKeys = this.getSearchedExpandedKeys(this.props.tags, value);
@@ -254,7 +264,8 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
           autoExpandParent={autoExpandParent}
           onExpand={this.onExpand}
         >
-          {this.renderTags(tg, searchValue)}
+          {/* {this.renderTags(tg, searchValue)} */}
+          {this.state.tagsList}
         </CapTree>
         {translationLang === "ja-JP" &&
           <div className="tag-list-footer">

package/v2Components/FormBuilder/index.js

@@ -3064,7 +3064,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                     injectedTags={this.props.injectedTags ? this.props.injectedTags : {}}
                     className={val.className ? val.className : ''}
                     id={val.id}
-                    userLocale={this.props.userLocale}
+                    userLocale={this.state.translationLang}
                     selectedOfferDetails={this.props.selectedOfferDetails}
                     channel={channel}
                   />

package/v2Containers/Cap/constants.js

@@ -15,9 +15,9 @@ export const GET_USER_DATA_REQUEST = 'cap/GET_USER_DATA_REQUEST_V2';
 export const GET_USER_DATA_SUCCESS = 'cap/GET_USER_DATA_SUCCESS_V2';
 export const GET_USER_DATA_FAILURE = 'cap/GET_USER_DATA_FAILURE_V2';
 
-export const GET_SCHEMA_FOR_ENTITY_FAILURE = 'cap/GET_SCHEMA_FOR_ENTITY_FAILURE';
-export const GET_SCHEMA_FOR_ENTITY_REQUEST = 'cap/GET_SCHEMA_FOR_ENTITY_REQUEST';
-export const GET_SCHEMA_FOR_ENTITY_SUCCESS = 'cap/GET_SCHEMA_FOR_ENTITY_SUCCESS';
+export const GET_SCHEMA_FOR_ENTITY_FAILURE = 'cap/GET_SCHEMA_FOR_ENTITY_FAILURE_V2';
+export const GET_SCHEMA_FOR_ENTITY_REQUEST = 'cap/GET_SCHEMA_FOR_ENTITY_REQUEST_V2';
+export const GET_SCHEMA_FOR_ENTITY_SUCCESS = 'cap/GET_SCHEMA_FOR_ENTITY_SUCCESS_V2';
 export const CLEAR_META_ENTITIES = 'cap/CLEAR_META_ENTITIES';
 export const HIDE_TAGS = 'cap/HIDE_TAGS';
 

package/v2Containers/Email/index.js

@@ -36,7 +36,6 @@ import { FONT_COLOR_05 } from '@capillarytech/cap-ui-library/styled/variables';
 import { gtmPush } from '../../utils/gtmTrackers';
 const {CapCustomCardList} = CapCustomCard;
 import {transformEmailTemplates, storeS3FileSizeDetails, CREATIVES_S3_ASSET_FILESIZES} from '../../utils/cdnTransformation';
-import { GET_TRANSLATION_MAPPED } from '../../containers/TagList/constants';
 
 export class Email extends React.Component { // eslint-disable-line react/prefer-stateless-function
   constructor(props) {
@@ -81,7 +80,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       addLanguageType: '',
       startValidation: false,
       saveForm: false,
-      translationLang: 'en',
     };
 
     this.isTagLoaded = false;
@@ -206,10 +204,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     //   this.startTemplateCreation();
     // }, 15000);
   }
-  
-  getTranslationMappedLocale(locale) {
-    return GET_TRANSLATION_MAPPED?.[locale];
-  }
+
   componentDidMount() {
     const query = {
       layout: 'EMAIL',
@@ -221,16 +216,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     if (this.props.location.query.type === 'embedded') {
       this.showNext();
     }
-    const user = localStorage.getItem('user');
-    let locale = 'en';
-    if (user) {
-      locale = JSON.parse(user)?.lang || locale;
-    }
-    locale = this.getTranslationMappedLocale(locale);
-    moment.locale(locale);
-    this.setState({
-      translationLang: locale,
-    });
   }
 
   checkBeeEditorAllowedForLibrary = () => {
@@ -2729,7 +2714,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
                   uuid={CmsSettings.uuid}
                   type={CmsSettings.type}
                   isEmailLoading={isLoading}
-                  userLocale={this.state.translationLang}
               /> : ''}
             </Col>
           </Row>

package/v2Containers/LanguageProvider/reducer.js

@@ -17,7 +17,9 @@ const initialState = fromJS({
 function languageProviderReducer(state = initialState, action) {
   switch (action.type) {
     case types.GET_LOCIZ_MESSAGE_REQUEST:
-      return state.set('localeLoading', true);
+      return state
+        .set('localeLoading', true)
+        .set('locale', action.locale);
     case types.GET_LOCIZ_MESSAGE_SUCCESS:
       return state
         .set('localeLoading', false)

package/v2Containers/LanguageProvider/tests/reducer.test.js

@@ -3,6 +3,7 @@ import { fromJS } from 'immutable';
 import languageProviderReducer from '../reducer';
 import {
   CHANGE_LOCALE,
+  GET_LOCIZ_MESSAGE_REQUEST,
 } from '../constants';
 
 describe('languageProviderReducer', () => {
@@ -21,4 +22,12 @@ describe('languageProviderReducer', () => {
       messages: {},
     });
   });
+
+  it('make locize message request', () => {
+    expect(languageProviderReducer(undefined, { type: GET_LOCIZ_MESSAGE_REQUEST, locale: 'de' }).toJS()).toEqual({
+      locale: "de",
+      localeLoading: true,
+      messages: {},
+    });
+  });
 });

package/v2Containers/Line/Container/Wrapper/tests/__snapshots__/index.test.js.snap

@@ -23058,7 +23058,7 @@ new message content.",
                                     </div>
                                   </ComponentWithLabelHOC__CapComponentStyled>
                                 </_class>
-                                <Connect(UserIsAuthenticated(Connect(TagList)))
+                                <Connect(UserIsAuthenticated(Connect(InjectIntl(TagList))))
                                   id="undefined_tags"
                                   injectedTags={Object {}}
                                   key="undefined_tags"
@@ -23079,7 +23079,7 @@ new message content.",
                                   tags={Array []}
                                   userLocale="en-US"
                                 >
-                                  <UserIsAuthenticated(Connect(TagList))
+                                  <UserIsAuthenticated(Connect(InjectIntl(TagList)))
                                     authData={
                                       Object {
                                         "app": Object {},
@@ -23125,7 +23125,7 @@ new message content.",
                                     tags={Array []}
                                     userLocale="en-US"
                                   />
-                                </Connect(UserIsAuthenticated(Connect(TagList)))>
+                                </Connect(UserIsAuthenticated(Connect(InjectIntl(TagList))))>
                                 <CapDrawer
                                   content={
                                     <React.Fragment>