@capillarytech/creatives-library 7.10.57 → 7.10.59
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/containers/Assets/Gallery/tests/__snapshots__/reducer.test.js.snap +0 -2
- package/containers/Email/index.js +2 -3
- package/index.js +0 -6
- package/package.json +2 -1
- package/routes.js +0 -5
- package/services/api.js +1 -6
- package/utils/v2common.js +0 -13
- package/v2Components/TemplatePreview/_templatePreview.scss +2 -24
- package/v2Components/TemplatePreview/index.js +8 -87
- package/v2Components/TemplatePreview/messages.js +0 -12
- package/v2Containers/App/constants.js +1 -4
- package/v2Containers/Assets/Gallery/tests/__snapshots__/reducer.test.js.snap +0 -2
- package/v2Containers/Cap/messages.js +1 -12
- package/v2Containers/CreativesContainer/SlideBoxContent.js +7 -42
- package/v2Containers/CreativesContainer/SlideBoxHeader.js +14 -55
- package/v2Containers/CreativesContainer/constants.js +0 -1
- package/v2Containers/CreativesContainer/index.js +4 -93
- package/v2Containers/CreativesContainer/messages.js +0 -8
- package/v2Containers/Email/index.js +1 -3
- package/v2Containers/Line/Container/index.js +1 -1
- package/v2Containers/Templates/_templates.scss +0 -64
- package/v2Containers/Templates/actions.js +10 -12
- package/v2Containers/Templates/constants.js +1 -3
- package/v2Containers/Templates/index.js +72 -419
- package/v2Containers/Templates/messages.js +2 -58
- package/v2Containers/Templates/reducer.js +1 -3
- package/v2Containers/TemplatesV2/index.js +0 -17
- package/v2Containers/TemplatesV2/messages.js +0 -4
|
@@ -2733,12 +2733,11 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2733
2733
|
} else {
|
|
2734
2734
|
this.setState({injectedTags: data.tags});
|
|
2735
2735
|
}
|
|
2736
|
-
|
|
2737
|
-
this.props.globalActions.setInjectedTags(data.tags);
|
|
2738
|
-
}
|
|
2736
|
+
this.props.globalActions.setInjectedTags(data.tags);
|
|
2739
2737
|
}
|
|
2740
2738
|
|
|
2741
2739
|
startLoading = (ifEdit) => {
|
|
2740
|
+
|
|
2742
2741
|
if (ifEdit) {
|
|
2743
2742
|
this.setState({loading: true});
|
|
2744
2743
|
}
|
package/index.js
CHANGED
|
@@ -87,10 +87,6 @@ import SmsTraiCreate from './v2Containers/SmsTrai/Create';
|
|
|
87
87
|
import SmsTraiCreateReducer from './v2Containers/SmsTrai/Create/reducer';
|
|
88
88
|
import SmsTraiCreateSaga from './v2Containers/SmsTrai/Create/sagas';
|
|
89
89
|
|
|
90
|
-
import Whatsapp from './v2Containers/Whatsapp';
|
|
91
|
-
import whatsappReducer from './v2Containers/Whatsapp/reducer';
|
|
92
|
-
import whatsappSaga from './v2Containers/Whatsapp/sagas';
|
|
93
|
-
|
|
94
90
|
export {default as Ebill} from './v2Containers/Ebill';
|
|
95
91
|
export {default as EbillReducer} from './v2Containers/Ebill/reducer';
|
|
96
92
|
export {default as EbillSaga} from './v2Containers/Ebill/sagas';
|
|
@@ -115,7 +111,6 @@ const FacebookContainer = {Facebook, facebookReducer, facebookSaga};
|
|
|
115
111
|
const ViberContainer = {Viber, viberReducer, viberSaga};
|
|
116
112
|
const FacebookPreviewContainer = { FacebookPreview, facebookPreviewReducer, facebookPreviewSaga };
|
|
117
113
|
const SmsTraiContainer = {SmsTraiCreate, SmsTraiCreateReducer, SmsTraiCreateSaga};
|
|
118
|
-
const WhatsappContainer = { Whatsapp, whatsappReducer, whatsappSaga };
|
|
119
114
|
|
|
120
115
|
const GalleryContainer = {Gallery, galleryReducer, gallerySagas};
|
|
121
116
|
const FTPContainer = {FTP, FTPReducer, FTPSagas};
|
|
@@ -162,5 +157,4 @@ export { CapContainer,
|
|
|
162
157
|
ViberContainer,
|
|
163
158
|
FacebookPreviewContainer,
|
|
164
159
|
SmsTraiContainer,
|
|
165
|
-
WhatsappContainer,
|
|
166
160
|
};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@capillarytech/creatives-library",
|
|
3
3
|
"author": "meharaj",
|
|
4
|
-
"version": "7.10.
|
|
4
|
+
"version": "7.10.59",
|
|
5
5
|
"description": "Capillary creatives ui",
|
|
6
6
|
"main": "./index.js",
|
|
7
7
|
"module": "./index.es.js",
|
|
@@ -12,6 +12,7 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "LicenseRef-LICENSE",
|
|
14
14
|
"dependencies": {
|
|
15
|
+
"@babel/polyfill": "7.4.3",
|
|
15
16
|
"@bugsnag/js": "^7.2.1",
|
|
16
17
|
"@bugsnag/plugin-react": "^7.2.1",
|
|
17
18
|
"@capillarytech/cap-ui-utils": "1.4.2",
|
package/routes.js
CHANGED
|
@@ -660,8 +660,6 @@ export default function createRoutes(store) {
|
|
|
660
660
|
import('v2Containers/CapFacebookPreview/reducer'),
|
|
661
661
|
import('v2Containers/SmsTrai/Create/sagas'),
|
|
662
662
|
import('v2Containers/SmsTrai/Create/reducer'),
|
|
663
|
-
import('v2Containers/Whatsapp/sagas'),
|
|
664
|
-
import('v2Containers/Whatsapp/reducer'),
|
|
665
663
|
]);
|
|
666
664
|
|
|
667
665
|
const renderRoute = loadModule(cb);
|
|
@@ -685,7 +683,6 @@ export default function createRoutes(store) {
|
|
|
685
683
|
viberSagas, viberReducer,
|
|
686
684
|
capFacebookPreviewSagas, capFacebookPreviewReducer,
|
|
687
685
|
smsTraiSagas, smsTraiReducer,
|
|
688
|
-
whatsappSagas, whatsappReducer,
|
|
689
686
|
]) => {
|
|
690
687
|
injectReducer('templates', reducer.default);
|
|
691
688
|
injectReducer('cap', capReducer.default);
|
|
@@ -705,7 +702,6 @@ export default function createRoutes(store) {
|
|
|
705
702
|
injectReducer('viber', viberReducer.default);
|
|
706
703
|
injectReducer('facebookPreview', capFacebookPreviewReducer.default);
|
|
707
704
|
injectReducer('smsTrai', smsTraiReducer.default);
|
|
708
|
-
injectReducer('whatsapp', whatsappReducer.default);
|
|
709
705
|
injectSagas(gallerySagas.default);
|
|
710
706
|
injectSagas(sagas.default);
|
|
711
707
|
injectSagas(capSagas.default);
|
|
@@ -724,7 +720,6 @@ export default function createRoutes(store) {
|
|
|
724
720
|
injectSagas(viberSagas.default);
|
|
725
721
|
injectSagas(capFacebookPreviewSagas.default);
|
|
726
722
|
injectSagas(smsTraiSagas.default);
|
|
727
|
-
injectSagas(whatsappSagas.default);
|
|
728
723
|
renderRoute(component);
|
|
729
724
|
});
|
|
730
725
|
importModules.catch(errorLoading);
|
package/services/api.js
CHANGED
|
@@ -460,9 +460,4 @@ export const createBulkSMSTemplate = ({templates}) => {
|
|
|
460
460
|
export const checkBulkDuplicates = (data) => {
|
|
461
461
|
const url = `${API_ENDPOINT}/templates/bulk/sms/checkDuplicates`;
|
|
462
462
|
return request(url, getAPICallObject('POST', data));
|
|
463
|
-
};
|
|
464
|
-
|
|
465
|
-
export const createWhatsappTemplate = ({ payload }) => {
|
|
466
|
-
const url = `${API_ENDPOINT}/templates/WHATSAPP`;
|
|
467
|
-
return request(url, getAPICallObject('POST', payload));
|
|
468
|
-
};
|
|
463
|
+
};
|
package/utils/v2common.js
CHANGED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
export const getObjFromQueryParams = (searchString) => {
|
|
2
|
-
const params = new URLSearchParams(searchString);
|
|
3
|
-
const obj = {};
|
|
4
|
-
// iterate over all keys
|
|
5
|
-
for (const key of params.keys()) {
|
|
6
|
-
if (params.getAll(key).length > 1) {
|
|
7
|
-
obj[key] = params.getAll(key);
|
|
8
|
-
} else {
|
|
9
|
-
obj[key] = params.get(key);
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
return obj;
|
|
13
|
-
}
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
}
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
-
.
|
|
18
|
+
.msgContainer {
|
|
19
19
|
position: absolute;
|
|
20
20
|
top: 20%;
|
|
21
21
|
left: 23%;
|
|
@@ -238,21 +238,6 @@
|
|
|
238
238
|
}
|
|
239
239
|
}
|
|
240
240
|
}
|
|
241
|
-
|
|
242
|
-
.whatsapp-brand-name {
|
|
243
|
-
position: absolute;
|
|
244
|
-
top: 11%;
|
|
245
|
-
left: 38%;
|
|
246
|
-
color: white;
|
|
247
|
-
font-size: small;
|
|
248
|
-
}
|
|
249
|
-
.whatsapp-message-container{
|
|
250
|
-
max-height: 292px;
|
|
251
|
-
margin-left: 28px;
|
|
252
|
-
}
|
|
253
|
-
.whatsapp-content{
|
|
254
|
-
margin: 2px 6px 1px 7px;
|
|
255
|
-
}
|
|
256
241
|
}
|
|
257
242
|
|
|
258
243
|
.align-center {
|
|
@@ -306,7 +291,7 @@
|
|
|
306
291
|
}
|
|
307
292
|
|
|
308
293
|
|
|
309
|
-
.
|
|
294
|
+
.msgContainer {
|
|
310
295
|
position: absolute;
|
|
311
296
|
top: 14%;
|
|
312
297
|
left: 29%;
|
|
@@ -414,11 +399,4 @@
|
|
|
414
399
|
span {
|
|
415
400
|
font-size: $FONT_SIZE_VS;
|
|
416
401
|
}
|
|
417
|
-
}
|
|
418
|
-
.whatsapp-brand-name{
|
|
419
|
-
position: absolute;
|
|
420
|
-
top: 11%;
|
|
421
|
-
left: 38%;
|
|
422
|
-
color: white;
|
|
423
|
-
font-size: small;
|
|
424
402
|
}
|
|
@@ -10,17 +10,13 @@ import React from 'react';
|
|
|
10
10
|
import _ from 'lodash';
|
|
11
11
|
import { injectIntl, FormattedMessage, intlShape } from 'react-intl';
|
|
12
12
|
// import styled from 'styled-components';
|
|
13
|
-
import {
|
|
13
|
+
import {CapColumn, CapRow, CapHeading, CapIcon, CapButton, CapImage} from '@capillarytech/cap-ui-library';
|
|
14
14
|
import './_templatePreview.scss';
|
|
15
15
|
import {updateCharCount} from '../../utils/smsCharCountV2';
|
|
16
16
|
import messages from './messages';
|
|
17
|
-
import {
|
|
18
|
-
WECHAT,
|
|
19
|
-
WHATSAPP,
|
|
20
|
-
} from '../../v2Containers/CreativesContainer/constants';
|
|
17
|
+
import { WECHAT } from '../../v2Containers/CreativesContainer/constants';
|
|
21
18
|
import Carousel from '../Carousel';
|
|
22
19
|
import { VIBER, FACEBOOK } from '../../v2Containers/App/constants';
|
|
23
|
-
import whatsappMobileAndroid from './assets/images/whatsapp_mobile_android.svg'
|
|
24
20
|
const wechatBodyNew = require('./assets/images/wechat_mobile_android.svg');
|
|
25
21
|
const smsMobileAndroid = require('./assets/images/sms_mobile_android.svg');
|
|
26
22
|
const lineMobileAndroid = require('../../assets/line.png');
|
|
@@ -32,20 +28,9 @@ const lineVideoPlaceholder = require('../../assets/rich-video-placeholder.svg');
|
|
|
32
28
|
const androidPushMessagePhone = require('./assets/images/androidPushMessage.svg');
|
|
33
29
|
const iPhonePushMessagePhone = require('./assets/images/iPhonePushMessage.svg');
|
|
34
30
|
|
|
35
|
-
import {
|
|
36
|
-
CAP_COLOR_03,
|
|
37
|
-
CAP_WHITE,
|
|
38
|
-
FONT_COLOR_01,
|
|
39
|
-
CAP_G06,
|
|
40
|
-
CAP_G15,
|
|
41
|
-
CAP_PURPLE01,
|
|
42
|
-
CAP_G16,
|
|
43
|
-
CAP_SPACE_08,
|
|
44
|
-
CAP_SPACE_16,
|
|
45
|
-
} from '@capillarytech/cap-ui-library/styled/variables';
|
|
31
|
+
import { CAP_COLOR_03, CAP_WHITE, FONT_COLOR_01, CAP_G08, CAP_G06, CAP_G15, CAP_PURPLE01, CAP_G16 } from '@capillarytech/cap-ui-library/styled/variables';
|
|
46
32
|
import { TEMPLATE, IMAGE_CAROUSEL, IMAGE, STICKER, TEXT, IMAGE_MAP, VIDEO } from '../../v2Containers/Line/Container/constants';
|
|
47
33
|
import CapFacebookPreview from '../../v2Containers/CapFacebookPreview';
|
|
48
|
-
import WhatsappStatusContainer from '../WhatsappStatusContainer';
|
|
49
34
|
|
|
50
35
|
class TemplatePreview extends React.Component { // eslint-disable-line react/prefer-stateless-function
|
|
51
36
|
onPreviewContentClicked = (channel) => {
|
|
@@ -147,18 +132,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
147
132
|
|
|
148
133
|
render() {
|
|
149
134
|
let content = channel && channel.toLowerCase() === 'sms' ? [this.props.content] : this.props.content;
|
|
150
|
-
const {
|
|
151
|
-
channel,
|
|
152
|
-
showTestAndPreviewIcon,
|
|
153
|
-
module,
|
|
154
|
-
viberBrandName,
|
|
155
|
-
viberAccountName,
|
|
156
|
-
whatsappAccountName,
|
|
157
|
-
whatsappContentLen = 0,
|
|
158
|
-
intl,
|
|
159
|
-
templateData,
|
|
160
|
-
} = this.props;
|
|
161
|
-
const { formatMessage } = intl;
|
|
135
|
+
const { channel, showTestAndPreviewIcon, module, viberBrandName, viberAccountName } = this.props;
|
|
162
136
|
const { buttonText, imageURL, messageContent: viberMessageContent } = content || {};
|
|
163
137
|
let smsDetails = {};
|
|
164
138
|
// let smsText = '';
|
|
@@ -213,13 +187,6 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
213
187
|
'background-color': CAP_G15,
|
|
214
188
|
'width': '81%',
|
|
215
189
|
};
|
|
216
|
-
const whatsappSectionStyle = {
|
|
217
|
-
'padding': `4px 0 ${CAP_SPACE_08}`,
|
|
218
|
-
'border-radius': '6px',
|
|
219
|
-
'background-color': CAP_G15,
|
|
220
|
-
'width': '88%',
|
|
221
|
-
'left': '10%',
|
|
222
|
-
};
|
|
223
190
|
const getVideoContent = ({
|
|
224
191
|
video,
|
|
225
192
|
actionUrl,
|
|
@@ -304,17 +271,6 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
304
271
|
{smsDetails.optoutUrlPresent && <CapHeading type="h6">
|
|
305
272
|
<FormattedMessage {...messages.optoutCharactersTotal} values={{optoutUrlLength: smsDetails.optouturlLength}} />
|
|
306
273
|
</CapHeading>}
|
|
307
|
-
{channel?.toLowerCase() === WHATSAPP.toLowerCase() ? (
|
|
308
|
-
<>
|
|
309
|
-
<WhatsappStatusContainer template={templateData} />
|
|
310
|
-
<CapHeading type="h3" className='margin-t-12'>
|
|
311
|
-
<FormattedMessage {...messages.whatsappCharactersTotal} values={{charCount: content?.templateMsg?.length}} />
|
|
312
|
-
</CapHeading>
|
|
313
|
-
<CapHeading type="h6">
|
|
314
|
-
<FormattedMessage {...messages.whatsappUnsubscribeLength} />
|
|
315
|
-
</CapHeading>
|
|
316
|
-
</>
|
|
317
|
-
) : null}
|
|
318
274
|
</CapColumn>}
|
|
319
275
|
<CapColumn span={this.props.showCount ? 8 : 24}>
|
|
320
276
|
{showTestAndPreview && (
|
|
@@ -352,7 +308,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
352
308
|
<div>
|
|
353
309
|
<div className="shell-v2 align-center" id="sms-preview">
|
|
354
310
|
<CapImage className="preview-image sms" src={smsMobileAndroid} alt="Preview is being generated"/>
|
|
355
|
-
<div className="
|
|
311
|
+
<div className="msgContainer sms">
|
|
356
312
|
<div className={"message-pop sms"}>
|
|
357
313
|
{content && content.length && content.map((msg, index) =>
|
|
358
314
|
<CapColumn key={`"message-pop-content-${index}`} className="message-pop-item align-left" style={{ background: '#FFFFFF', color: '#091e42'}}>
|
|
@@ -380,7 +336,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
380
336
|
{channel && channel.toLowerCase() === 'wechat' ?
|
|
381
337
|
( <div className="shell-v2 align-center" id="sms-preview">
|
|
382
338
|
<CapImage className="preview-image" src={(channel || '').toLowerCase() === 'wechat' ? wechatBodyNew : smsMobileAndroid} alt="Preview is being generated"/>
|
|
383
|
-
|
|
339
|
+
<div className="msgContainer wechat">
|
|
384
340
|
<div className="message-pop align-left" style={{ background: `${this.props.channel.toLowerCase() === 'wechat' ? '#ffffff' : '#3F51B5'}`, color: `${this.props.channel.toLowerCase() === 'wechat' ? '#333333' : '#ffffff'}`}}>{content}
|
|
385
341
|
</div>
|
|
386
342
|
</div>
|
|
@@ -440,7 +396,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
440
396
|
<div className="shell-v2 align-center" id="sms-preview">
|
|
441
397
|
<CapImage className="preview-image" src={lineMobileAndroid} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
|
|
442
398
|
<div
|
|
443
|
-
|
|
399
|
+
className="msgContainer line-preview"
|
|
444
400
|
style={{
|
|
445
401
|
maxHeight: 330,
|
|
446
402
|
overflow: 'scroll',
|
|
@@ -608,7 +564,7 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
608
564
|
<CapImage className="preview-image" src={viberMobileAndroid} alt={this.props.intl.formatMessage(messages.previewGenerated)}/>
|
|
609
565
|
<div style={{ position: 'absolute', top: '12%', left: '36%'}}>{viberBrandName}</div>
|
|
610
566
|
<div
|
|
611
|
-
|
|
567
|
+
className="msgContainer viber-preview"
|
|
612
568
|
style={{
|
|
613
569
|
maxHeight: 292,
|
|
614
570
|
marginLeft: 28,
|
|
@@ -682,41 +638,6 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
|
|
|
682
638
|
</div>
|
|
683
639
|
) : ''
|
|
684
640
|
}
|
|
685
|
-
{
|
|
686
|
-
channel?.toUpperCase() === WHATSAPP ? (
|
|
687
|
-
<>
|
|
688
|
-
<div className='shell-v2 align-center'>
|
|
689
|
-
<CapImage
|
|
690
|
-
className='preview-image'
|
|
691
|
-
src={whatsappMobileAndroid}
|
|
692
|
-
alt={formatMessage(messages.previewGenerated)}
|
|
693
|
-
/>
|
|
694
|
-
<CapLabel className='whatsapp-brand-name'>
|
|
695
|
-
{whatsappAccountName || ''}
|
|
696
|
-
</CapLabel>
|
|
697
|
-
<div className='msg-container whatsapp-message-container'>
|
|
698
|
-
<div className='message-pop align-left' style={whatsappSectionStyle}>
|
|
699
|
-
<CapLabel className='whatsapp-content'>
|
|
700
|
-
{content?.templateMsg || ''}
|
|
701
|
-
</CapLabel>
|
|
702
|
-
</div>
|
|
703
|
-
</div>
|
|
704
|
-
</div>
|
|
705
|
-
<CapHeading
|
|
706
|
-
type='h3'
|
|
707
|
-
style={{ textAlign: 'center' }}
|
|
708
|
-
className='margin-t-16'
|
|
709
|
-
>
|
|
710
|
-
<FormattedMessage
|
|
711
|
-
{...messages.whatsappMessageLength}
|
|
712
|
-
values={{ length: 36 + whatsappContentLen }}
|
|
713
|
-
/>
|
|
714
|
-
</CapHeading>
|
|
715
|
-
</>
|
|
716
|
-
) : (
|
|
717
|
-
''
|
|
718
|
-
)
|
|
719
|
-
}
|
|
720
641
|
{channel && channel.toLowerCase() === FACEBOOK && (
|
|
721
642
|
<div style={{position: 'absolute', left: '80%'}} id="facebook-preview">
|
|
722
643
|
<CapFacebookPreview
|
|
@@ -22,22 +22,10 @@ export default defineMessages({
|
|
|
22
22
|
id: 'creatives.componentsV2.TemplatePreview.charactersTotal',
|
|
23
23
|
defaultMessage: "{smsCount} SMS ({charCount} characters)",
|
|
24
24
|
},
|
|
25
|
-
whatsappCharactersTotal: {
|
|
26
|
-
id: 'creatives.componentsV2.TemplatePreview.whatsappCharactersTotal',
|
|
27
|
-
defaultMessage: "{charCount} characters",
|
|
28
|
-
},
|
|
29
25
|
optoutCharactersTotal: {
|
|
30
26
|
id: 'app.components.TemplatePreview.optoutCharactersTotal',
|
|
31
27
|
defaultMessage: "Includes optout tag ({optoutUrlLength} characters)",
|
|
32
28
|
},
|
|
33
|
-
whatsappUnsubscribeLength: {
|
|
34
|
-
id: 'app.components.TemplatePreview.whatsappUnsubscribeLength',
|
|
35
|
-
defaultMessage: "Includes 36 characters of (Click {{unsubscribe}} to unsubscribe)",
|
|
36
|
-
},
|
|
37
|
-
whatsappMessageLength: {
|
|
38
|
-
id: 'app.components.TemplatePreview.whatsappMessageLength',
|
|
39
|
-
defaultMessage: "1 Message ({length} characters)",
|
|
40
|
-
},
|
|
41
29
|
smsFormatType: {
|
|
42
30
|
id: 'creatives.componentsV2.TemplatePreview.smsFormatType',
|
|
43
31
|
defaultMessage: 'Message has unicode characters',
|
|
@@ -47,7 +47,6 @@ export const PREVIEW = 'preview';
|
|
|
47
47
|
|
|
48
48
|
export const VIBER = 'viber';
|
|
49
49
|
export const FACEBOOK = 'facebook';
|
|
50
|
-
export const WHATSAPP = 'whatsapp';
|
|
51
50
|
|
|
52
51
|
export const TRACK_EDIT_SMS = 'editSms';
|
|
53
52
|
export const TRACK_EDIT_EMAIL = 'editEmail';
|
|
@@ -108,6 +107,4 @@ export const FB_AD_CALL_TO_ACTION = {
|
|
|
108
107
|
export const CREATIVES = 'creatives';
|
|
109
108
|
export const LOYALTY = 'loyalty';
|
|
110
109
|
|
|
111
|
-
export const FAILURE = 'FAILURE';
|
|
112
|
-
export const DATE_DISPLAY_FORMAT = 'D MMM YYYY';
|
|
113
|
-
export const TIME_DISPLAY_FORMAT = 'hh:mm A';
|
|
110
|
+
export const FAILURE = 'FAILURE';
|
|
@@ -80,14 +80,6 @@ export default defineMessages({
|
|
|
80
80
|
id: `creatives.containersV2.promotions`,
|
|
81
81
|
defaultMessage: 'Promotions',
|
|
82
82
|
},
|
|
83
|
-
"templateNameLabel": {
|
|
84
|
-
id: `creatives.containersV2.templateNameLabel`,
|
|
85
|
-
defaultMessage: 'Template name',
|
|
86
|
-
},
|
|
87
|
-
"templateNamePlaceholder": {
|
|
88
|
-
id: `creatives.containersV2.templateNamePlaceholder`,
|
|
89
|
-
defaultMessage: 'Enter template name',
|
|
90
|
-
},
|
|
91
83
|
|
|
92
84
|
//refresh due to org change messages
|
|
93
85
|
|
|
@@ -157,9 +149,6 @@ export default defineMessages({
|
|
|
157
149
|
id: `creatives.containersV2.watchMore`,
|
|
158
150
|
defaultMessage: 'Watch More',
|
|
159
151
|
},
|
|
160
|
-
|
|
161
|
-
id: `creatives.containersV2.done`,
|
|
162
|
-
defaultMessage: 'Done',
|
|
163
|
-
},
|
|
152
|
+
|
|
164
153
|
});
|
|
165
154
|
|
|
@@ -21,8 +21,6 @@ import * as constants from './constants';
|
|
|
21
21
|
import LineContainer from '../Line/Container';
|
|
22
22
|
import FTP from '../FTP';
|
|
23
23
|
import Viber from '../Viber';
|
|
24
|
-
import Whatsapp from '../Whatsapp';
|
|
25
|
-
import { getWhatsappContent } from '../Whatsapp/utils';
|
|
26
24
|
import * as commonUtil from '../../utils/common';
|
|
27
25
|
const CreativesWrapper = styled.div`
|
|
28
26
|
.ant-popover,
|
|
@@ -145,7 +143,6 @@ function SlideBoxContent(props) {
|
|
|
145
143
|
showDisabledFBInfo,
|
|
146
144
|
orgUnitId,
|
|
147
145
|
smsRegister,
|
|
148
|
-
enableNewChannels,
|
|
149
146
|
} = props;
|
|
150
147
|
const type = (messageDetails.type || '').toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
|
|
151
148
|
const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'default' : 'library', isEditFromCampaigns: (templateData || {}).isEditFromCampaigns};
|
|
@@ -173,12 +170,11 @@ function SlideBoxContent(props) {
|
|
|
173
170
|
});
|
|
174
171
|
|
|
175
172
|
|
|
176
|
-
const
|
|
177
|
-
const
|
|
178
|
-
|
|
179
|
-
const
|
|
180
|
-
const
|
|
181
|
-
const isCreateCallTask = isCreate && channel === constants.CALL_TASK;
|
|
173
|
+
const isCreateSms = slidBoxContent === 'createTemplate' && channel === constants.SMS;
|
|
174
|
+
const isCreateFacebook = slidBoxContent === 'createTemplate' && channel === constants.FACEBOOK;
|
|
175
|
+
|
|
176
|
+
const isCreateMPush = slidBoxContent === 'createTemplate' && channel === constants.MOBILE_PUSH;
|
|
177
|
+
const isCreateCallTask = slidBoxContent === 'createTemplate' && channel === constants.CALL_TASK;
|
|
182
178
|
let isEditSms = false;
|
|
183
179
|
let isEditEmailWithId = false;
|
|
184
180
|
let isEmailEditWithContent = false;
|
|
@@ -189,8 +185,7 @@ function SlideBoxContent(props) {
|
|
|
189
185
|
let isEditMPush = false;
|
|
190
186
|
let isEditFacebook = false;
|
|
191
187
|
let isEditFTP = false;
|
|
192
|
-
|
|
193
|
-
const isEmailCreate = isCreate && channel === constants.EMAIL;
|
|
188
|
+
const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL;
|
|
194
189
|
if (templateData && channel) {
|
|
195
190
|
channel = templateData.type;// for edit mode with template data
|
|
196
191
|
isEditSms = slidBoxContent === 'editTemplate' && channel === constants.SMS;
|
|
@@ -199,8 +194,7 @@ function SlideBoxContent(props) {
|
|
|
199
194
|
isEditEmailWithId = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && templateData._id;
|
|
200
195
|
isEmailEditWithContent = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && !templateData._id;
|
|
201
196
|
isEditFacebook = slidBoxContent === 'editTemplate' && channel === constants.FACEBOOK;
|
|
202
|
-
|
|
203
|
-
isPreview = slidBoxContent === 'preview' && (channel === constants.SMS || channel === constants.LINE || channel === constants.VIBER || channel === constants.FACEBOOK || channel === constants.WHATSAPP);
|
|
197
|
+
isPreview = slidBoxContent === 'preview' && (channel === constants.SMS || channel === constants.LINE || channel === constants.VIBER || channel === constants.FACEBOOK);
|
|
204
198
|
isEmailPreview = slidBoxContent === 'preview' && channel === constants.EMAIL;
|
|
205
199
|
isMpushPreview = slidBoxContent === 'preview' && channel === constants.MOBILE_PUSH;
|
|
206
200
|
isEditFTP = slidBoxContent === 'editTemplate' && [constants.NO_COMMUNICATION, constants.FTP].includes(channel);
|
|
@@ -327,11 +321,6 @@ function SlideBoxContent(props) {
|
|
|
327
321
|
};
|
|
328
322
|
return fbContent;
|
|
329
323
|
}
|
|
330
|
-
case constants.WHATSAPP: {
|
|
331
|
-
return {
|
|
332
|
-
templateMsg: getWhatsappContent(templateDataObject),
|
|
333
|
-
};
|
|
334
|
-
}
|
|
335
324
|
default:
|
|
336
325
|
return get(templateDataObject, `versions.base.content`);
|
|
337
326
|
}
|
|
@@ -366,7 +355,6 @@ function SlideBoxContent(props) {
|
|
|
366
355
|
showDisabledFBInfo={showDisabledFBInfo}
|
|
367
356
|
orgUnitId={orgUnitId}
|
|
368
357
|
smsRegister={smsRegister}
|
|
369
|
-
enableNewChannels={enableNewChannels}
|
|
370
358
|
/>
|
|
371
359
|
)}
|
|
372
360
|
{isPreview && (
|
|
@@ -374,7 +362,6 @@ function SlideBoxContent(props) {
|
|
|
374
362
|
content={getChannelPreviewContent(templateData)}
|
|
375
363
|
viberBrandName={selectedAccount || ""}
|
|
376
364
|
viberAccountName={(selectedAccount || "")[0]}
|
|
377
|
-
whatsappAccountName={selectedAccount}
|
|
378
365
|
unicodeEnabled={get(templateData, `versions.base['unicode-validity']`)}
|
|
379
366
|
channel={(templateData.type || '').toLowerCase()}
|
|
380
367
|
charCounterEnabled={channel === constants.SMS}
|
|
@@ -691,28 +678,6 @@ function SlideBoxContent(props) {
|
|
|
691
678
|
templateData={templateData}
|
|
692
679
|
createNew/> }
|
|
693
680
|
|
|
694
|
-
{isCreateWhatsapp && (<Whatsapp
|
|
695
|
-
isFullMode={isFullMode}
|
|
696
|
-
onCreateComplete={onCreateComplete}
|
|
697
|
-
handleClose={handleClose}/>
|
|
698
|
-
)}
|
|
699
|
-
|
|
700
|
-
{isEditWhatsapp && (<Whatsapp
|
|
701
|
-
isFullMode={isFullMode}
|
|
702
|
-
templateData={templateData}
|
|
703
|
-
getFormData={getFormData}
|
|
704
|
-
getDefaultTags={type}
|
|
705
|
-
forwardedTags={forwardedTags}
|
|
706
|
-
params={{
|
|
707
|
-
id: templateData._id,
|
|
708
|
-
}}
|
|
709
|
-
location={{
|
|
710
|
-
pathname: `/whatsapp/edit`,
|
|
711
|
-
query,
|
|
712
|
-
search: '',
|
|
713
|
-
}}/>
|
|
714
|
-
)}
|
|
715
|
-
|
|
716
681
|
</CreativesWrapper>
|
|
717
682
|
);
|
|
718
683
|
}
|
|
@@ -1,63 +1,35 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import styled from 'styled-components';
|
|
3
3
|
import { FormattedMessage } from 'react-intl';
|
|
4
|
-
import get from 'lodash/get';
|
|
5
4
|
import { CapHeader, CapIcons, CapLabel, CapSteps } from '@capillarytech/cap-ui-library';
|
|
6
5
|
import moment from 'moment';
|
|
7
6
|
import PropTypes from 'prop-types';
|
|
8
7
|
import messages from './messages';
|
|
9
|
-
import whatsppMsg from '../Whatsapp/messages';
|
|
10
|
-
import globalMessages from '../Cap/messages'
|
|
11
8
|
import { MAP_TEMPLATE } from '../WeChat/Wrapper/constants';
|
|
12
|
-
import { NO_COMMUNICATION, FTP
|
|
9
|
+
import { NO_COMMUNICATION, FTP } from '../App/constants';
|
|
13
10
|
import { isTraiDLTEnable } from '../../utils/common';
|
|
14
|
-
import { formatString } from '../../utils/Formatter';
|
|
15
|
-
import {
|
|
16
|
-
CAP_SPACE_12,
|
|
17
|
-
} from '@capillarytech/cap-ui-library/styled/variables';
|
|
18
|
-
const { CapLabelInline } = CapLabel;
|
|
19
|
-
const StyledLabel = styled(CapLabelInline)`
|
|
20
|
-
margin-right: ${CAP_SPACE_12};
|
|
21
|
-
`;
|
|
22
11
|
const PrefixWrapper = styled.div`
|
|
23
12
|
margin-right: 16px;
|
|
24
13
|
`;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
14
|
+
function getChannelLabel(channel = '') {
|
|
15
|
+
const labels = {
|
|
16
|
+
sms: 'SMS',
|
|
17
|
+
email: 'Email',
|
|
18
|
+
mobilepush: 'Push notification',
|
|
19
|
+
wechat: 'Wechat',
|
|
20
|
+
no_communication: 'NO_COMMUNICATION',
|
|
21
|
+
ftp: 'FTP',
|
|
22
|
+
};
|
|
23
|
+
return labels[channel.toLowerCase()];
|
|
24
|
+
}
|
|
31
25
|
|
|
32
26
|
|
|
27
|
+
function SlideBoxHeader(props) {
|
|
33
28
|
const { slidBoxContent, templateData, onShowTemplates, creativesMode, isFullMode, showPrefix, shouldShowTemplateName, channel, templateNameRenderProp, weChatTemplateType, onWeChatMaptemplateStepChange, weChatMaptemplateStep, templateStep, smsRegister } = props;
|
|
34
29
|
const showTemplateNameHeader = isFullMode && shouldShowTemplateName;
|
|
35
30
|
const mapTemplateCreate = !showTemplateNameHeader && slidBoxContent === 'createTemplate' && weChatTemplateType === MAP_TEMPLATE && templateStep !== 'modeSelection';
|
|
36
31
|
const isTraiDlt = isTraiDLTEnable(isFullMode, smsRegister);
|
|
37
32
|
const showCreateTraiSMSHeader = isTraiDlt && channel.toLowerCase() === "sms";
|
|
38
|
-
const isWhatsappEdit = channel.toLowerCase() === WHATSAPP && slidBoxContent === 'editTemplate';
|
|
39
|
-
const whatsappOverview = isWhatsappEdit && isFullMode;
|
|
40
|
-
const headerMessage = whatsappOverview ? messages.whatsappOverview : messages.editMessageContent;
|
|
41
|
-
const {
|
|
42
|
-
whatsappTemplateName,
|
|
43
|
-
whatsappTemplateCategory,
|
|
44
|
-
} = templateData || {};
|
|
45
|
-
const whatsappName = whatsappTemplateName || templateData?.name;
|
|
46
|
-
const whatsappCategory = whatsappTemplateCategory || get(templateData, `versions.base.content.whatsapp.category`, '');
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
const getChannelLabel = (currentChannel = '') => {
|
|
50
|
-
const labels = {
|
|
51
|
-
sms: 'SMS',
|
|
52
|
-
email: 'Email',
|
|
53
|
-
mobilepush: 'Push notification',
|
|
54
|
-
wechat: 'Wechat',
|
|
55
|
-
no_communication: 'NO_COMMUNICATION',
|
|
56
|
-
ftp: 'FTP',
|
|
57
|
-
whatsapp: <FormattedMessage {...messages.whatsappTemplate} />,
|
|
58
|
-
};
|
|
59
|
-
return labels[currentChannel.toLowerCase()];
|
|
60
|
-
};
|
|
61
33
|
|
|
62
34
|
return (
|
|
63
35
|
<div key="creatives-container-slidebox-header-content">
|
|
@@ -85,20 +57,7 @@ function SlideBoxHeader(props) {
|
|
|
85
57
|
)}
|
|
86
58
|
{!showTemplateNameHeader && slidBoxContent === 'editTemplate' && (
|
|
87
59
|
<CapHeader
|
|
88
|
-
title={<FormattedMessage {...
|
|
89
|
-
description={
|
|
90
|
-
isWhatsappEdit && (
|
|
91
|
-
<>
|
|
92
|
-
{renderWhatsappData("label1", <FormattedMessage {...globalMessages.templateNameLabel} />)}
|
|
93
|
-
{renderWhatsappData("label2", whatsappName)}
|
|
94
|
-
{renderWhatsappData("label3", <FormattedMessage {...whatsppMsg.labelSeperator} />)}
|
|
95
|
-
{renderWhatsappData("label1", <FormattedMessage {...whatsppMsg.templateCategoryLabel} />)}
|
|
96
|
-
{renderWhatsappData("label2", formatString(whatsappCategory))}
|
|
97
|
-
{renderWhatsappData("label3", <FormattedMessage {...whatsppMsg.labelSeperator} />)}
|
|
98
|
-
{renderWhatsappData("label1", <FormattedMessage {...whatsppMsg.languageLabel} />)}
|
|
99
|
-
{renderWhatsappData("label2", <FormattedMessage {...whatsppMsg.templateLanguageEnglish} />)}
|
|
100
|
-
</>)
|
|
101
|
-
}
|
|
60
|
+
title={<FormattedMessage {...messages.editMessageContent} values={{channel: getChannelLabel(channel)}}/>}
|
|
102
61
|
prefix={creativesMode !== 'edit' && !isFullMode && showPrefix &&
|
|
103
62
|
<PrefixWrapper>
|
|
104
63
|
<CapIcons.backIcon onClick={onShowTemplates} />
|
|
@@ -16,7 +16,6 @@ export const FACEBOOK = "FACEBOOK";
|
|
|
16
16
|
export const FTP = "FTP";
|
|
17
17
|
export const NO_COMMUNICATION = "NO_COMMUNICATION";
|
|
18
18
|
export const VIBER = "VIBER";
|
|
19
|
-
export const WHATSAPP = "WHATSAPP";
|
|
20
19
|
|
|
21
20
|
export const SHOW_CONTANER_LOADER = "app/CreativesContainer/SHOW_CONTANER_LOADER";
|
|
22
21
|
export const HIDE_CONTAINER_LOADER = "app/CreativesContainer/HIDE_CONTAINER_LOADER";
|