@capillarytech/creatives-library 0.0.5 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/CardGrid/index.js +9 -1
- package/components/EmailPreview/index.js +1 -1
- package/components/FormBuilder/index.js +109 -28
- package/components/TemplatePreview/index.js +3 -0
- package/containers/Email/index.js +47 -25
- package/containers/Sms/Create/index.js +3 -3
- package/containers/Templates/actions.js +6 -0
- package/containers/Templates/constants.js +1 -0
- package/containers/Templates/index.js +17 -14
- package/containers/Templates/reducer.js +4 -0
- package/package.json +2 -1
- package/routes.js +2 -2
|
@@ -13,10 +13,18 @@ class CardGrid extends React.Component { // eslint-disable-line react/prefer-sta
|
|
|
13
13
|
super(props);
|
|
14
14
|
this.handleOnItemHover = this.handleOnItemHover.bind(this);
|
|
15
15
|
this.handleOnItemClick = this.handleOnItemClick.bind(this);
|
|
16
|
+
this.delayTimer = 0;
|
|
16
17
|
}
|
|
17
18
|
|
|
18
19
|
handleOnItemHover(state, id) {
|
|
19
|
-
this.
|
|
20
|
+
this.delay(() => {
|
|
21
|
+
this.props.onHoverItem(state, id);
|
|
22
|
+
}, 200);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
delay(callback, ms) {
|
|
26
|
+
clearTimeout(this.delayTimer);
|
|
27
|
+
this.delayTimer = setTimeout(callback, ms);
|
|
20
28
|
}
|
|
21
29
|
|
|
22
30
|
handleOnItemClick(state, id) {
|
|
@@ -504,7 +504,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
|
|
|
504
504
|
androidData[data] = this.state.formData[0][data];
|
|
505
505
|
}
|
|
506
506
|
}
|
|
507
|
-
if(_.isEmpty(androidData)
|
|
507
|
+
if(_.isEmpty(androidData)){
|
|
508
508
|
isOnlyIos = true;
|
|
509
509
|
}
|
|
510
510
|
const iosData = {};
|
|
@@ -513,7 +513,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
|
|
|
513
513
|
iosData[data] = this.state.formData[1][data];
|
|
514
514
|
}
|
|
515
515
|
}
|
|
516
|
-
if(_.isEmpty(iosData)
|
|
516
|
+
if(_.isEmpty(iosData)){
|
|
517
517
|
isOnlyAndroid = true;
|
|
518
518
|
}
|
|
519
519
|
_.forEach(this.state.formData, (tab, index) => {
|
|
@@ -739,31 +739,92 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
|
|
|
739
739
|
}
|
|
740
740
|
}
|
|
741
741
|
|
|
742
|
+
// Form Data Validation for Email Channel
|
|
742
743
|
if (this.props.schema && this.props.schema.channel && this.props.schema.channel.toUpperCase() === "EMAIL") {
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
// if (tagValidationResponse.valid) {
|
|
749
|
-
// errorData[count][`template-content${index > 1 ? index : ''}`] = false;
|
|
750
|
-
// } else {
|
|
751
|
-
// errorData[count][`template-content${index > 1 ? index : ''}`] = true;
|
|
752
|
-
// isValid = false;
|
|
753
|
-
// }
|
|
754
|
-
}
|
|
755
|
-
if (type.toLowerCase() === 'embedded' && (currentModule.toLowerCase() === 'loyalty' || currentModule.toLowerCase() === 'dvs' || currentModule.toLowerCase() === 'timeline' || currentModule.toLowerCase() === 'library')) {
|
|
756
|
-
if (this.state.formData['template-subject'] && this.state.formData['template-subject'].trim() === '') {
|
|
757
|
-
errorData['template-subject'] = true;
|
|
744
|
+
// Validating Email By iterating all elements of FormBuilder
|
|
745
|
+
_.forEach(this.state.formData, (data, index) => {
|
|
746
|
+
console.log("Form Iteration Data ", data, index);
|
|
747
|
+
if (!this.state.formData["template-subject"]) {
|
|
748
|
+
errorData["template-subject"] = true;
|
|
758
749
|
isValid = false;
|
|
759
750
|
}
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
751
|
+
// Check if template subject present in form data from Loyalty, DVS, Timeline
|
|
752
|
+
if (index === 'template-subject' && type.toLowerCase() === 'embedded' && (currentModule.toLowerCase() === 'loyalty' || currentModule.toLowerCase() === 'dvs' || currentModule.toLowerCase() === 'timeline')) {
|
|
753
|
+
if (data.trim() === '') {
|
|
754
|
+
errorData[index] = true;
|
|
755
|
+
isValid = false;
|
|
756
|
+
} else {
|
|
757
|
+
errorData[index] = false;
|
|
758
|
+
}
|
|
759
|
+
}
|
|
760
|
+
|
|
761
|
+
// Check if Template name present in full mode
|
|
762
|
+
if(type !== 'embedded' && index === 'template-name' && data === '') {
|
|
763
|
+
errorData[index] = true;
|
|
764
|
+
isValid = false;
|
|
765
|
+
} else if(type !== 'embedded' && index === 'template-name' && data !== '') {
|
|
766
|
+
errorData[index] = false;
|
|
767
|
+
}
|
|
768
|
+
|
|
769
|
+
// Check formData if selected version present or not
|
|
770
|
+
if(index === 'template-version' && data === '') {
|
|
771
|
+
errorData[index] = true;
|
|
772
|
+
isValid = false;
|
|
773
|
+
} else if(index === 'template-version' && data !== '') {
|
|
774
|
+
errorData[index] = false;
|
|
775
|
+
}
|
|
776
|
+
|
|
777
|
+
// Check error for the versions
|
|
778
|
+
if (!isNaN(index) || index === 'base') {
|
|
779
|
+
if (errorData[index] === undefined) {
|
|
780
|
+
errorData[index] = {};
|
|
781
|
+
}
|
|
782
|
+
for (var i = 0; i < data.selectedLanguages.length; i+= 1) {
|
|
783
|
+
const currentLang = data.selectedLanguages[i];
|
|
784
|
+
const content = data[currentLang]['template-content'];
|
|
785
|
+
const tagValidationResponse = this.validateTags(content, tags, injectedTags);
|
|
786
|
+
if (errorData[index][currentLang] === undefined) {
|
|
787
|
+
errorData[index][currentLang] = {};
|
|
788
|
+
}
|
|
789
|
+
console.log('tag valid response', tagValidationResponse);
|
|
790
|
+
if (tagValidationResponse.valid) {
|
|
791
|
+
errorData[index][currentLang]['template-content'] = false;
|
|
792
|
+
} else {
|
|
793
|
+
errorData[index][currentLang]['template-content'] = true;
|
|
794
|
+
isValid = false;
|
|
795
|
+
}
|
|
796
|
+
}
|
|
797
|
+
_.forEach(errorData[index], (versionData, key) => {
|
|
798
|
+
if (data.selectedLanguages.indexOf(key) === -1) {
|
|
799
|
+
delete errorData[index][key];
|
|
800
|
+
}
|
|
801
|
+
});
|
|
802
|
+
}
|
|
803
|
+
});
|
|
804
|
+
// for (let count = 0; count < this.state.tabCount; count += 1) {
|
|
805
|
+
// const index = count + 1;
|
|
806
|
+
// // const content = this.state.formData[count][`template-content${index > 1 ? index : ''}`];
|
|
807
|
+
// // const tagValidationResponse = this.validateTags(content, tags, injectedTags);
|
|
808
|
+
// // console.log('tag valid response', tagValidationResponse);
|
|
809
|
+
// // if (tagValidationResponse.valid) {
|
|
810
|
+
// // errorData[count][`template-content${index > 1 ? index : ''}`] = false;
|
|
811
|
+
// // } else {
|
|
812
|
+
// // errorData[count][`template-content${index > 1 ? index : ''}`] = true;
|
|
813
|
+
// // isValid = false;
|
|
814
|
+
// // }
|
|
815
|
+
// }
|
|
816
|
+
// if (type.toLowerCase() === 'embedded' && (currentModule.toLowerCase() === 'loyalty' || currentModule.toLowerCase() === 'dvs' || currentModule.toLowerCase() === 'timeline')) {
|
|
817
|
+
// if (this.state.formData['template-subject'] && this.state.formData['template-subject'].trim() === '') {
|
|
818
|
+
// errorData['template-subject'] = true;
|
|
819
|
+
// isValid = false;
|
|
820
|
+
// }
|
|
821
|
+
// }
|
|
822
|
+
// if(type !== 'embedded' && (!this.state.formData['template-name'] || this.state.formData['template-name'] === '')) {
|
|
823
|
+
// errorData['template-name'] = true;
|
|
824
|
+
// isValid = false;
|
|
825
|
+
// } else {
|
|
826
|
+
// errorData['template-name'] = false;
|
|
827
|
+
// }
|
|
767
828
|
}
|
|
768
829
|
this.setState({isFormValid : isValid, errorData});
|
|
769
830
|
console.log('final validity', this.state.formData, this.state, isValid);
|
|
@@ -908,10 +969,22 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
|
|
|
908
969
|
if (!errorData[idx]) {
|
|
909
970
|
errorData[idx] = {};
|
|
910
971
|
}
|
|
911
|
-
if (key === 'tabKey' || key === 'base') {
|
|
972
|
+
if (key === 'tabKey' || key === 'base' || key === 'selectedLanguages') {
|
|
912
973
|
return true;
|
|
913
974
|
}
|
|
914
|
-
|
|
975
|
+
if (this.props.isNewVersionFlow && formData[0].selectedLanguages.indexOf(key) > -1) {
|
|
976
|
+
_.forEach(formData[0].selectedLanguages, (lang) => {
|
|
977
|
+
if (errorData[idx] === undefined) {
|
|
978
|
+
errorData[idx] = {};
|
|
979
|
+
}
|
|
980
|
+
if (errorData[idx][lang] === undefined) {
|
|
981
|
+
errorData[idx][lang] = {};
|
|
982
|
+
}
|
|
983
|
+
errorData[idx][lang]['template-content'] = false;
|
|
984
|
+
});
|
|
985
|
+
} else {
|
|
986
|
+
errorData[idx][key] = false;
|
|
987
|
+
}
|
|
915
988
|
return true;
|
|
916
989
|
});
|
|
917
990
|
}
|
|
@@ -931,8 +1004,15 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
|
|
|
931
1004
|
formData[index] = {};
|
|
932
1005
|
}
|
|
933
1006
|
if (isContainer && this.props.isNewVersionFlow) {
|
|
1007
|
+
// if (formData[index] && formData[index].selectedLanguages && formData[index].selectedLanguages.length > 0) {
|
|
1008
|
+
// for (let i = 0; i < formData[index].selectedLanguages.length; i += 1 ) {
|
|
1009
|
+
// formData[index][formData[index].selectedLanguages[i]] = {};
|
|
1010
|
+
// }
|
|
1011
|
+
// } else {
|
|
1012
|
+
// formData[index][`${this.props.baseLanguage ? this.props.baseLanguage : 'en'}`] = {};
|
|
1013
|
+
// }
|
|
934
1014
|
_.forEach(this.props.supportedLanguages, (language) => {
|
|
935
|
-
if (!formData[index][language.iso_code]) {
|
|
1015
|
+
if (!formData[index][language.iso_code] && this.props.baseLanguage === language.iso_code) {
|
|
936
1016
|
formData[index][language.iso_code] = {};
|
|
937
1017
|
}
|
|
938
1018
|
});
|
|
@@ -1631,6 +1711,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
|
|
|
1631
1711
|
} else if (this.props.isNewVersionFlow && event !== 'onSelect') {
|
|
1632
1712
|
if (event === 'addLanguage') {
|
|
1633
1713
|
val.injectedEvents[event].call(this, data, formData, val);
|
|
1714
|
+
this.setState({currentEventVal: {}, currentEvent: {}, currentEventData: {}});
|
|
1634
1715
|
} else {
|
|
1635
1716
|
val.injectedEvents[event].call(this, true, formData, val);
|
|
1636
1717
|
}
|
|
@@ -3044,7 +3125,7 @@ FormBuilder.propTypes = {
|
|
|
3044
3125
|
currentTab: PropTypes.number,
|
|
3045
3126
|
showModal: PropTypes.bool,
|
|
3046
3127
|
handleCancelModal: PropTypes.func,
|
|
3047
|
-
cmsTemplates: PropTypes.
|
|
3128
|
+
cmsTemplates: PropTypes.array,
|
|
3048
3129
|
getCmsTemplatesInProgress: PropTypes.bool,
|
|
3049
3130
|
showEdmEmailTemplates: PropTypes.bool,
|
|
3050
3131
|
toggleEdmEmailTemplateSelection: PropTypes.func,
|
|
@@ -27,6 +27,9 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
27
27
|
// let smsText = '';
|
|
28
28
|
if (this.props.content && this.props.charCounterEnabled) {
|
|
29
29
|
smsDetails = charCount.updateCharCount(this.props.content);
|
|
30
|
+
if (document.getElementById("msg_count")) {
|
|
31
|
+
document.getElementById("msg_count").val = smsDetails.msgCount;
|
|
32
|
+
}
|
|
30
33
|
//smsText = this.props.intl.formatMessage(messages.previewGenerationMessage);
|
|
31
34
|
//console.log('message text', smsText);
|
|
32
35
|
}
|
|
@@ -768,7 +768,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
768
768
|
}, 0);
|
|
769
769
|
this.props.globalActions.fetchSchemaForEntity(query);
|
|
770
770
|
}
|
|
771
|
-
if (nextProps.location.query.module === '
|
|
771
|
+
if (nextProps.location.query.module === 'library' && nextProps.isGetFormData) {
|
|
772
772
|
nextProps.getFormSubscriptionData(this.getFormData());
|
|
773
773
|
}
|
|
774
774
|
if (nextProps.Global.currentOrgDetails && nextProps.Global.currentOrgDetails.basic_details && !_.isEmpty(nextProps.Global.currentOrgDetails.basic_details) && _.isEmpty(this.state.formData)) {
|
|
@@ -894,7 +894,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
894
894
|
html = html.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/\\"/g, '"');
|
|
895
895
|
console.log('html content ', html);
|
|
896
896
|
formData[this.state.currentTab - 1][langId]["template-content"] = html;
|
|
897
|
-
if (window.CKEDITOR) {
|
|
897
|
+
if (window.CKEDITOR && apiLangId !== "undefined") {
|
|
898
898
|
const instanceName = `template-content${(langIndex + 1) > 1 ? (langIndex + 1) : ''}`;
|
|
899
899
|
console.log('email switch data name', instanceName);
|
|
900
900
|
_.forEach(window.CKEDITOR.instances, (winInstance) => {
|
|
@@ -1193,7 +1193,10 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1193
1193
|
};
|
|
1194
1194
|
console.log('Get Data', response);
|
|
1195
1195
|
this.setState({checkValidation: true});
|
|
1196
|
-
e
|
|
1196
|
+
if (e) {
|
|
1197
|
+
e.source.postMessage(JSON.stringify(response), e.origin);
|
|
1198
|
+
}
|
|
1199
|
+
return response;
|
|
1197
1200
|
}
|
|
1198
1201
|
|
|
1199
1202
|
setFormValidity = (isFormValid) => {
|
|
@@ -1210,6 +1213,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1210
1213
|
let tabKey = "";
|
|
1211
1214
|
let currentTab = _.cloneDeep(this.state.currentTab);
|
|
1212
1215
|
const isLanguageSupport = this.props.location.query.isLanguageSupport;
|
|
1216
|
+
const type = this.props.location.query.type;
|
|
1213
1217
|
|
|
1214
1218
|
formData['template-name'] = editData.name;
|
|
1215
1219
|
formData.base = editData.versions.base;
|
|
@@ -1279,7 +1283,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1279
1283
|
schema.containers[index].isActive = false;
|
|
1280
1284
|
console.log('Dummy Random ', schema.containers[index].isActive, index);
|
|
1281
1285
|
}
|
|
1282
|
-
const type = this.props.location.query.type;
|
|
1283
1286
|
// const isLanguageSupport = this.props.location.query.isLanguageSupport;
|
|
1284
1287
|
console.log('Schema Test ', schema, schema.containers[index]);
|
|
1285
1288
|
_.forEach(data.selectedLanguages, (lang, langIndex) => {
|
|
@@ -1441,6 +1444,8 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1441
1444
|
saveObj: {},
|
|
1442
1445
|
showEdmEmailTemplates: false,
|
|
1443
1446
|
editDataSet: false,
|
|
1447
|
+
}, () => {
|
|
1448
|
+
console.log('Unmount value cleared', this.state);
|
|
1444
1449
|
});
|
|
1445
1450
|
}
|
|
1446
1451
|
|
|
@@ -1704,8 +1709,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1704
1709
|
console.log('Tranforming data for embedded mode', tmpData);
|
|
1705
1710
|
}
|
|
1706
1711
|
});
|
|
1707
|
-
if (this.props.location.query.type === 'embedded' && (this.props.location.query.module === "loyalty" || this.props.location.query.module === "dvs" || this.props.location.query.module === "timeline"
|
|
1708
|
-
this.props.location.query.module === "library")) {
|
|
1712
|
+
if (this.props.location.query.type === 'embedded' && (this.props.location.query.module === "loyalty" || this.props.location.query.module === "dvs" || this.props.location.query.module === "timeline" || this.props.location.query.module === "library")) {
|
|
1709
1713
|
newFormData.base.subject = formData['template-subject'];
|
|
1710
1714
|
}
|
|
1711
1715
|
|
|
@@ -2096,15 +2100,15 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2096
2100
|
}
|
|
2097
2101
|
|
|
2098
2102
|
addLanguage = (tempLang, passedData, val, asyncLanguages) => {
|
|
2099
|
-
this.
|
|
2100
|
-
|
|
2101
|
-
|
|
2102
|
-
|
|
2103
|
-
|
|
2104
|
-
|
|
2105
|
-
|
|
2106
|
-
}
|
|
2107
|
-
}
|
|
2103
|
+
if (this.state.addLanguageType === "upload") {
|
|
2104
|
+
this.setState({languageDataSet: true}, () => {
|
|
2105
|
+
console.log('adding from add language 1', this.props.Templates);
|
|
2106
|
+
if (this.props.Templates.selectedEmailLayout && this.props.Templates.selectedEmailLayout !== '') {
|
|
2107
|
+
console.log('adding from add language 2');
|
|
2108
|
+
this.setNewLanguageContent(this.props.Templates.selectedEmailLayout);
|
|
2109
|
+
}
|
|
2110
|
+
});
|
|
2111
|
+
}
|
|
2108
2112
|
let addLanguageLength = 1;
|
|
2109
2113
|
if (asyncLanguages) {
|
|
2110
2114
|
addLanguageLength = asyncLanguages.length;
|
|
@@ -2372,20 +2376,35 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2372
2376
|
return tempContainer;
|
|
2373
2377
|
});
|
|
2374
2378
|
console.log("Lang Test ", this.props.location.query.isLanguageSupport, (this.props.location.query.isLanguageSupport === false));
|
|
2375
|
-
if ( this.props.location.query.type === 'embedded' && (this.props.location.query.isLanguageSupport === "false" || this.props.location.query.isLanguageSupport === undefined)) {
|
|
2379
|
+
if ( this.props.location.query.type === 'embedded' && ((this.props.location.query.isLanguageSupport === "false" || this.props.location.query.isLanguageSupport === undefined) || this.props.location.query.isLanguageSupport === "true")) {
|
|
2380
|
+
const ifLangSupported = this.props.location.query.isLanguageSupport === "true";
|
|
2376
2381
|
_.forEach(temp.containers, (container) => {
|
|
2377
2382
|
if (container.isActive) {
|
|
2378
2383
|
let hideLang = false;
|
|
2379
2384
|
_.forEach(container.tabBarExtraContent.sections[0].inputFields[0].cols, (containerInputFieldCol) => {
|
|
2380
|
-
if (hideLang) {
|
|
2385
|
+
if (hideLang && !ifLangSupported) {
|
|
2386
|
+
const newContainerInputFieldCol = containerInputFieldCol;
|
|
2387
|
+
hideLang = false;
|
|
2388
|
+
newContainerInputFieldCol.offset = 18;
|
|
2389
|
+
} else if (hideLang) {
|
|
2381
2390
|
const newContainerInputFieldCol = containerInputFieldCol;
|
|
2382
2391
|
hideLang = false;
|
|
2383
|
-
newContainerInputFieldCol.
|
|
2392
|
+
newContainerInputFieldCol.offset = 14;
|
|
2384
2393
|
}
|
|
2385
|
-
if (containerInputFieldCol.id === 'add-language-button') {
|
|
2394
|
+
if (containerInputFieldCol.id === 'add-language-button' && !ifLangSupported) {
|
|
2386
2395
|
const newContainerInputFieldCol = containerInputFieldCol;
|
|
2387
2396
|
newContainerInputFieldCol.colStyle.display = "none";
|
|
2388
2397
|
hideLang = true;
|
|
2398
|
+
} else if (containerInputFieldCol.id === 'add-language-button') {
|
|
2399
|
+
hideLang = true;
|
|
2400
|
+
}
|
|
2401
|
+
if (containerInputFieldCol.id === "mark-final-version-label") {
|
|
2402
|
+
const newContainerInputFieldCol = containerInputFieldCol;
|
|
2403
|
+
newContainerInputFieldCol.colStyle.display = "none";
|
|
2404
|
+
}
|
|
2405
|
+
if (containerInputFieldCol.id === "tab-options-popover") {
|
|
2406
|
+
const newContainerInputFieldCol = containerInputFieldCol;
|
|
2407
|
+
newContainerInputFieldCol.colStyle.display = "none";
|
|
2389
2408
|
}
|
|
2390
2409
|
});
|
|
2391
2410
|
}
|
|
@@ -2397,7 +2416,10 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2397
2416
|
if (type === 'embedded') {
|
|
2398
2417
|
this.removeStandAlone();
|
|
2399
2418
|
}
|
|
2400
|
-
if (type === 'embedded' && (this.props.route.name === 'EmailView' || (this.props.location.query.module && this.props.location.query.module.toLowerCase() === 'loyalty'))) {
|
|
2419
|
+
if (type === 'embedded' && (this.props.route.name === 'EmailView' || (this.props.location.query.module && (this.props.location.query.module.toLowerCase() === 'loyalty' || this.props.location.query.module.toLowerCase() === 'dvs' || this.props.location.query.module.toLowerCase() === 'timeline')))) {
|
|
2420
|
+
if (this.props.route.name === "EmailEdit" && this.props.location.query.module === "dvs") {
|
|
2421
|
+
return;
|
|
2422
|
+
}
|
|
2401
2423
|
const response = {
|
|
2402
2424
|
action: 'startTemplateCreation',
|
|
2403
2425
|
};
|
|
@@ -2464,14 +2486,14 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2464
2486
|
|
|
2465
2487
|
//const data = {"base":{"subject":"deded","html_content":"<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"> <html> <head> \t<title>Scheduled Report</title> \t<meta http-equiv=\"Content-Type\" content=\"text/html charset=UTF-8\"/> \t<style type=\"text/css\">.container-main p{line-height: 1.6;}@media screen and (max-width: 480px){a.brand{font-size: 35px;}}@media screen and (max-width: 480px){.container-main a{text-align: center;}a.brand{text-align: center;}}a.brand img{vertical-align: middle; padding: 0 8px 0 0; width: 250px;}@media screen and (max-width: 480px){a.brand img{width: 220px !important;}}@media screen and (max-width: 480px){.container-content{padding: 15px 20px; font-size: 12px !important;} .email-footer{font-size: 12px !important;}}.container-content table{border-collapse: collapse;}.container-content table tr td p{margin: 5px;}.container-content table tr td p span{font-weight: bold; padding: 0 3px 0 0;}@media screen and (max-width: 480px){a.btn-view-reports{margin: 25px auto 10px;}}a.btn-view-reports:hover{background: grey; color: #fff;}.email-footer p{text-align: center; font-size: 12px; color: grey;}.email-footer p a{color: blue; cursor: pointer;}.email-footer p a:hover{color: grey;} \t</style> </head> <body><center>\n\t\t\t\t\t\t\t\t\t\tIf you have difficulties viewing this mail, click\n\t\t\t\t\t\t\t\t\t\t<a href=\"https://nightly.capillary.in/business_controller/campaigns/emails/links/view.php?utrack={{user_id_b64}}&mtrack={{outbox_id_b64}}\" style = \"text-decoration: underline;color: #369;\" target=\"_blank\">here</a><br/>\n\t\t\t\t\t\t\t\t\t</center> <table class=\"container-main\" style=\"background:#eeeeee; color:#000000; font-family:'Open Sans',sans-serif; font-size:16px; font-weight:400; margin:0 auto; max-width:978px; padding:15px; width:100%\"> \t<tbody> \t\t<tr> \t\t\t<td> \t\t\t<table class=\"email-header\" style=\"background:#ffffff; margin:0 0 5px; padding:17px 0; width:100%\"> \t\t\t\t<tbody> \t\t\t\t\t<tr> \t\t\t\t\t\t<td style=\"width:100%\"><a class=\"brand\" href=\"#\" style=\"display: table; margin: 0 auto; text-decoration: none; font-size: 37px; color: grey;\"><img alt=\"Capillary Technologies\" src=\"https://s3.amazonaws.com/fileservice.in/intouch_creative_assets/60221e2020ba572f6787.png\" /> </a></td> \t\t\t\t\t</tr> \t\t\t\t</tbody> \t\t\t</table> \t\t\t<div class=\"container-content\" style=\"background:#ffffff; padding:20px 35px\"> \t\t\t<p>Hi Ashish Karan,</p> \t\t\t<p>You've received a new scheduled report. {{unsubscribe}}</p> \t\t\t<table> \t\t\t\t<tbody> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Org Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>autotest1</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Scheduled Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>Schedule Test</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Time Period: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>1st Jan, 2017 to 24th Sep, 2017</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Report Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>redDart Report</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t</tbody> \t\t\t</table> \t\t\t<p style=\"font-size:15px; margin-top:25px\">By clicking "View Report" you will be redirected to Capillary Analytics to view the automated report.</p> \t\t\t<a href=\"https://nightly.capillary.in/analytics/v2/report/59c37820e626a10df78c8d91?snapshot=59c8bce750f4e75ec8b0d24c\" style=\"background: #009e0f; text-align: center; color: #fff; font-size: 16px; padding: 10px 25px; cursor: pointer; text-decoration: none; display: block; width: 120px; margin: 25px auto 15px;\" target=\"_blank\">View Report</a></div> \t\t\t<div class=\"email-footer\"> \t\t\t<p style=\"color:grey; font-size:12px; text-align:center\">You've received this mail because you subscribed to Schedule Test schedule of redDart Report. <a href=\"https://nightly.capillary.in/analytics/v2/report/59c37820e626a10df78c8d91/schedule/59c8bce750f4e75ec8b0d24c/unsubscribeSchedule\" style=\"color: blue; cursor: pointer;\" target=\"_blank\">Unsubscribe</a></p> \t\t\t<p><a href=\"http://capillarytech.com/privacy-policy/\" target=\"_blank\">Privacy Policy</a> | <a href=\"http://capillarytech.com/about-us/\" target=\"_blank\">About Capillary</a></p> \t\t\t</div> \t\t\t</td> \t\t</tr> \t</tbody> </table> </body> </html> ","is_drag_drop":false,"drag_drop_id":null},"secondary_templates":[{"is_preview_generated":null,"preview_url":null,"is_favourite":null,"is_drag_drop":false,"drag_drop_id":null,"scope":null,"tag":null,"is_default":null,"html_content":"<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"> <html> <head> \t<title>Scheduled Report</title> \t<meta http-equiv=\"Content-Type\" content=\"text/html charset=UTF-8\"/> \t<style type=\"text/css\">.container-main p{line-height: 1.6;}@media screen and (max-width: 480px){a.brand{font-size: 35px;}}@media screen and (max-width: 480px){.container-main a{text-align: center;}a.brand{text-align: center;}}a.brand img{vertical-align: middle; padding: 0 8px 0 0; width: 250px;}@media screen and (max-width: 480px){a.brand img{width: 220px !important;}}@media screen and (max-width: 480px){.container-content{padding: 15px 20px; font-size: 12px !important;} .email-footer{font-size: 12px !important;}}.container-content table{border-collapse: collapse;}.container-content table tr td p{margin: 5px;}.container-content table tr td p span{font-weight: bold; padding: 0 3px 0 0;}@media screen and (max-width: 480px){a.btn-view-reports{margin: 25px auto 10px;}}a.btn-view-reports:hover{background: grey; color: #fff;}.email-footer p{text-align: center; font-size: 12px; color: grey;}.email-footer p a{color: blue; cursor: pointer;}.email-footer p a:hover{color: grey;} \t</style> </head> <body><center>\n\t\t\t\t\t\t\t\t\t\tIf you have difficulties viewing this mail, click\n\t\t\t\t\t\t\t\t\t\t<a href=\"https://nightly.capillary.in/business_controller/campaigns/emails/links/view.php?utrack={{user_id_b64}}&mtrack={{outbox_id_b64}}\" style = \"text-decoration: underline;color: #369;\" target=\"_blank\">here</a><br/>\n\t\t\t\t\t\t\t\t\t</center> <table class=\"container-main\" style=\"background:#eeeeee; color:#000000; font-family:'Open Sans',sans-serif; font-size:16px; font-weight:400; margin:0 auto; max-width:978px; padding:15px; width:100%\"> \t<tbody> \t\t<tr> \t\t\t<td> \t\t\t<table class=\"email-header\" style=\"background:#ffffff; margin:0 0 5px; padding:17px 0; width:100%\"> \t\t\t\t<tbody> \t\t\t\t\t<tr> \t\t\t\t\t\t<td style=\"width:100%\"><a class=\"brand\" href=\"#\" style=\"display: table; margin: 0 auto; text-decoration: none; font-size: 37px; color: grey;\"><img alt=\"Capillary Technologies\" src=\"https://s3.amazonaws.com/fileservice.in/intouch_creative_assets/60221e2020ba572f6787.png\" /> </a></td> \t\t\t\t\t</tr> \t\t\t\t</tbody> \t\t\t</table> \t\t\t<div class=\"container-content\" style=\"background:#ffffff; padding:20px 35px\"> \t\t\t<p>Hi Ashish Karan,</p> \t\t\t<p>You've received a new scheduled report. {{unsubscribe}}</p> \t\t\t<table> \t\t\t\t<tbody> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Org Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>autotest1</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Scheduled Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>Schedule Test</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Time Period: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>1st Jan, 2017 to 24th Sep, 2017</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Report Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>redDart Report</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t</tbody> \t\t\t</table> \t\t\t<p style=\"font-size:15px; margin-top:25px\">By clicking "View Report" you will be redirected to Capillary Analytics to view the automated report.</p> \t\t\t<a href=\"https://nightly.capillary.in/analytics/v2/report/59c37820e626a10df78c8d91?snapshot=59c8bce750f4e75ec8b0d24c\" style=\"background: #009e0f; text-align: center; color: #fff; font-size: 16px; padding: 10px 25px; cursor: pointer; text-decoration: none; display: block; width: 120px; margin: 25px auto 15px;\" target=\"_blank\">View Report</a></div> \t\t\t<div class=\"email-footer\"> \t\t\t<p style=\"color:grey; font-size:12px; text-align:center\">You've received this mail because you subscribed to Schedule Test schedule of redDart Report. <a href=\"https://nightly.capillary.in/analytics/v2/report/59c37820e626a10df78c8d91/schedule/59c8bce750f4e75ec8b0d24c/unsubscribeSchedule\" style=\"color: blue; cursor: pointer;\" target=\"_blank\">Unsubscribe</a></p> \t\t\t<p><a href=\"http://capillarytech.com/privacy-policy/\" target=\"_blank\">Privacy Policy</a> | <a href=\"http://capillarytech.com/about-us/\" target=\"_blank\">About Capillary</a></p> \t\t\t</div> \t\t\t</td> \t\t</tr> \t</tbody> </table> </body> </html> ","secondary_template_id":"9500","is_base_template":1,"language_name":"English","language":"English","lang_id":"69"}],"edit":true,"tags":[]};
|
|
2466
2488
|
// const data = {edit: true, "base":{"subject":"testsubject","html_content":"<html> <head> \t<meta charset=\"utf-8\" /> \t<title>Aster Secure</title> \t<style type=\"text/css\">#outlook a { padding: 0; } body { width: 100% !important; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; margin: 0; padding: 0;} .ExternalClass { width: 100%; } .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div { line-height: 100%; } #backgroundTable { margin: 0; padding: 0; width: 100% !important; line-height: 100% !important; } img { outline: none; text-decoration: none; border: none; -ms-interpolation-mode: bicubic; } a img { border: none; } .image_fix { display: block; } p { margin: 0px 0px !important; } table td { border-collapse: collapse; } table { border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; } table[class=full] { width: 100%; clear: both; } table[class=spacetable] { height: 176px; } table[class=spacetable1] { height: 431px; } table[class=spacetable2] { height: 50px; } table[class=spacetable3] { height: 55px; } \t @media only screen and (min-width: 320px) and (max-width: 540px) { a[href^=\"tel\"], a[href^=\"sms\"] { text-decoration: none; color: #ffffff; pointer-events: none; cursor: default; } .mobile_link a[href^=\"tel\"], .mobile_link a[href^=\"sms\"] { text-decoration: default; color: #ffffff !important; pointer-events: auto; cursor: default; } img[class=logo] { width: 132px!important; } img[class=shop] { width:53px!important; text-align: center!important; } table[class=innerlayer] { width: 300px !important; text-align: center; } img[class=spot] { width: 65px!important; } img[class=banner] { width: 290px !important; text-align: center; } img[class=banner1] { width: 229px!important; } img[class=click] { width:55px!important; } img[class=border] { width: 290px!important; } td[class=txtfont] { font-size:11px!important; height:50px!important; line-height: 15px!important; } \t span[class=txtfont] { font-size:9px!important; height:98px!important; line-height:23px!important; } \t td[class=txtfont1] { font-size:11px!important; height:40px!important; line-height: 14px!important; } img[class=left] { width:195px!important; } img[class=right] { width:46px!important; } \t \t td[class=txtfont3] { font-size:8px!important;} \ttd[class=txtfont2] { font-size:6px!important; line-height:9px!important; } td[class=txtbold] { font-size: 21px!important; } img[class=gap] { width:92px!important; } img[class=gap1] { width: 20px!important; } table[class=social] { width: 99% !important; } img[class=fb] { width:20px!important; } img[class=in] { width:21px!important; } img[class=tw] { width:20px!important; } img[class=pin] { width:41px!important; } \t img[class=and] { width:81px!important; } img[class=my] { width: 44px!important; } \t img[class=you] { width:21px!important; } img[class=store] { width:65px!important; } \t \t img[class=snap] { width:24px!important; } td[class=textlen] { height:52px!important; } \ttd[class=tdlen] \t{ \theight:35px!important;font-size: 10px !important; \t} \t\t\timg[class=a] { width: 42px!important; } \t\t\timg[class=b] { width: 22px!important; } \t\t\timg[class=c] { width: 72px!important; } \t\t\timg[class=d] { width: 50px!important; } \t\t\timg[class=e] { width: 56px!important; } \t\t\timg[class=f] { width: 56px!important; } \t\t\t} \t</style> </head> <body><center>\n\t\t\t\t\t\t\t\t\t\tIf you have difficulties viewing this mail, click\n\t\t\t\t\t\t\t\t\t\t<a href=\"https://nightly.capillary.in/business_controller/campaigns/emails/links/view.php?utrack={{user_id_b64}}&mtrack={{outbox_id_b64}}\" style = \"text-decoration: underline;color: #369;\" target=\"_blank\">here</a><br/>\n\t\t\t\t\t\t\t\t\t</center> <table align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"outerlayer\" style=\"width:650px\"> \t<tbody> \t\t<tr> \t\t\t<td> \t\t\t<table align=\"center\" bgcolor=\"#fff\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"outerlayer\" style=\"width:650px\"> \t\t\t\t<tbody> \t\t\t\t\t<tr> \t\t\t\t\t\t<td class=\"txtfont2\" height=\"40\" style=\"font-family: Verdana, Geneva, sans-serif; text-align:center; font-size:11px; color:gray; line-height:13px;\" width=\"600\">Shop at Aster Pharmacy this month and You could be the next lucky winner!</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><a href=\"#\" style=\"pointer-events:none;\"><img class=\"banner\" src=\"https://s3-eu-west-1.amazonaws.com/fs.capillary.eu/intouch_creative_assets/890bdffee3b2322d8ec7.jpg\" style=\"border:none; display:block\" /></a></td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td class=\"txtfont2\" height=\"40\" style=\"font-family: Verdana, Geneva, sans-serif; text-align:center; font-size:11px; color:gray; line-height:13px;\" width=\"600\">To remove your email address from our mailing list , please click on {{unsubscribe}}</td> \t\t\t\t\t</tr> \t\t\t\t</tbody> \t\t\t</table> \t\t\t</td> \t\t</tr> \t</tbody> </table> </body> </html> ","is_drag_drop":0,"drag_drop_id":null},"secondary_templates":[{"is_preview_generated":null,"preview_url":null,"is_favourite":null,"is_drag_drop":false,"drag_drop_id":null,"scope":null,"tag":null,"is_default":null,"html_content":"<html>\r\n<head>\r\n\t<meta charset=\"utf-8\" />\r\n\t<title>Aster Secure</title>\r\n\t<style type=\"text/css\">#outlook a { padding: 0; } body { width: 100% !important; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; margin: 0; padding: 0;} .ExternalClass { width: 100%; } .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div { line-height: 100%; } #backgroundTable { margin: 0; padding: 0; width: 100% !important; line-height: 100% !important; } img { outline: none; text-decoration: none; border: none; -ms-interpolation-mode: bicubic; } a img { border: none; } .image_fix { display: block; } p { margin: 0px 0px !important; } table td { border-collapse: collapse; } table { border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; } table[class=full] { width: 100%; clear: both; } table[class=spacetable] { height: 176px; } table[class=spacetable1] { height: 431px; } table[class=spacetable2] { height: 50px; } table[class=spacetable3] { height: 55px; } \t @media only screen and (min-width: 320px) and (max-width: 540px) { a[href^=\"tel\"], a[href^=\"sms\"] { text-decoration: none; color: #ffffff; pointer-events: none; cursor: default; } .mobile_link a[href^=\"tel\"], .mobile_link a[href^=\"sms\"] { text-decoration: default; color: #ffffff !important; pointer-events: auto; cursor: default; } img[class=logo] { width: 132px!important; } img[class=shop] { width:53px!important; text-align: center!important; } table[class=innerlayer] { width: 300px !important; text-align: center; } img[class=spot] { width: 65px!important; } img[class=banner] { width: 290px !important; text-align: center; } img[class=banner1] { width: 229px!important; } img[class=click] { width:55px!important; } img[class=border] { width: 290px!important; } td[class=txtfont] { font-size:11px!important; height:50px!important; line-height: 15px!important; } \t span[class=txtfont] { font-size:9px!important; height:98px!important; line-height:23px!important; } \t td[class=txtfont1] { font-size:11px!important; height:40px!important; line-height: 14px!important; } img[class=left] { width:195px!important; } img[class=right] { width:46px!important; } \t \t td[class=txtfont3] { font-size:8px!important;} \ttd[class=txtfont2] { font-size:6px!important; line-height:9px!important; } td[class=txtbold] { font-size: 21px!important; } img[class=gap] { width:92px!important; } img[class=gap1] { width: 20px!important; } table[class=social] { width: 99% !important; } img[class=fb] { width:20px!important; } img[class=in] { width:21px!important; } img[class=tw] { width:20px!important; } img[class=pin] { width:41px!important; } \t img[class=and] { width:81px!important; } img[class=my] { width: 44px!important; } \t img[class=you] { width:21px!important; } img[class=store] { width:65px!important; } \t \t img[class=snap] { width:24px!important; } td[class=textlen] { height:52px!important; } \ttd[class=tdlen] \t{ \theight:35px!important;font-size: 10px !important; \t} \t\t\timg[class=a] { width: 42px!important; } \t\t\timg[class=b] { width: 22px!important; } \t\t\timg[class=c] { width: 72px!important; } \t\t\timg[class=d] { width: 50px!important; } \t\t\timg[class=e] { width: 56px!important; } \t\t\timg[class=f] { width: 56px!important; } \t\t\t}\r\n\t</style>\r\n</head>\r\n<body>\r\n<table align=\"center\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"outerlayer\" style=\"width:650px\">\r\n\t<tbody>\r\n\t\t<tr>\r\n\t\t\t<td>\r\n\t\t\t<table align=\"center\" bgcolor=\"#fff\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\" class=\"outerlayer\" style=\"width:650px\">\r\n\t\t\t\t<tbody>\r\n\t\t\t\t\t<tr>\r\n\t\t\t\t\t\t<td class=\"txtfont2\" height=\"40\" style=\"font-family: Verdana, Geneva, sans-serif; text-align:center; font-size:11px; color:gray; line-height:13px;\" width=\"600\">Shop at Aster Pharmacy this month and You could be the next lucky winner!</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t\t<tr>\r\n\t\t\t\t\t\t<td><a href=\"#\" style=\"pointer-events:none;\"><img class=\"banner\" src=\"https://s3-eu-west-1.amazonaws.com/fs.capillary.eu/intouch_creative_assets/890bdffee3b2322d8ec7.jpg\" style=\"border:none; display:block\" /></a></td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t\t<tr>\r\n\t\t\t\t\t\t<td class=\"txtfont2\" height=\"40\" style=\"font-family: Verdana, Geneva, sans-serif; text-align:center; font-size:11px; color:gray; line-height:13px;\" width=\"600\">To remove your email address from our mailing list , please click on {{unsubscribe}}</td>\r\n\t\t\t\t\t</tr>\r\n\t\t\t\t</tbody>\r\n\t\t\t</table>\r\n\t\t\t</td>\r\n\t\t</tr>\r\n\t</tbody>\r\n</table>\r\n</body>\r\n</html>\r\n","secondary_template_id":"9584","is_base_template":1,"language_name":"English","language":"English","lang_id":"69"}, {"is_preview_generated":null,"preview_url":null,"is_favourite":null,"is_drag_drop":false,"drag_drop_id":null,"scope":null,"tag":null,"is_default":null,"html_content":"<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"> <html> <head> \t<title>Scheduled Report</title> \t<meta http-equiv=\"Content-Type\" content=\"text/html charset=UTF-8\"/> \t<style type=\"text/css\">.container-main p{line-height: 1.6;}@media screen and (max-width: 480px){a.brand{font-size: 35px;}}@media screen and (max-width: 480px){.container-main a{text-align: center;}a.brand{text-align: center;}}a.brand img{vertical-align: middle; padding: 0 8px 0 0; width: 250px;}@media screen and (max-width: 480px){a.brand img{width: 220px !important;}}@media screen and (max-width: 480px){.container-content{padding: 15px 20px; font-size: 12px !important;} .email-footer{font-size: 12px !important;}}.container-content table{border-collapse: collapse;}.container-content table tr td p{margin: 5px;}.container-content table tr td p span{font-weight: bold; padding: 0 3px 0 0;}@media screen and (max-width: 480px){a.btn-view-reports{margin: 25px auto 10px;}}a.btn-view-reports:hover{background: grey; color: #fff;}.email-footer p{text-align: center; font-size: 12px; color: grey;}.email-footer p a{color: blue; cursor: pointer;}.email-footer p a:hover{color: grey;} \t</style> </head> <body><center>\n\t\t\t\t\t\t\t\t\t\tIf you have difficulties viewing this mail, click\n\t\t\t\t\t\t\t\t\t\t<a href=\"https://nightly.capillary.in/business_controller/campaigns/emails/links/view.php?utrack={{user_id_b64}}&mtrack={{outbox_id_b64}}\" style = \"text-decoration: underline;color: #369;\" target=\"_blank\">here</a><br/>\n\t\t\t\t\t\t\t\t\t</center> <table class=\"container-main\" style=\"background:#eeeeee; color:#000000; font-family:'Open Sans',sans-serif; font-size:16px; font-weight:400; margin:0 auto; max-width:978px; padding:15px; width:100%\"> \t<tbody> \t\t<tr> \t\t\t<td> \t\t\t<table class=\"email-header\" style=\"background:#ffffff; margin:0 0 5px; padding:17px 0; width:100%\"> \t\t\t\t<tbody> \t\t\t\t\t<tr> \t\t\t\t\t\t<td style=\"width:100%\"><a class=\"brand\" href=\"#\" style=\"display: table; margin: 0 auto; text-decoration: none; font-size: 37px; color: grey;\"><img alt=\"Capillary Technologies\" src=\"https://s3.amazonaws.com/fileservice.in/intouch_creative_assets/60221e2020ba572f6787.png\" /> </a></td> \t\t\t\t\t</tr> \t\t\t\t</tbody> \t\t\t</table> \t\t\t<div class=\"container-content\" style=\"background:#ffffff; padding:20px 35px\"> \t\t\t<p>Hi Ashish Karan,</p> \t\t\t<p>You've received a new scheduled report. {{unsubscribe}}</p> \t\t\t<table> \t\t\t\t<tbody> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Org Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>autotest1</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Scheduled Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>Schedule Test</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Time Period: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>1st Jan, 2017 to 24th Sep, 2017</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t\t<tr> \t\t\t\t\t\t<td><strong>Report Name: </strong></td> \t\t\t\t\t\t<td> \t\t\t\t\t\t<p>redDart Report</p> \t\t\t\t\t\t</td> \t\t\t\t\t</tr> \t\t\t\t</tbody> \t\t\t</table> \t\t\t<p style=\"font-size:15px; margin-top:25px\">By clicking "View Report" you will be redirected to Capillary Analytics to view the automated report.</p> \t\t\t<a href=\"https://nightly.capillary.in/analytics/v2/report/59c37820e626a10df78c8d91?snapshot=59c8bce750f4e75ec8b0d24c\" style=\"background: #009e0f; text-align: center; color: #fff; font-size: 16px; padding: 10px 25px; cursor: pointer; text-decoration: none; display: block; width: 120px; margin: 25px auto 15px;\" target=\"_blank\">View Report</a></div> \t\t\t<div class=\"email-footer\"> \t\t\t<p style=\"color:grey; font-size:12px; text-align:center\">You've received this mail because you subscribed to Schedule Test schedule of redDart Report. <a href=\"https://nightly.capillary.in/analytics/v2/report/59c37820e626a10df78c8d91/schedule/59c8bce750f4e75ec8b0d24c/unsubscribeSchedule\" style=\"color: blue; cursor: pointer;\" target=\"_blank\">Unsubscribe</a></p> \t\t\t<p><a href=\"http://capillarytech.com/privacy-policy/\" target=\"_blank\">Privacy Policy</a> | <a href=\"http://capillarytech.com/about-us/\" target=\"_blank\">About Capillary</a></p> \t\t\t</div> \t\t\t</td> \t\t</tr> \t</tbody> </table> </body> </html> ","secondary_template_id":"9500","is_base_template":false,"language_name":"Hindi","language":"Hindi","lang_id":"151"},{"is_preview_generated":null,"preview_url":null,"is_favourite":null,"is_drag_drop":1,"drag_drop_id":"55acf47048a85bbf7681a35a","scope":null,"tag":null,"is_default":null,"html_content":"","secondary_template_id":"9500","is_base_template":0,"language_name":"Japanese","language":"Japanese","lang_id":"100"}]};
|
|
2467
|
-
console.log('Start template creation ', data);
|
|
2489
|
+
console.log('Start template creation ', data, this.props.location.query.isLanguageSupport, this.props.location.query.type === 'embedded', this.props.location.query.type === 'embedded' && !this.props.location.query.isLanguageSupport);
|
|
2468
2490
|
if (data && data.edit) {
|
|
2469
2491
|
console.log('startTemplateCreation');
|
|
2470
2492
|
// const formData = {'0': {}};
|
|
2471
2493
|
const formData = _.cloneDeep(this.state.formData);
|
|
2472
2494
|
formData[0].selectedLanguages = [];
|
|
2473
2495
|
let tabKey;
|
|
2474
|
-
if (this.props.location.query.type === 'embedded' &&
|
|
2496
|
+
if (this.props.location.query.type === 'embedded' && (this.props.location.query.isLanguageSupport === undefined || this.props.location.query.isLanguageSupport === 'false')) {
|
|
2475
2497
|
formData['template-subject'] = data.base.subject ? data.base.subject : '';
|
|
2476
2498
|
const baseLanguage = this.props.Global.currentOrgDetails.basic_details.base_language;
|
|
2477
2499
|
let languageIndex = _.findIndex(this.supportedLanguages, {iso_code: baseLanguage});
|
|
@@ -2942,7 +2964,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2942
2964
|
</Pagination>
|
|
2943
2965
|
</div>
|
|
2944
2966
|
);
|
|
2945
|
-
console.log('Render Form Data ', this.state.formData, this.supportedLanguages);
|
|
2967
|
+
console.log('Render Form Data ', this.state.formData, this.supportedLanguages, this.state);
|
|
2946
2968
|
if (!this.props.Global.currentOrgDetails || !this.props.Global.currentOrgDetails.basic_details) {
|
|
2947
2969
|
return (<div>Loading...</div>);
|
|
2948
2970
|
}
|
|
@@ -3026,7 +3048,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
3026
3048
|
</Spin>
|
|
3027
3049
|
{!_.isEmpty(this.state.formData[(this.state.currentTab - 1)]) && <EmailPreview
|
|
3028
3050
|
header={previewHeader}
|
|
3029
|
-
content={this.state.formData[(this.state.currentTab - 1)][this.state.formData[(this.state.currentTab - 1)].activeTab][`template-content`]}
|
|
3051
|
+
content={this.state.formData[(this.state.currentTab - 1)][this.state.formData[(this.state.currentTab - 1)].activeTab] ? this.state.formData[(this.state.currentTab - 1)][this.state.formData[(this.state.currentTab - 1)].activeTab][`template-content`] : ''}
|
|
3030
3052
|
show={this.state.showEmailPreview}
|
|
3031
3053
|
device={this.state.device}
|
|
3032
3054
|
handleClose={this.toggleEmailPreview}
|
|
@@ -3058,7 +3080,7 @@ Email.propTypes = {
|
|
|
3058
3080
|
Global: PropTypes.object,
|
|
3059
3081
|
templatesActions: PropTypes.object,
|
|
3060
3082
|
route: PropTypes.object,
|
|
3061
|
-
|
|
3083
|
+
templateData: PropTypes.object,
|
|
3062
3084
|
};
|
|
3063
3085
|
|
|
3064
3086
|
const mapStateToProps = createStructuredSelector({
|
|
@@ -117,7 +117,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
|
|
|
117
117
|
|
|
118
118
|
componentWillReceiveProps(nextProps) {
|
|
119
119
|
console.log('recieved props ', nextProps, nextProps.Create, this.props.Create);
|
|
120
|
-
if (nextProps.location.query.module === '
|
|
120
|
+
if (nextProps.location.query.module === 'library' && nextProps.isGetFormData) {
|
|
121
121
|
nextProps.getFormSubscriptionData(this.getFormData());
|
|
122
122
|
}
|
|
123
123
|
if (nextProps.createResponse && nextProps.createResponse.templateId) {
|
|
@@ -141,7 +141,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
|
|
|
141
141
|
if (nextProps.metaEntities && nextProps.metaEntities.layouts && nextProps.metaEntities.layouts.length > 0 && _.isEmpty(this.state.schema)) {
|
|
142
142
|
console.log('final schema is**', nextProps.metaEntities.layouts[0].definition);
|
|
143
143
|
this.injectEvents(nextProps.metaEntities.layouts[0].definition);
|
|
144
|
-
if (this.props.location.query.module !== '
|
|
144
|
+
if (this.props.location.query.module !== 'library') {
|
|
145
145
|
const query = {
|
|
146
146
|
layout: 'SMS',
|
|
147
147
|
type: 'TAG',
|
|
@@ -1397,7 +1397,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
|
|
|
1397
1397
|
const schema = this.state.schema;
|
|
1398
1398
|
const spinning = this.state.loading || (this.props.Create && "createTemplateInProgress" in this.props.Create && this.props.Create.createTemplateInProgress);
|
|
1399
1399
|
let tags = this.props.metaEntities && this.props.metaEntities.tags ? this.props.metaEntities.tags.standard : [];
|
|
1400
|
-
if (this.props.location.query.type === 'embedded' && this.props.location.query.module === '
|
|
1400
|
+
if (this.props.location.query.type === 'embedded' && this.props.location.query.module === 'library') {
|
|
1401
1401
|
tags = this.props.supportedTags;
|
|
1402
1402
|
}
|
|
1403
1403
|
return (
|
|
@@ -42,3 +42,4 @@ export const RESET_ACCOUNT = "app/containers/Templates/RESET_ACCOUNT";
|
|
|
42
42
|
export const RESET_TEMPLATE = "app/containers/Templates/RESET_TEMPLATE";
|
|
43
43
|
export const RESET_TEMPLATE_DATA = "app/containers/Templates/RESET_TEMPLATE_DATA";
|
|
44
44
|
export const RESET_UPLOAD_DATA = "app/containers/Templates/RESET_UPLOAD_DATA";
|
|
45
|
+
export const CLEAR_TEMPLATE_STORE_DATA = "app/containers/Templates/CLEAR_TEMPLATE_STORE_DATA";
|
|
@@ -293,6 +293,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
293
293
|
componentWillUnmount() {
|
|
294
294
|
console.log('removed listener templates');
|
|
295
295
|
window.removeEventListener("message", this.handleFrameTasks);
|
|
296
|
+
this.props.actions.resetTemplateStoreData();
|
|
296
297
|
}
|
|
297
298
|
|
|
298
299
|
onAccountSelect(value, option) {
|
|
@@ -765,7 +766,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
765
766
|
let getQuery = '';
|
|
766
767
|
console.log('Selected EDM Data ', data);
|
|
767
768
|
this.props.actions.setEdmTemplate(data);
|
|
768
|
-
if (
|
|
769
|
+
if (this.state.channel && this.state.channel.toLowerCase() === 'email') {
|
|
769
770
|
getQuery = (type === 'embedded') ? {type: 'embedded', module, isLanguageSupport, isEdmSupport} : {module, isLanguageSupport, isEdmSupport};
|
|
770
771
|
} else {
|
|
771
772
|
getQuery = (type === 'embedded') ? {type: 'embedded', module} : {module};
|
|
@@ -923,7 +924,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
923
924
|
data.map( (template) => {
|
|
924
925
|
// console.log("Templates ", template._id, " Data ", template);
|
|
925
926
|
const temp = {};
|
|
926
|
-
console.log('template ', template);
|
|
927
|
+
// console.log('template ', template);
|
|
927
928
|
const updateDateTime = (moment().format('DD-MM-YYYY') === moment(template.updatedAt).format('DD-MM-YYYY')) ? moment(template.updatedAt).format('hh:mma') : moment(template.updatedAt).format('DD MMM YYYY');
|
|
928
929
|
let content = '';
|
|
929
930
|
temp.id = template._id;
|
|
@@ -932,32 +933,32 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
932
933
|
temp.content = (
|
|
933
934
|
<div
|
|
934
935
|
className="sms-template-content">
|
|
935
|
-
<div className={`sms-text ${this.state.
|
|
936
|
+
<div className={`sms-text ${this.state.hoveredItem === template._id ? 'sms-text-blurred' : ''}`}>
|
|
936
937
|
{content || ''}
|
|
937
938
|
</div>
|
|
938
|
-
{template._id === this.state.
|
|
939
|
-
{template._id === this.state.
|
|
939
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={(e) => this.handleEditClick(e, template._id)} className="edit-button" type="secondary">{type === 'embedded' ? this.props.intl.formatMessage(messages.selectButton) : this.props.intl.formatMessage(messages.editButton)}</CapButton> : ''}
|
|
940
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={() => this.handlePreviewClick(template)} className="preview-button" type="cancel">{this.props.intl.formatMessage(messages.previewButton)}</CapButton> : ''}
|
|
940
941
|
</div>);
|
|
941
942
|
} else if (this.state.channel.toLowerCase() === 'email') {
|
|
942
943
|
// console.log('Data Prepare');
|
|
943
944
|
temp.content = (
|
|
944
945
|
<div
|
|
945
946
|
className="sms-template-content">
|
|
946
|
-
<div className={`sms-text ${this.state.
|
|
947
|
+
<div className={`sms-text ${this.state.hoveredItem === template._id ? 'sms-text-blurred' : ''}`}>
|
|
947
948
|
|
|
948
949
|
</div>
|
|
949
|
-
{template._id === this.state.
|
|
950
|
-
{template._id === this.state.
|
|
950
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={(e) => this.handleEditClick(e, template._id)} className="edit-button" type="secondary">{type === 'embedded' ? this.props.intl.formatMessage(messages.selectButton) : this.props.intl.formatMessage(messages.editButton)}</CapButton> : ''}
|
|
951
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={() => this.handlePreviewClick(template)} className="preview-button" type="cancel">{this.props.intl.formatMessage(messages.previewButton)}</CapButton> : ''}
|
|
951
952
|
</div>);
|
|
952
953
|
} else if (this.state.channel.toLowerCase() === 'mobilepush') {
|
|
953
954
|
content = this.prepareMobilePushPreviewData(template.versions.base);
|
|
954
955
|
temp.content = (
|
|
955
956
|
<div>
|
|
956
|
-
<div className={`mobilepush-message ${this.state.
|
|
957
|
+
<div className={`mobilepush-message ${this.state.hoveredItem === template._id ? 'sms-text-blurred' : ''}`}>
|
|
957
958
|
{content || ''}
|
|
958
959
|
</div>
|
|
959
|
-
{template._id === this.state.
|
|
960
|
-
{template._id === this.state.
|
|
960
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={(e) => this.handleEditClick(e, template._id)} className="edit-button" type="secondary">{type === 'embedded' ? this.props.intl.formatMessage(messages.selectButton) : this.props.intl.formatMessage(messages.editButton)}</CapButton> : ''}
|
|
961
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={() => this.handlePreviewClick(template)} className="preview-button" type="cancel">{this.props.intl.formatMessage(messages.previewButton)}</CapButton> : ''}
|
|
961
962
|
</div>);
|
|
962
963
|
} else {
|
|
963
964
|
content = template && template.versions && template.versions.base ? template.versions.base['sms-editor'] : '';
|
|
@@ -969,9 +970,9 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
969
970
|
temp.content = (
|
|
970
971
|
<div
|
|
971
972
|
className="sms-template-content">
|
|
972
|
-
<div className={`sms-text ${this.state.
|
|
973
|
-
{template._id === this.state.
|
|
974
|
-
{template._id === this.state.
|
|
973
|
+
<div className={`sms-text ${this.state.hoveredItem === template._id ? 'sms-text-blurred' : ''}`}>{content || ''}</div>
|
|
974
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={(e) => this.handleEditClick(e, template._id)} className="edit-button" type="secondary">{type === 'embedded' ? this.props.intl.formatMessage(messages.selectButton) : this.props.intl.formatMessage(messages.editButton)}</CapButton> : ''}
|
|
975
|
+
{template._id === this.state.hoveredItem ? <CapButton onClick={() => this.handlePreviewClick(template)} className="preview-button" type="cancel">{this.props.intl.formatMessage(messages.previewButton)}</CapButton> : ''}
|
|
975
976
|
</div>
|
|
976
977
|
);
|
|
977
978
|
}
|
|
@@ -1371,6 +1372,8 @@ Templates.propTypes = {
|
|
|
1371
1372
|
globalActions: PropTypes.object,
|
|
1372
1373
|
intl: intlShape.isRequired,
|
|
1373
1374
|
Global: PropTypes.object,
|
|
1375
|
+
createNew: PropTypes.func,
|
|
1376
|
+
onSelectTemplate: PropTypes.func,
|
|
1374
1377
|
};
|
|
1375
1378
|
|
|
1376
1379
|
const mapStateToProps = createStructuredSelector({
|
|
@@ -127,6 +127,10 @@ function templatesReducer(state = initialState, action) {
|
|
|
127
127
|
return state
|
|
128
128
|
.set('getTemplateDetailsInProgress', false)
|
|
129
129
|
.set('templateDetails', fromJS({}));
|
|
130
|
+
case types.CLEAR_TEMPLATE_STORE_DATA:
|
|
131
|
+
return state
|
|
132
|
+
.set('templates', fromJS({}))
|
|
133
|
+
.set('weCRMtemplates', fromJS({}));
|
|
130
134
|
default:
|
|
131
135
|
return state;
|
|
132
136
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@capillarytech/creatives-library",
|
|
3
3
|
"author": "meharaj",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.6",
|
|
5
5
|
"description": "Capillary creatives ui",
|
|
6
6
|
"main": "./index.js",
|
|
7
7
|
"module": "./index.es.js",
|
|
@@ -25,6 +25,7 @@
|
|
|
25
25
|
"express": "4.14.0",
|
|
26
26
|
"fixed-data-table": "^0.6.4",
|
|
27
27
|
"fontfaceobserver": "2.0.7",
|
|
28
|
+
"fs-extra": "^5.0.0",
|
|
28
29
|
"immutable": "3.8.1",
|
|
29
30
|
"intl": "1.2.5",
|
|
30
31
|
"invariant": "2.2.2",
|
package/routes.js
CHANGED
|
@@ -215,7 +215,7 @@ export default function createRoutes(store) {
|
|
|
215
215
|
},
|
|
216
216
|
{
|
|
217
217
|
path: '/assets',
|
|
218
|
-
name: '
|
|
218
|
+
name: 'GALLERY',
|
|
219
219
|
getComponent(nextState, cb) {
|
|
220
220
|
const importModules = Promise.all([
|
|
221
221
|
import('containers/Assets/Gallery/reducer'),
|
|
@@ -317,7 +317,7 @@ export default function createRoutes(store) {
|
|
|
317
317
|
},
|
|
318
318
|
}, {
|
|
319
319
|
path: '/email/edit/:id',
|
|
320
|
-
name: '
|
|
320
|
+
name: 'EmailEdit',
|
|
321
321
|
getComponent(nextState, cb) {
|
|
322
322
|
const importModules = Promise.all([
|
|
323
323
|
import('containers/Email/reducer'),
|