@capillarytech/creatives-library 6.13.9 → 6.14.1
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/app.js +2 -5
- package/config/app.js +2 -0
- package/containers/Templates/index.js +3 -0
- package/index.js +8 -8
- package/package.json +2 -2
- package/reducers.js +2 -3
- package/routes.js +1 -7
- package/services/api.js +7 -5
- package/utils/common.js +118 -0
- package/v2Components/FormBuilder/index.js +2 -4
- package/v2Components/TemplatePreview/_templatePreview.scss +2 -8
- package/v2Components/TemplatePreview/index.js +18 -104
- package/v2Containers/App/constants.js +2 -2
- package/v2Containers/CreativesContainer/SlideBoxContent.js +19 -66
- package/v2Containers/CreativesContainer/SlideBoxHeader.js +2 -0
- package/v2Containers/CreativesContainer/constants.js +2 -2
- package/v2Containers/CreativesContainer/index.js +12 -38
- package/v2Containers/FTP/_FTP.scss +92 -0
- package/v2Containers/FTP/actions.js +7 -0
- package/v2Containers/FTP/constants.js +3 -0
- package/v2Containers/FTP/index.js +517 -0
- package/v2Containers/FTP/messages.js +60 -0
- package/v2Containers/FTP/reducer.js +32 -0
- package/v2Containers/FTP/sagas.js +26 -0
- package/v2Containers/FTP/selectors.js +20 -0
- package/v2Containers/Templates/_templates.scss +0 -57
- package/v2Containers/Templates/actions.js +110 -117
- package/v2Containers/Templates/constants.js +0 -2
- package/v2Containers/Templates/index.js +6 -86
- package/v2Containers/Templates/messages.js +0 -4
- package/v2Containers/Templates/reducer.js +0 -2
- package/v2Containers/TemplatesV2/index.js +14 -9
- package/v2Containers/TemplatesV2/messages.js +4 -4
- package/v2Containers/WeChat/MapTemplates/index.js +1 -1
- package/assets/viber.png +0 -0
- package/utils/ignoredErrorMessages.js +0 -4
- package/v2Containers/Viber/_viber.scss +0 -3
- package/v2Containers/Viber/actions.js +0 -74
- package/v2Containers/Viber/constants.js +0 -30
- package/v2Containers/Viber/index.js +0 -707
- package/v2Containers/Viber/messages.js +0 -137
- package/v2Containers/Viber/reducer.js +0 -84
- package/v2Containers/Viber/sagas.js +0 -107
- package/v2Containers/Viber/selectors.js +0 -21
|
@@ -2,7 +2,6 @@ import React from 'react';
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
import get from 'lodash/get';
|
|
5
|
-
import cloneDeep from 'lodash/cloneDeep';
|
|
6
5
|
import TemplatesV2 from '../TemplatesV2';
|
|
7
6
|
import TemplatePreview from '../../v2Components/TemplatePreview';
|
|
8
7
|
import SmsCreate from '../Sms/Create';
|
|
@@ -19,7 +18,7 @@ import CallTask from '../CallTask';
|
|
|
19
18
|
import MobliPushEdit from '../MobilePush/Edit';
|
|
20
19
|
import * as constants from './constants';
|
|
21
20
|
import LineContainer from '../Line/Container';
|
|
22
|
-
import
|
|
21
|
+
import FTP from '../FTP';
|
|
23
22
|
const CreativesWrapper = styled.div`
|
|
24
23
|
.ant-popover,
|
|
25
24
|
.ant-notification,
|
|
@@ -34,6 +33,7 @@ function getWechatTemplateType(mode, templateData, weChatTemplateType = '') {
|
|
|
34
33
|
}
|
|
35
34
|
return weChatTemplateType;
|
|
36
35
|
}
|
|
36
|
+
|
|
37
37
|
const getLineType = ({
|
|
38
38
|
slidBoxContent,
|
|
39
39
|
channel,
|
|
@@ -71,22 +71,6 @@ const getLineType = ({
|
|
|
71
71
|
}
|
|
72
72
|
return {};
|
|
73
73
|
};
|
|
74
|
-
const getViber = ({
|
|
75
|
-
slidBoxContent,
|
|
76
|
-
channel,
|
|
77
|
-
isFullMode,
|
|
78
|
-
templateData,
|
|
79
|
-
}) => {
|
|
80
|
-
if ((channel === constants.VIBER || (slidBoxContent === 'editTemplate' && templateData && templateData.type === constants.VIBER)) && slidBoxContent !== 'templates') {
|
|
81
|
-
const isCreate = slidBoxContent === 'createTemplate';
|
|
82
|
-
const isEdit = slidBoxContent === 'editTemplate';
|
|
83
|
-
return {
|
|
84
|
-
isCreate,
|
|
85
|
-
isEdit,
|
|
86
|
-
};
|
|
87
|
-
}
|
|
88
|
-
return {};
|
|
89
|
-
};
|
|
90
74
|
|
|
91
75
|
function SlideBoxContent(props) {
|
|
92
76
|
const {
|
|
@@ -134,6 +118,7 @@ function SlideBoxContent(props) {
|
|
|
134
118
|
selectedAccount,
|
|
135
119
|
onShowTemplates,
|
|
136
120
|
handleClose,
|
|
121
|
+
onFTPSubmit,
|
|
137
122
|
} = props;
|
|
138
123
|
const type = (messageDetails.type || '').toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
|
|
139
124
|
const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'default' : 'library', isEditFromCampaigns: (templateData || {}).isEditFromCampaigns};
|
|
@@ -152,15 +137,6 @@ function SlideBoxContent(props) {
|
|
|
152
137
|
isFullMode,
|
|
153
138
|
templateData,
|
|
154
139
|
});
|
|
155
|
-
const {isCreate: isCreateViber = false,
|
|
156
|
-
isEdit: isEditViber = false } = getViber({
|
|
157
|
-
slidBoxContent,
|
|
158
|
-
channel,
|
|
159
|
-
isFullMode,
|
|
160
|
-
templateData,
|
|
161
|
-
});
|
|
162
|
-
|
|
163
|
-
|
|
164
140
|
const isCreateSms = slidBoxContent === 'createTemplate' && channel === constants.SMS;
|
|
165
141
|
const isCreateMPush = slidBoxContent === 'createTemplate' && channel === constants.MOBILE_PUSH;
|
|
166
142
|
const isCreateCallTask = slidBoxContent === 'createTemplate' && channel === constants.CALL_TASK;
|
|
@@ -173,6 +149,7 @@ function SlideBoxContent(props) {
|
|
|
173
149
|
let isEditCallTask = false;
|
|
174
150
|
let isEditMPush = false;
|
|
175
151
|
let isEditFacebook = false;
|
|
152
|
+
let isEditFTP = false;
|
|
176
153
|
const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL;
|
|
177
154
|
if (templateData && channel) {
|
|
178
155
|
channel = templateData.type;// for edit mode with template data
|
|
@@ -182,9 +159,10 @@ function SlideBoxContent(props) {
|
|
|
182
159
|
isEditEmailWithId = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && templateData._id;
|
|
183
160
|
isEmailEditWithContent = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && !templateData._id;
|
|
184
161
|
isEditFacebook = slidBoxContent === 'editTemplate' && channel === constants.FACEBOOK;
|
|
185
|
-
isPreview = slidBoxContent === 'preview' && (channel === constants.SMS || channel === constants.LINE
|
|
162
|
+
isPreview = slidBoxContent === 'preview' && (channel === constants.SMS || channel === constants.LINE);
|
|
186
163
|
isEmailPreview = slidBoxContent === 'preview' && channel === constants.EMAIL;
|
|
187
164
|
isMpushPreview = slidBoxContent === 'preview' && channel === constants.MOBILE_PUSH;
|
|
165
|
+
isEditFTP = slidBoxContent === 'editTemplate' && [constants.NO_COMMUNICATION, constants.FTP].includes(channel);
|
|
188
166
|
}
|
|
189
167
|
|
|
190
168
|
const getChannelPreviewContent = (templateDataObject) => {
|
|
@@ -249,21 +227,10 @@ function SlideBoxContent(props) {
|
|
|
249
227
|
return previewContent;
|
|
250
228
|
});
|
|
251
229
|
}
|
|
252
|
-
case constants.VIBER: {
|
|
253
|
-
const template = cloneDeep(templateDataObject);
|
|
254
|
-
const { text = "", imageURL = "", buttonText = "" } = get(template, 'versions.base.content.viber', {});
|
|
255
|
-
template.content = {
|
|
256
|
-
messageContent: text,
|
|
257
|
-
imageURL,
|
|
258
|
-
buttonText,
|
|
259
|
-
};
|
|
260
|
-
return template.content;
|
|
261
|
-
}
|
|
262
230
|
default:
|
|
263
231
|
return get(templateDataObject, `versions.base.content`);
|
|
264
232
|
}
|
|
265
233
|
};
|
|
266
|
-
|
|
267
234
|
return (
|
|
268
235
|
<CreativesWrapper>
|
|
269
236
|
{!isFullMode && slidBoxContent === 'templates' && (
|
|
@@ -286,6 +253,10 @@ function SlideBoxContent(props) {
|
|
|
286
253
|
onCreateComplete={onCreateComplete}
|
|
287
254
|
getFormSubscriptionData={getFormData}
|
|
288
255
|
handleClose={handleClose}
|
|
256
|
+
onFTPSubmit={onFTPSubmit}
|
|
257
|
+
slidBoxContent={slidBoxContent}
|
|
258
|
+
FTPMode="create"
|
|
259
|
+
selectedOfferDetails={selectedOfferDetails}
|
|
289
260
|
/>
|
|
290
261
|
)}
|
|
291
262
|
{isPreview && (
|
|
@@ -352,6 +323,14 @@ function SlideBoxContent(props) {
|
|
|
352
323
|
onTestContentClicked={onTestContentClicked}
|
|
353
324
|
/>
|
|
354
325
|
)}
|
|
326
|
+
{isEditFTP && (
|
|
327
|
+
<FTP
|
|
328
|
+
mode="edit"
|
|
329
|
+
onFTPSubmit={onFTPSubmit}
|
|
330
|
+
messageDetails={messageDetails}
|
|
331
|
+
selectedOfferDetails={selectedOfferDetails}
|
|
332
|
+
/>
|
|
333
|
+
)}
|
|
355
334
|
{
|
|
356
335
|
isEditCallTask &&
|
|
357
336
|
<CallTask
|
|
@@ -536,33 +515,6 @@ function SlideBoxContent(props) {
|
|
|
536
515
|
/>
|
|
537
516
|
)
|
|
538
517
|
}
|
|
539
|
-
{isCreateViber && (
|
|
540
|
-
<Viber
|
|
541
|
-
location={creativesLocationProps}
|
|
542
|
-
onCreateComplete={onCreateComplete}
|
|
543
|
-
isFullMode={isFullMode}
|
|
544
|
-
handleClose={handleClose}
|
|
545
|
-
isGetFormData={isGetFormData}
|
|
546
|
-
getFormSubscriptionData={getFormData}
|
|
547
|
-
onShowTemplates={onShowTemplates}
|
|
548
|
-
templateData={templateData}
|
|
549
|
-
createNew/>
|
|
550
|
-
)}
|
|
551
|
-
|
|
552
|
-
{isEditViber && <Viber
|
|
553
|
-
location={creativesLocationProps}
|
|
554
|
-
params={{
|
|
555
|
-
id: templateData._id,
|
|
556
|
-
}}
|
|
557
|
-
onCreateComplete={onCreateComplete}
|
|
558
|
-
isFullMode={isFullMode}
|
|
559
|
-
handleClose={handleClose}
|
|
560
|
-
isGetFormData={isGetFormData}
|
|
561
|
-
getFormSubscriptionData={getFormData}
|
|
562
|
-
onShowTemplates={onShowTemplates}
|
|
563
|
-
templateData={templateData}
|
|
564
|
-
createNew/> }
|
|
565
|
-
|
|
566
518
|
</CreativesWrapper>
|
|
567
519
|
);
|
|
568
520
|
}
|
|
@@ -606,5 +558,6 @@ SlideBoxContent.propTypes = {
|
|
|
606
558
|
onCreateComplete: PropTypes.func,
|
|
607
559
|
saveMessage: PropTypes.func,
|
|
608
560
|
selectedAccount: PropTypes.object,
|
|
561
|
+
onFTPSubmit: PropTypes.func,
|
|
609
562
|
};
|
|
610
563
|
export default SlideBoxContent;
|
|
@@ -13,7 +13,7 @@ export const CALL_TASK = "CALL_TASK";
|
|
|
13
13
|
export const MOBILE_PUSH = "MOBILEPUSH";
|
|
14
14
|
export const WECHAT = "WECHAT";
|
|
15
15
|
export const FACEBOOK = "FACEBOOK";
|
|
16
|
-
export const
|
|
17
|
-
|
|
16
|
+
export const FTP = "FTP";
|
|
17
|
+
export const NO_COMMUNICATION = "NO_COMMUNICATION";
|
|
18
18
|
export const SHOW_CONTANER_LOADER = "app/CreativesContainer/SHOW_CONTANER_LOADER";
|
|
19
19
|
export const HIDE_CONTAINER_LOADER = "app/CreativesContainer/HIDE_CONTAINER_LOADER";
|
|
@@ -5,7 +5,7 @@ import {
|
|
|
5
5
|
} from '@capillarytech/cap-ui-library';
|
|
6
6
|
import { injectIntl, FormattedMessage } from 'react-intl';
|
|
7
7
|
import classnames from 'classnames';
|
|
8
|
-
import {isEmpty, get, forEach
|
|
8
|
+
import {isEmpty, get, forEach} from 'lodash';
|
|
9
9
|
import { connect } from 'react-redux';
|
|
10
10
|
import { createStructuredSelector } from 'reselect';
|
|
11
11
|
import { bindActionCreators } from 'redux';
|
|
@@ -18,6 +18,7 @@ import SlideBoxHeader from './SlideBoxHeader';
|
|
|
18
18
|
import SlideBoxFooter from './SlideBoxFooter';
|
|
19
19
|
import * as constants from './constants';
|
|
20
20
|
import * as commonUtil from '../../utils/common';
|
|
21
|
+
|
|
21
22
|
import './index.scss';
|
|
22
23
|
import * as templateActions from '../Templates/actions';
|
|
23
24
|
import * as globalActions from '../Cap/actions';
|
|
@@ -142,6 +143,13 @@ class Creatives extends React.Component {
|
|
|
142
143
|
const {channel} = templateData;
|
|
143
144
|
let creativesTemplateData = {type: channel };
|
|
144
145
|
switch (channel) {
|
|
146
|
+
case constants.NO_COMMUNICATION: {
|
|
147
|
+
creativesTemplateData = {
|
|
148
|
+
type: channel,
|
|
149
|
+
...templateData,
|
|
150
|
+
};
|
|
151
|
+
break;
|
|
152
|
+
}
|
|
145
153
|
case constants.SMS: {
|
|
146
154
|
const formData = {
|
|
147
155
|
"sms-editor": templateData.messageBody,
|
|
@@ -246,24 +254,6 @@ class Creatives extends React.Component {
|
|
|
246
254
|
};
|
|
247
255
|
break;
|
|
248
256
|
}
|
|
249
|
-
case constants.VIBER: {
|
|
250
|
-
const { messageBody, isDefault } = templateData;
|
|
251
|
-
const viber = JSON.parse(messageBody || '{}');
|
|
252
|
-
creativesTemplateData = {
|
|
253
|
-
type: constants.VIBER,
|
|
254
|
-
isDefault,
|
|
255
|
-
edit: true,
|
|
256
|
-
name: "",
|
|
257
|
-
versions: {
|
|
258
|
-
base: {
|
|
259
|
-
content: {
|
|
260
|
-
...viber,
|
|
261
|
-
},
|
|
262
|
-
},
|
|
263
|
-
},
|
|
264
|
-
};
|
|
265
|
-
break;
|
|
266
|
-
}
|
|
267
257
|
default:
|
|
268
258
|
break;
|
|
269
259
|
}
|
|
@@ -349,23 +339,6 @@ class Creatives extends React.Component {
|
|
|
349
339
|
};
|
|
350
340
|
}
|
|
351
341
|
break;
|
|
352
|
-
case constants.VIBER:
|
|
353
|
-
if (template.value) {
|
|
354
|
-
const { Templates = {} } = this.props || {};
|
|
355
|
-
const selectedViberAccount = Templates && Templates.selectedViberAccount;
|
|
356
|
-
const accountDetails = selectedViberAccount || '';
|
|
357
|
-
const accountId = selectedViberAccount ? selectedViberAccount.id : '';
|
|
358
|
-
const { versions } = template.value;
|
|
359
|
-
const content = cloneDeep(versions.base.content);
|
|
360
|
-
content.scenarioKey = get(accountDetails, 'configs.scenario_key');
|
|
361
|
-
templateData = {
|
|
362
|
-
channel,
|
|
363
|
-
accountId,
|
|
364
|
-
accountDetails,
|
|
365
|
-
messageBody: JSON.stringify(content),
|
|
366
|
-
};
|
|
367
|
-
}
|
|
368
|
-
break;
|
|
369
342
|
default:
|
|
370
343
|
break;
|
|
371
344
|
}
|
|
@@ -480,8 +453,8 @@ class Creatives extends React.Component {
|
|
|
480
453
|
}
|
|
481
454
|
}
|
|
482
455
|
|
|
483
|
-
const
|
|
484
|
-
if (
|
|
456
|
+
const isLineChannel = templateData && templateData.type === constants.LINE;
|
|
457
|
+
if (channel === constants.LINE || isLineChannel) {
|
|
485
458
|
showFooter = false;
|
|
486
459
|
}
|
|
487
460
|
|
|
@@ -640,6 +613,7 @@ class Creatives extends React.Component {
|
|
|
640
613
|
selectedAccount={this.props.selectedAccount}
|
|
641
614
|
onShowTemplates={this.onShowTemplates}
|
|
642
615
|
handleClose={this.handleCloseSlideBox}
|
|
616
|
+
onFTPSubmit={getCreativesData}
|
|
643
617
|
editor={editor}
|
|
644
618
|
/>
|
|
645
619
|
}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
@import '~@capillarytech/cap-ui-library/styles/_variables.scss';
|
|
2
|
+
|
|
3
|
+
.selected-server-name{
|
|
4
|
+
margin-top: $CAP_SPACE_16;
|
|
5
|
+
.server-avtar, .server-name, .server-change{
|
|
6
|
+
display: inline-block;
|
|
7
|
+
}
|
|
8
|
+
.server-change{
|
|
9
|
+
margin-left: $CAP_SPACE_24;
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
.select-server{
|
|
13
|
+
display: inline-block;
|
|
14
|
+
}
|
|
15
|
+
.configure-csv-container{
|
|
16
|
+
margin-top: $CAP_SPACE_32;
|
|
17
|
+
.configure-csv, .add-column{
|
|
18
|
+
display: inline-block;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
.column-selection-container{
|
|
22
|
+
width: 200px;
|
|
23
|
+
display: inline-block;
|
|
24
|
+
margin: $CAP_SPACE_04;
|
|
25
|
+
}
|
|
26
|
+
.column-selection-container-cid{
|
|
27
|
+
width: 120px;
|
|
28
|
+
display: inline-block;
|
|
29
|
+
}
|
|
30
|
+
.select-csv-column{
|
|
31
|
+
width: 80%;
|
|
32
|
+
border: 1px solid #d9d9d9 !important;
|
|
33
|
+
border-radius: 4px !important;
|
|
34
|
+
display: inline-block;
|
|
35
|
+
}
|
|
36
|
+
.select-csv-col-dropdown ul{
|
|
37
|
+
padding: 0 $CAP_SPACE_04;
|
|
38
|
+
}
|
|
39
|
+
.select-csv-col-dropdown ul li{
|
|
40
|
+
margin: $CAP_SPACE_08 0 !important;
|
|
41
|
+
padding: 0;
|
|
42
|
+
white-space: nowrap;
|
|
43
|
+
list-style: none;
|
|
44
|
+
outline: 0;
|
|
45
|
+
}
|
|
46
|
+
.select-csv-col-dropdown {
|
|
47
|
+
.ant-select-tree-switcher-noop, .ant-select-tree-node-content-wrapper{
|
|
48
|
+
display: inline-block !important;
|
|
49
|
+
margin: 0 !important;
|
|
50
|
+
}
|
|
51
|
+
.ant-select-tree-child-tree-open {
|
|
52
|
+
display: block !important;
|
|
53
|
+
padding: 0 0 0 $CAP_SPACE_16 !important;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
.remove-csv-column{
|
|
57
|
+
display: inline-block;
|
|
58
|
+
margin-left: $CAP_SPACE_08;
|
|
59
|
+
}
|
|
60
|
+
.scrollable-section{
|
|
61
|
+
height: calc(100vh - 220px);
|
|
62
|
+
overflow-y: auto;
|
|
63
|
+
}
|
|
64
|
+
.FTP-tagList {
|
|
65
|
+
position: absolute;
|
|
66
|
+
right: 0;
|
|
67
|
+
top: -10px;
|
|
68
|
+
}
|
|
69
|
+
.ftp-message-container{
|
|
70
|
+
margin-top: $CAP_SPACE_32;
|
|
71
|
+
.message-content-title{
|
|
72
|
+
margin-top: $CAP_SPACE_24;
|
|
73
|
+
position: relative;
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.ftp-preview-container{
|
|
78
|
+
.ftp-preview-message-title{
|
|
79
|
+
margin-top: $CAP_SPACE_16;
|
|
80
|
+
}
|
|
81
|
+
.ftp-preview-message-content{
|
|
82
|
+
max-width: 450px;
|
|
83
|
+
margin-top: 4px;
|
|
84
|
+
color: $FONT_COLOR_02;
|
|
85
|
+
}
|
|
86
|
+
.ftp-preview-data-title{
|
|
87
|
+
margin-top: $CAP_SPACE_40;
|
|
88
|
+
}
|
|
89
|
+
.ftp-preview-data-col-container{
|
|
90
|
+
margin-top: $CAP_SPACE_16;
|
|
91
|
+
}
|
|
92
|
+
}
|