@capillarytech/creatives-library 8.0.108-alpha.0 → 8.0.108
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/package.json
CHANGED
|
@@ -20,7 +20,7 @@ import globalMessages from '../../v2Containers/Cap/messages';
|
|
|
20
20
|
import whatsappMsg from '../../v2Containers/Whatsapp/messages';
|
|
21
21
|
import messages from './messages';
|
|
22
22
|
import './index.scss';
|
|
23
|
-
import { isUrl,
|
|
23
|
+
import { isUrl,isValidText } from '../../v2Containers/Line/Container/Wrapper/utils';
|
|
24
24
|
import TagList from '../../v2Containers/TagList';
|
|
25
25
|
import {
|
|
26
26
|
CTA_OPTIONS,
|
|
@@ -50,7 +50,6 @@ export const CapWhatsappCTA = (props) => {
|
|
|
50
50
|
tags = [],
|
|
51
51
|
injectedTags = {},
|
|
52
52
|
selectedOfferDetails = [],
|
|
53
|
-
eventContextTags = [],
|
|
54
53
|
} = props;
|
|
55
54
|
const { formatMessage } = intl;
|
|
56
55
|
const invalidVarRegex = /{{(.*?)}}/g;
|
|
@@ -135,7 +134,8 @@ export const CapWhatsappCTA = (props) => {
|
|
|
135
134
|
clonedCta.push(cloneDeep(INITIAL_CTA_DATA[0]));
|
|
136
135
|
if (clonedCta.length === 2) {
|
|
137
136
|
clonedCta[1].index = 1;
|
|
138
|
-
clonedCta[1].ctaType =
|
|
137
|
+
clonedCta[1].ctaType =
|
|
138
|
+
clonedCta[0].ctaType === PHONE_NUMBER ? WEBSITE : PHONE_NUMBER;
|
|
139
139
|
}
|
|
140
140
|
updateHandler(clonedCta, null, true);
|
|
141
141
|
};
|
|
@@ -168,8 +168,8 @@ export const CapWhatsappCTA = (props) => {
|
|
|
168
168
|
if (!isUrl(value)) {
|
|
169
169
|
errorMessage = formatMessage(messages.ctaWebsiteUrlErrorMessage);
|
|
170
170
|
} else if (
|
|
171
|
-
urlType === STATIC_URL
|
|
172
|
-
|
|
171
|
+
urlType === STATIC_URL &&
|
|
172
|
+
value.match(invalidVarRegex)?.length > 0
|
|
173
173
|
) {
|
|
174
174
|
errorMessage = formatMessage(messages.staticUrlWithVarErrorMessage);
|
|
175
175
|
}
|
|
@@ -178,14 +178,12 @@ export const CapWhatsappCTA = (props) => {
|
|
|
178
178
|
};
|
|
179
179
|
|
|
180
180
|
const ctaSaveDisabled = (index) => {
|
|
181
|
-
const {
|
|
182
|
-
ctaType, text, phone_number, url,
|
|
183
|
-
} = ctaData[index] || {};
|
|
181
|
+
const { ctaType, text, phone_number, url } = ctaData[index] || {};
|
|
184
182
|
if (text === '' || buttonError) {
|
|
185
183
|
return true;
|
|
186
|
-
} if (ctaType === PHONE_NUMBER && phone_number.length < 5) {
|
|
184
|
+
} else if (ctaType === PHONE_NUMBER && phone_number.length < 5) {
|
|
187
185
|
return true;
|
|
188
|
-
} if (ctaType === WEBSITE && (url === '' || urlError)) {
|
|
186
|
+
} else if (ctaType === WEBSITE && (url === '' || urlError)) {
|
|
189
187
|
return true;
|
|
190
188
|
}
|
|
191
189
|
return false;
|
|
@@ -202,9 +200,8 @@ export const CapWhatsappCTA = (props) => {
|
|
|
202
200
|
const renderArray = [];
|
|
203
201
|
const addBtnDisabled = ctaData.length === 1 && !ctaData[0].isSaved;
|
|
204
202
|
ctaData.forEach((cta) => {
|
|
205
|
-
const {
|
|
206
|
-
|
|
207
|
-
} = cta || {};
|
|
203
|
+
const { index, ctaType, text, phone_number, urlType, url, isSaved } =
|
|
204
|
+
cta || {};
|
|
208
205
|
//this is to display buttons after they are saved, in both create and edit mode.
|
|
209
206
|
if (isSaved) {
|
|
210
207
|
const ctaIsPhone = ctaType === PHONE_NUMBER;
|
|
@@ -232,10 +229,7 @@ export const CapWhatsappCTA = (props) => {
|
|
|
232
229
|
</CapColumn>
|
|
233
230
|
{ctaIsPhone && (
|
|
234
231
|
<CapColumn span={10} align="left">
|
|
235
|
-
<CapLabel className="phone">
|
|
236
|
-
+
|
|
237
|
-
{phone_number}
|
|
238
|
-
</CapLabel>
|
|
232
|
+
<CapLabel className="phone">+{phone_number}</CapLabel>
|
|
239
233
|
</CapColumn>
|
|
240
234
|
)}
|
|
241
235
|
{!ctaIsPhone && (
|
|
@@ -247,7 +241,7 @@ export const CapWhatsappCTA = (props) => {
|
|
|
247
241
|
: formatMessage(messages.ctaWebsiteTypeDynamic)}
|
|
248
242
|
</CapLabel>
|
|
249
243
|
</CapColumn>
|
|
250
|
-
<CapTooltip title={url} placement=
|
|
244
|
+
<CapTooltip title={url} placement={'top'}>
|
|
251
245
|
<CapColumn span={7} style={{ marginRight: '0px' }}>
|
|
252
246
|
<CapLabel className="url">{url}</CapLabel>
|
|
253
247
|
</CapColumn>
|
|
@@ -277,7 +271,6 @@ export const CapWhatsappCTA = (props) => {
|
|
|
277
271
|
tags={tags}
|
|
278
272
|
injectedTags={injectedTags}
|
|
279
273
|
selectedOfferDetails={selectedOfferDetails}
|
|
280
|
-
eventContextTags={eventContextTags}
|
|
281
274
|
/>
|
|
282
275
|
</CapColumn>
|
|
283
276
|
)}
|
|
@@ -289,7 +282,7 @@ export const CapWhatsappCTA = (props) => {
|
|
|
289
282
|
>
|
|
290
283
|
<CapTooltip
|
|
291
284
|
title={formatMessage(messages.whatsappCtaTagListRevert)}
|
|
292
|
-
placement=
|
|
285
|
+
placement={'top'}
|
|
293
286
|
>
|
|
294
287
|
<CapIcon size="s" type="return" />
|
|
295
288
|
</CapTooltip>
|
|
@@ -421,7 +414,7 @@ export const CapWhatsappCTA = (props) => {
|
|
|
421
414
|
? formatMessage(messages.ctaSaveDisabled)
|
|
422
415
|
: ''
|
|
423
416
|
}
|
|
424
|
-
placement=
|
|
417
|
+
placement={'bottom'}
|
|
425
418
|
>
|
|
426
419
|
<div className="button-disabled-tooltip-wrapper">
|
|
427
420
|
<CapButton
|
|
@@ -449,15 +442,15 @@ export const CapWhatsappCTA = (props) => {
|
|
|
449
442
|
{
|
|
450
443
|
// when first button is not saved, add button is disabled with tooltip
|
|
451
444
|
// eslint-disable-next-line no-unused-expressions
|
|
452
|
-
ctaData.length < 2
|
|
453
|
-
|
|
454
|
-
|
|
445
|
+
ctaData.length < 2 &&
|
|
446
|
+
!isEditFlow &&
|
|
447
|
+
renderArray.push(
|
|
455
448
|
<CapRow>
|
|
456
449
|
<CapTooltip
|
|
457
450
|
title={
|
|
458
451
|
addBtnDisabled ? formatMessage(messages.ctaAddDisabled) : ''
|
|
459
452
|
}
|
|
460
|
-
placement=
|
|
453
|
+
placement={'right'}
|
|
461
454
|
>
|
|
462
455
|
<div className="button-disabled-tooltip-wrapper">
|
|
463
456
|
<CapButton
|
|
@@ -740,7 +740,10 @@ export class Creatives extends React.Component {
|
|
|
740
740
|
forEach(androidContent.custom, (customKeyValue) => {
|
|
741
741
|
custom[customKeyValue.key] = customKeyValue.value;
|
|
742
742
|
});
|
|
743
|
-
|
|
743
|
+
//skipping it for MPUSH as custom key is already in the reqd format for hydra sdk
|
|
744
|
+
if (channel !== constants.MOBILE_PUSH) {
|
|
745
|
+
androidContent.custom = custom;
|
|
746
|
+
}
|
|
744
747
|
templateData.androidContent = androidContent;
|
|
745
748
|
templateData.androidContent.type = get(channelTemplate, 'definition.mode', '').toUpperCase();
|
|
746
749
|
templateData.androidContent.deviceType = 'ANDROID';
|
|
@@ -756,7 +759,10 @@ export class Creatives extends React.Component {
|
|
|
756
759
|
forEach(iosContent.custom, (customKeyValue) => {
|
|
757
760
|
custom[customKeyValue.key] = customKeyValue.value;
|
|
758
761
|
});
|
|
759
|
-
|
|
762
|
+
//skipping it for MPUSH as custom key is already in the reqd format for hydra sdk
|
|
763
|
+
if (channel !== constants.MOBILE_PUSH) {
|
|
764
|
+
iosContent.custom = custom;
|
|
765
|
+
}
|
|
760
766
|
templateData.iosContent = iosContent;
|
|
761
767
|
templateData.iosContent.type = get(channelTemplate, 'definition.mode').toUpperCase();
|
|
762
768
|
templateData.iosContent.deviceType = IOS.toUpperCase();
|
|
@@ -7,7 +7,6 @@
|
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
|
|
9
9
|
import React from 'react';
|
|
10
|
-
import { injectIntl } from 'react-intl';
|
|
11
10
|
import { connect } from 'react-redux';
|
|
12
11
|
import { Tree } from 'antd';
|
|
13
12
|
import _ from 'lodash';
|
|
@@ -17,20 +16,17 @@ import makeSelectTagList from './selectors';
|
|
|
17
16
|
import { UserIsAuthenticated } from '../../utils/authWrapper';
|
|
18
17
|
import * as actions from './actions';
|
|
19
18
|
import * as globalActions from '../Cap/actions';
|
|
20
|
-
import messages, { scope } from './messages';
|
|
21
|
-
|
|
22
19
|
// import styled from styled-components;
|
|
23
20
|
import CapTagList from '../../v2Components/CapTagList';
|
|
24
21
|
import './_tagList.scss';
|
|
25
22
|
import { selectCurrentOrgDetails, makeSelectFetchingSchemaError } from '../Cap/selectors';
|
|
26
|
-
import {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
import {
|
|
30
|
-
|
|
31
|
-
} from '../../containers/App/constants';
|
|
23
|
+
import { injectIntl } from 'react-intl';
|
|
24
|
+
import { scope } from './messages';
|
|
25
|
+
import messages from './messages';
|
|
26
|
+
import { handleInjectedData, hasGiftVoucherFeature, hasPromoFeature, hasBadgesFeature, transformBadgeTags } from '../../utils/common';
|
|
27
|
+
import { GIFT_VOUCHER_RELATED_TAGS, PROMO_ENGINE_RELATED_TAGS, BADGES_RELATED_TAGS, BADGES_ENROLL, BADGES_ISSUE } from '../../containers/App/constants';
|
|
32
28
|
|
|
33
|
-
const
|
|
29
|
+
const TreeNode = Tree.TreeNode;
|
|
34
30
|
|
|
35
31
|
export class TagList extends React.Component { // eslint-disable-line react/prefer-stateless-function
|
|
36
32
|
constructor(props) {
|
|
@@ -56,35 +52,35 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
|
|
|
56
52
|
this.setState({loading: true});
|
|
57
53
|
}
|
|
58
54
|
if (!_.isEqual(nextProps.injectedTags, this.props.injectedTags)) {
|
|
55
|
+
|
|
59
56
|
this.setState({loading: false});
|
|
60
57
|
}
|
|
61
58
|
if (!_.isEqual(nextProps.tags, this.props.tags)) {
|
|
59
|
+
|
|
62
60
|
this.setState({loading: false});
|
|
63
61
|
}
|
|
64
62
|
if (nextProps?.fetchingSchemaError) {
|
|
65
63
|
this.setState({tagsError: nextProps?.fetchingSchemaError});
|
|
66
64
|
}
|
|
67
|
-
}
|
|
68
65
|
|
|
66
|
+
}
|
|
69
67
|
componentDidUpdate(prevProps) {
|
|
70
68
|
if (this.props.tags !== prevProps.tags || this.props.injectedTags !== prevProps.injectedTags || this.props.selectedOfferDetails !== prevProps.selectedOfferDetails) {
|
|
71
69
|
this.generateTags(this.props);
|
|
72
70
|
}
|
|
73
71
|
}
|
|
74
|
-
|
|
75
72
|
onSelect = (selectedKeys) => {
|
|
76
73
|
this.props.onTagSelect(selectedKeys[0]);
|
|
77
74
|
};
|
|
78
75
|
|
|
79
|
-
|
|
76
|
+
onClick = (e, data) => {
|
|
80
77
|
|
|
81
|
-
|
|
78
|
+
};
|
|
82
79
|
|
|
83
80
|
getTagsforContext = (data) => {
|
|
84
81
|
//this.setState({loading: true});
|
|
85
82
|
this.props.onContextChange(data);
|
|
86
83
|
}
|
|
87
|
-
|
|
88
84
|
generateTags = (props) => {
|
|
89
85
|
let tags = {};
|
|
90
86
|
let injectedTags = {};
|
|
@@ -112,26 +108,24 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
|
|
|
112
108
|
if (eventContextTags?.length) {
|
|
113
109
|
const TAG_HEADER_MSG_LABEL = this.props.intl.formatMessage(messages.entryEvent);
|
|
114
110
|
eventContextTagsObj.eventContextTags = {
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
111
|
+
name: TAG_HEADER_MSG_LABEL,
|
|
112
|
+
desc: TAG_HEADER_MSG_LABEL,
|
|
113
|
+
resolved: true,
|
|
118
114
|
'tag-header': true,
|
|
119
|
-
|
|
115
|
+
subtags: {},
|
|
120
116
|
};
|
|
121
117
|
|
|
122
118
|
eventContextTags.forEach((tag) => {
|
|
123
|
-
const {
|
|
124
|
-
tagName, label, profileId, profileName,
|
|
125
|
-
} = tag || {};
|
|
119
|
+
const { tagName, label, profileId, profileName } = tag || {};
|
|
126
120
|
if (!profileId || !tagName || !label || !profileName) return;
|
|
127
121
|
// Initializing the tags profile if it doesn't exist
|
|
128
122
|
if (!eventContextTagsObj?.eventContextTags?.subtags?.[profileId]) {
|
|
129
123
|
eventContextTagsObj.eventContextTags.subtags[profileId] = {
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
124
|
+
name: profileName,
|
|
125
|
+
desc: profileName,
|
|
126
|
+
resolved: true,
|
|
133
127
|
"tag-header": true,
|
|
134
|
-
|
|
128
|
+
subtags: {},
|
|
135
129
|
};
|
|
136
130
|
}
|
|
137
131
|
// Adding the current tag to the profile group
|
|
@@ -144,7 +138,6 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
|
|
|
144
138
|
}
|
|
145
139
|
this.setState({tags: _.merge( {}, tags, injectedTags, eventContextTagsObj )});
|
|
146
140
|
}
|
|
147
|
-
|
|
148
141
|
populateTags(tagsList) {
|
|
149
142
|
const mainTags = {};
|
|
150
143
|
const excludedTags = [];
|
|
@@ -171,8 +164,8 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
|
|
|
171
164
|
}
|
|
172
165
|
if (!tag['tag-header']) {
|
|
173
166
|
mainTags[tag.value] = {
|
|
174
|
-
name: tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
|
|
175
|
-
desc: tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
|
|
167
|
+
"name": tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
|
|
168
|
+
"desc": tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,
|
|
176
169
|
};
|
|
177
170
|
} else if (tag['tag-header'] && mainTags[tag.value]) {
|
|
178
171
|
mainTags[tag.value].subtags = _.concat(mainTags[tag.value].subtags, tag.subtags);
|
|
@@ -252,9 +245,7 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
|
|
|
252
245
|
};
|
|
253
246
|
};
|
|
254
247
|
offerDetails.forEach((offer) => {
|
|
255
|
-
const {
|
|
256
|
-
id, couponName, description, couponSeriesId,
|
|
257
|
-
} = offer;
|
|
248
|
+
const { id, couponName, description, couponSeriesId } = offer;
|
|
258
249
|
const couponId = id || couponSeriesId;
|
|
259
250
|
const couponSubTags = {};
|
|
260
251
|
couponTagsKeys.forEach((couponTagKey) => {
|
|
@@ -879,10 +879,6 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
|
|
|
879
879
|
deleteHandler={deleteHandler}
|
|
880
880
|
isEditFlow={isEditFlow}
|
|
881
881
|
hostName={host}
|
|
882
|
-
tags={tags || []}
|
|
883
|
-
injectedTags={injectedTags || {}}
|
|
884
|
-
selectedOfferDetails={selectedOfferDetails}
|
|
885
|
-
eventContextTags={eventContextTags}
|
|
886
882
|
/>
|
|
887
883
|
)}
|
|
888
884
|
</>
|
|
@@ -2698,7 +2694,6 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
|
|
|
2698
2694
|
tags={tags || []}
|
|
2699
2695
|
injectedTags={injectedTags || {}}
|
|
2700
2696
|
selectedOfferDetails={selectedOfferDetails}
|
|
2701
|
-
eventContextTags={eventContextTags}
|
|
2702
2697
|
/>
|
|
2703
2698
|
)}
|
|
2704
2699
|
{isBtnTypeQuickReply && (
|