@capillarytech/creatives-library 7.7.10 → 7.7.12
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/index.js +3 -3
- package/package.json +1 -3
- package/v2Components/TemplatePreview/index.js +0 -1
- package/v2Containers/CapFacebookPreview/index.js +11 -15
- package/v2Containers/CapFacebookPreview/messages.js +2 -2
- package/v2Containers/CreativesContainer/SlideBoxContent.js +1 -16
- package/v2Containers/CreativesContainer/index.js +12 -125
- package/v2Containers/Facebook/Advertisement/index.js +41 -80
- package/v2Containers/Facebook/Advertisement/index.scss +3 -3
- package/v2Containers/Facebook/Facebook.style.js +1 -1
- package/v2Containers/Facebook/constants.js +0 -4
- package/v2Containers/Facebook/index.js +122 -198
- package/v2Containers/Facebook/messages.js +4 -24
- package/v2Containers/Templates/index.js +21 -37
- package/v2Containers/Templates/messages.js +1 -1
- package/v2Containers/Templates/reducer.js +4 -4
- package/v2Containers/TemplatesV2/index.js +6 -23
- package/v2Containers/TemplatesV2/messages.js +0 -4
- package/v2Containers/CapFacebookPreview/index.scss +0 -4
|
@@ -17,7 +17,7 @@ $classPrefix: add-facebook-ad-section;
|
|
|
17
17
|
text-overflow: ellipsis;
|
|
18
18
|
white-space: nowrap;
|
|
19
19
|
min-width: 112px;
|
|
20
|
-
max-width:
|
|
20
|
+
max-width: 920px;
|
|
21
21
|
display: inline-block;
|
|
22
22
|
}
|
|
23
23
|
.cap-input-edit-name{
|
|
@@ -30,7 +30,7 @@ $classPrefix: add-facebook-ad-section;
|
|
|
30
30
|
|
|
31
31
|
.cap-header-facebook-ad{
|
|
32
32
|
position: fixed;
|
|
33
|
-
top:
|
|
33
|
+
top: 27px;
|
|
34
34
|
z-index: 1000;
|
|
35
35
|
.title-desc-container{
|
|
36
36
|
padding-left: 10px;
|
|
@@ -48,7 +48,7 @@ $classPrefix: add-facebook-ad-section;
|
|
|
48
48
|
.cap-custom-image-upload{
|
|
49
49
|
.dragger-button.re-upload{
|
|
50
50
|
margin-top: 50px;
|
|
51
|
-
top:
|
|
51
|
+
top: 0px;
|
|
52
52
|
position: absolute;
|
|
53
53
|
right: 60px;
|
|
54
54
|
color: $FONT_COLOR_05;
|
|
@@ -47,7 +47,3 @@ export const VALUE_REACH = 'VALUE_REACH';
|
|
|
47
47
|
export const VALUE_VIDEO_VIEWS = 'VALUE_VIDEO_VIEWS';
|
|
48
48
|
export const VALUE_LINK_CLICKS = 'VALUE_LINK_CLICKS';
|
|
49
49
|
export const VALUE_POST_ENGAGEMENT = 'VALUE_POST_ENGAGEMENT';
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
export const AD_MANAGER = "AD_MANAGER";
|
|
53
|
-
export const CREATIVE = "CREATIVE";
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
*
|
|
5
5
|
*/
|
|
6
6
|
import PropTypes from "prop-types";
|
|
7
|
-
import React, { useState, useEffect
|
|
7
|
+
import React, { useState, useEffect } from "react";
|
|
8
8
|
import { injectIntl, FormattedMessage, intlShape } from "react-intl";
|
|
9
9
|
import {
|
|
10
10
|
CapHeading,
|
|
@@ -15,10 +15,7 @@ import {
|
|
|
15
15
|
CapDrawer,
|
|
16
16
|
CapCustomCard,
|
|
17
17
|
CapIcon,
|
|
18
|
-
CapRadioGroup,
|
|
19
|
-
CapTooltip,
|
|
20
18
|
} from '@capillarytech/cap-ui-library';
|
|
21
|
-
import Templates from '../Templates';
|
|
22
19
|
import { createStructuredSelector } from 'reselect';
|
|
23
20
|
import { connect } from 'react-redux';
|
|
24
21
|
import { bindActionCreators } from 'redux';
|
|
@@ -41,8 +38,6 @@ import {
|
|
|
41
38
|
VALUE_REACH,
|
|
42
39
|
VALUE_VIDEO_VIEWS,
|
|
43
40
|
VALUE_LINK_CLICKS,
|
|
44
|
-
AD_MANAGER,
|
|
45
|
-
CREATIVE,
|
|
46
41
|
} from './constants';
|
|
47
42
|
|
|
48
43
|
const StyledCampaignDetailCapColumn = withStyles(CapColumn, CampaignDetailCapColumn);
|
|
@@ -188,25 +183,12 @@ const Facebook = (props) => {
|
|
|
188
183
|
onCreateComplete,
|
|
189
184
|
params,
|
|
190
185
|
facebookTemplateData,
|
|
191
|
-
messageStrategy,
|
|
192
|
-
router,
|
|
193
|
-
handlePeviewTemplate,
|
|
194
|
-
renderNewCardGrid,
|
|
195
|
-
onSelectTemplate,
|
|
196
|
-
createNew,
|
|
197
|
-
fbAdManager,
|
|
198
|
-
getFormSubscriptionData,
|
|
199
|
-
showDisabledFBInfo,
|
|
200
|
-
orgUnitId,
|
|
201
186
|
} = props;
|
|
202
187
|
const {
|
|
203
188
|
selectedMarketingObjective: fbMarketingObjectiveValue = VALUE_REACH,
|
|
204
189
|
} = templateData || {};
|
|
205
190
|
const [isDrawerVisible, setDrawerVisibility] = useState(false);
|
|
206
191
|
const [selectedMarketingObjective, setMarketingObjective] = useState(socialObjective || fbMarketingObjectiveValue);
|
|
207
|
-
const [adManager, setAdManager] = useState(AD_MANAGER);
|
|
208
|
-
const [showTemplateList, setTemplateList] = useState(false);
|
|
209
|
-
|
|
210
192
|
|
|
211
193
|
useEffect(() => {
|
|
212
194
|
if (!isFullMode) {
|
|
@@ -243,188 +225,131 @@ const Facebook = (props) => {
|
|
|
243
225
|
|
|
244
226
|
const onMarketingObjectiveSelect = (value) => setMarketingObjective(value);
|
|
245
227
|
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
const onFacebookAdManagerContinue = useCallback(() => {
|
|
257
|
-
if (adManager === AD_MANAGER) {
|
|
258
|
-
onFacebookSubmit({ channel: "FACEBOOK", selectedMarketingObjective, accountId });
|
|
259
|
-
} else {
|
|
260
|
-
setTemplateList(true);
|
|
261
|
-
}
|
|
262
|
-
}, [
|
|
263
|
-
selectedMarketingObjective,
|
|
264
|
-
accountId,
|
|
265
|
-
adManager,
|
|
266
|
-
setAdManager,
|
|
267
|
-
setTemplateList,
|
|
268
|
-
showTemplateList,
|
|
269
|
-
]);
|
|
270
|
-
const query = {type: 'embedded', module: 'library'};
|
|
271
|
-
const location = {pathname: `/FACEBOOK`, search: '', query};
|
|
272
|
-
return (showTemplateList ? (
|
|
273
|
-
<Templates
|
|
274
|
-
key={"FACEBOOK"}
|
|
275
|
-
location={location}
|
|
276
|
-
route={{name: "FACEBOOK"}}
|
|
277
|
-
router={router}
|
|
278
|
-
isFullMode={isFullMode}
|
|
279
|
-
createNew={createNew}
|
|
280
|
-
onSelectTemplate={onSelectTemplate}
|
|
281
|
-
renderNewCardGrid={renderNewCardGrid}
|
|
282
|
-
handlePeviewTemplate={handlePeviewTemplate}
|
|
283
|
-
fbAdManager={CREATIVE}
|
|
284
|
-
/>
|
|
285
|
-
) :
|
|
286
|
-
(!isFullMode && (fbAdManager !== CREATIVE && messageStrategy === "DEFAULT" || (templateData?.edit && templateData?.fbContentType !==CREATIVE)) ) ?
|
|
287
|
-
(<div className={className}>
|
|
288
|
-
|
|
289
|
-
<div className="is-scrollable-section" >
|
|
290
|
-
<div className="account-details-wrapper">
|
|
291
|
-
<div className="account-name-section">
|
|
292
|
-
<CapHeading type="h4">
|
|
293
|
-
<FormattedMessage {...messages.fbAccount} />
|
|
294
|
-
</CapHeading>
|
|
295
|
-
<CapHeading type="h3">{accountName}</CapHeading>
|
|
296
|
-
</div>
|
|
297
|
-
|
|
298
|
-
<div className="account-section-container">
|
|
299
|
-
<CapHeading type="h3">
|
|
300
|
-
<FormattedMessage {...messages.fbAdCampaignSetDetailsTitle} />
|
|
301
|
-
</CapHeading>
|
|
302
|
-
<CapLabel type="label1">
|
|
303
|
-
<FormattedMessage
|
|
304
|
-
{...messages.fbAdCampaignSetDetailsDescription}
|
|
305
|
-
/>
|
|
306
|
-
</CapLabel>
|
|
307
|
-
</div>
|
|
228
|
+
return (
|
|
229
|
+
!isFullMode ? (<div className={className}>
|
|
230
|
+
<div className="is-scrollable-section" >
|
|
231
|
+
<div className="account-details-wrapper">
|
|
232
|
+
<div className="account-name-section">
|
|
233
|
+
<CapHeading type="h4">
|
|
234
|
+
<FormattedMessage {...messages.fbAccount} />
|
|
235
|
+
</CapHeading>
|
|
236
|
+
<CapHeading type="h3">{accountName}</CapHeading>
|
|
237
|
+
</div>
|
|
308
238
|
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
<CapHeading type="h4">
|
|
320
|
-
{value}
|
|
321
|
-
{!socialRemoteCampaignId && onChange && (
|
|
322
|
-
<CapButton
|
|
323
|
-
type="flat"
|
|
324
|
-
className="marketingObjective-change-button facebook-marketing-objective-change"
|
|
325
|
-
onClick={onChange}
|
|
326
|
-
>
|
|
327
|
-
<FormattedMessage {...messages.fbChange} />
|
|
328
|
-
</CapButton>
|
|
329
|
-
)}
|
|
330
|
-
</CapHeading>
|
|
331
|
-
</CapRow>
|
|
332
|
-
</StyledCampaignDetailCapColumn>
|
|
333
|
-
))}
|
|
334
|
-
</CapRow>
|
|
335
|
-
<CapDrawer
|
|
336
|
-
content={
|
|
337
|
-
<MarketingObjective
|
|
338
|
-
selectedMarketingObjective={selectedMarketingObjective}
|
|
339
|
-
onMarketingObjectiveSelect={onMarketingObjectiveSelect}
|
|
340
|
-
defaultmarketingObjective={socialObjective || fbMarketingObjectiveValue}
|
|
341
|
-
onSubmit={setDrawerVisibility}
|
|
342
|
-
marketingObjectiveList={categorizedMarketingObjectiveList}
|
|
343
|
-
/>
|
|
344
|
-
}
|
|
345
|
-
visible={isDrawerVisible}
|
|
346
|
-
width={380}
|
|
347
|
-
onClose={() => setDrawerVisibility(false)}
|
|
348
|
-
/>
|
|
349
|
-
</div>
|
|
239
|
+
<div className="account-section-container">
|
|
240
|
+
<CapHeading type="h3">
|
|
241
|
+
<FormattedMessage {...messages.fbAdCampaignSetDetailsTitle} />
|
|
242
|
+
</CapHeading>
|
|
243
|
+
<CapLabel type="label1">
|
|
244
|
+
<FormattedMessage
|
|
245
|
+
{...messages.fbAdCampaignSetDetailsDescription}
|
|
246
|
+
/>
|
|
247
|
+
</CapLabel>
|
|
248
|
+
</div>
|
|
350
249
|
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
250
|
+
<CapRow span={12} type="flex">
|
|
251
|
+
{campaignDataList.map(({ label, value, onChange }, index) => (
|
|
252
|
+
<StyledCampaignDetailCapColumn
|
|
253
|
+
span={index % 2 === 0 ? 6 : 14}
|
|
254
|
+
key={label}
|
|
255
|
+
>
|
|
256
|
+
<CapRow>
|
|
257
|
+
<CapLabel type="label2">
|
|
258
|
+
<FormattedMessage {...messages[label]} />
|
|
259
|
+
</CapLabel>
|
|
260
|
+
<CapHeading type="h4">
|
|
261
|
+
{value}
|
|
262
|
+
{!socialRemoteCampaignId && onChange && (
|
|
263
|
+
<CapButton
|
|
264
|
+
type="flat"
|
|
265
|
+
className="marketingObjective-change-button facebook-marketing-objective-change"
|
|
266
|
+
onClick={onChange}
|
|
267
|
+
>
|
|
268
|
+
<FormattedMessage {...messages.fbChange} />
|
|
269
|
+
</CapButton>
|
|
270
|
+
)}
|
|
271
|
+
</CapHeading>
|
|
272
|
+
</CapRow>
|
|
273
|
+
</StyledCampaignDetailCapColumn>
|
|
274
|
+
))}
|
|
275
|
+
</CapRow>
|
|
276
|
+
<CapDrawer
|
|
277
|
+
content={
|
|
278
|
+
<MarketingObjective
|
|
279
|
+
selectedMarketingObjective={selectedMarketingObjective}
|
|
280
|
+
onMarketingObjectiveSelect={onMarketingObjectiveSelect}
|
|
281
|
+
defaultmarketingObjective={socialObjective || fbMarketingObjectiveValue}
|
|
282
|
+
onSubmit={setDrawerVisibility}
|
|
283
|
+
marketingObjectiveList={categorizedMarketingObjectiveList}
|
|
284
|
+
/>
|
|
285
|
+
}
|
|
286
|
+
visible={isDrawerVisible}
|
|
287
|
+
width={380}
|
|
288
|
+
onClose={() => setDrawerVisibility(false)}
|
|
363
289
|
/>
|
|
364
|
-
|
|
365
|
-
<div className="account-section-container">
|
|
366
|
-
<CapLabel type="label1">
|
|
367
|
-
<FormattedMessage {...messages.fbAdsDescription} />
|
|
368
|
-
</CapLabel>
|
|
369
|
-
</div>
|
|
290
|
+
</div>
|
|
370
291
|
|
|
292
|
+
<div className="ad-section">
|
|
293
|
+
<div className="account-section-container">
|
|
294
|
+
<CapHeading type="h3">
|
|
295
|
+
<FormattedMessage {...messages.fbAdsTitle} />
|
|
296
|
+
</CapHeading>
|
|
297
|
+
<CapLabel type="label1">
|
|
298
|
+
<FormattedMessage {...messages.fbAdsDescription} />
|
|
299
|
+
</CapLabel>
|
|
300
|
+
</div>
|
|
371
301
|
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
selectedMarketingObjective={selectedMarketingObjective}
|
|
424
|
-
fbAdManager={fbAdManager}
|
|
425
|
-
orgUnitId={orgUnitId}
|
|
426
|
-
/>
|
|
427
|
-
</div>
|
|
302
|
+
<div>
|
|
303
|
+
<CapRow span={12} type="flex">
|
|
304
|
+
<CapColumn span={6}>
|
|
305
|
+
<CapCustomCard
|
|
306
|
+
type="Facebook"
|
|
307
|
+
FBDynamicComponent={() => (
|
|
308
|
+
<CapIcon
|
|
309
|
+
size="l"
|
|
310
|
+
type="scenery"
|
|
311
|
+
className="facebook-dynamic-content"
|
|
312
|
+
/>
|
|
313
|
+
)}
|
|
314
|
+
/>
|
|
315
|
+
</CapColumn>
|
|
316
|
+
<CapColumn span={16}>
|
|
317
|
+
<ul className="parameter-list">
|
|
318
|
+
{adSetParameters.map((parameter, index) => (
|
|
319
|
+
<li key={parameter} className="parameter-list-item">
|
|
320
|
+
<CapLabel type="label2" className="parameter-index">
|
|
321
|
+
{index + 1}
|
|
322
|
+
</CapLabel>
|
|
323
|
+
<CapHeading type="h5">
|
|
324
|
+
<FormattedMessage {...messages[parameter]} />
|
|
325
|
+
</CapHeading>
|
|
326
|
+
</li>
|
|
327
|
+
))}
|
|
328
|
+
</ul>
|
|
329
|
+
</CapColumn>
|
|
330
|
+
</CapRow>
|
|
331
|
+
</div>
|
|
332
|
+
</div>
|
|
333
|
+
</div>
|
|
334
|
+
<CapButton
|
|
335
|
+
className="facebook-confirm-button"
|
|
336
|
+
type="primary"
|
|
337
|
+
onClick={() =>
|
|
338
|
+
onFacebookSubmit({ channel: "FACEBOOK", selectedMarketingObjective, accountId })
|
|
339
|
+
}
|
|
340
|
+
>
|
|
341
|
+
<FormattedMessage {...messages.fbConfirm} />
|
|
342
|
+
</CapButton>
|
|
343
|
+
</div>) : <div style={{height: '1200px'}}>
|
|
344
|
+
<Advertisement
|
|
345
|
+
isFullMode={isFullMode}
|
|
346
|
+
actions={facebookActions}
|
|
347
|
+
fbADData={fbADData}
|
|
348
|
+
onCreateComplete={onCreateComplete}
|
|
349
|
+
templateData={templateData}
|
|
350
|
+
params={params}
|
|
351
|
+
facebookTemplateData={facebookTemplateData}
|
|
352
|
+
/></div>
|
|
428
353
|
);
|
|
429
354
|
};
|
|
430
355
|
|
|
@@ -442,12 +367,11 @@ Facebook.propTypes = {
|
|
|
442
367
|
fbADData: PropTypes.object,
|
|
443
368
|
onCreateComplete: PropTypes.func,
|
|
444
369
|
facebookTemplateData: PropTypes.object,
|
|
445
|
-
messageStrategy: PropTypes.string,
|
|
446
|
-
getFormSubscriptionData: PropTypes.func,
|
|
447
370
|
};
|
|
448
371
|
|
|
449
372
|
Facebook.defaultProps = {
|
|
450
373
|
marketingObjectiveList: [""],
|
|
374
|
+
|
|
451
375
|
};
|
|
452
376
|
|
|
453
377
|
const mapStateToProps = createStructuredSelector({
|
|
@@ -42,7 +42,7 @@ export default defineMessages({
|
|
|
42
42
|
},
|
|
43
43
|
fbAdsDescription: {
|
|
44
44
|
id: `${messagePrefix}.fbAdsDescription`,
|
|
45
|
-
defaultMessage: '
|
|
45
|
+
defaultMessage: 'You may create ads in Facebook Ad Manager under the below mentioned ad set. The performance of these ads will be reported here in Engage+.',
|
|
46
46
|
},
|
|
47
47
|
fbAdsDetailOne: {
|
|
48
48
|
id: `${messagePrefix}.fbAdsDetailOne`,
|
|
@@ -56,9 +56,9 @@ export default defineMessages({
|
|
|
56
56
|
id: `${messagePrefix}.fbAdsDetailThree`,
|
|
57
57
|
defaultMessage: 'You can create ads later in Facebook ad manager.',
|
|
58
58
|
},
|
|
59
|
-
|
|
60
|
-
id: `${messagePrefix}.
|
|
61
|
-
defaultMessage: '
|
|
59
|
+
fbConfirm: {
|
|
60
|
+
id: `${messagePrefix}.fbConfirm`,
|
|
61
|
+
defaultMessage: 'Confirm',
|
|
62
62
|
},
|
|
63
63
|
fbChange: {
|
|
64
64
|
id: `${messagePrefix}.fbChange`,
|
|
@@ -164,24 +164,4 @@ export default defineMessages({
|
|
|
164
164
|
id: `${messagePrefix}.fbMarketingObjectiveStoreTrafficDescription`,
|
|
165
165
|
defaultMessage: 'Drive visits to your physical stores by showing ads to people who are nearby.',
|
|
166
166
|
},
|
|
167
|
-
capFbAdManager: {
|
|
168
|
-
id: `${messagePrefix}.capFbAdManager`,
|
|
169
|
-
defaultMessage: 'Capillary Facebook ad manager',
|
|
170
|
-
},
|
|
171
|
-
fbAdManager: {
|
|
172
|
-
id: `${messagePrefix}.fbAdManager`,
|
|
173
|
-
defaultMessage: 'Facebook ad manager',
|
|
174
|
-
},
|
|
175
|
-
adManagerHeading: {
|
|
176
|
-
id: `${messagePrefix}.adManagerHeading`,
|
|
177
|
-
defaultMessage: "Where do you want to create your Facebook ad creative?",
|
|
178
|
-
},
|
|
179
|
-
capAdManagerHeading: {
|
|
180
|
-
id: `${messagePrefix}.capAdManagerHeading`,
|
|
181
|
-
defaultMessage: "You can create Facebook ads creative in Engage+ Facebook ad Manager.",
|
|
182
|
-
},
|
|
183
|
-
facebookDisableinfo: {
|
|
184
|
-
id: `${messagePrefix}.facebookDisableinfo`,
|
|
185
|
-
defaultMessage: 'Please integrate Facebook page ID & page name to enable this option.',
|
|
186
|
-
},
|
|
187
167
|
});
|
|
@@ -62,8 +62,6 @@ import {
|
|
|
62
62
|
} from '../App/constants';
|
|
63
63
|
import { MOBILE_PUSH, WECHAT, SMS, EMAIL, EBILL, LINE, VIBER, FACEBOOK } from '../CreativesContainer/constants';
|
|
64
64
|
|
|
65
|
-
import {CREATIVE} from '../Facebook/constants';
|
|
66
|
-
|
|
67
65
|
import emailIllustration from '../Assets/images/emailIllustration.svg';
|
|
68
66
|
import smsIllustration from '../Assets/images/smsIllustration.svg';
|
|
69
67
|
import pushIllustration from '../Assets/images/pushIllustration.svg';
|
|
@@ -323,7 +321,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
323
321
|
}
|
|
324
322
|
const fbSetting = get(nextProps.Templates, 'campaignSettings.accountSettings.socialAccountSettings.facebookAccountSettings', []);
|
|
325
323
|
const { accountName = "",
|
|
326
|
-
|
|
324
|
+
orgUnitFacebookPageSettingsMap = {},
|
|
327
325
|
} = fbSetting[0] || {};
|
|
328
326
|
let pageAccessToken = false;
|
|
329
327
|
if (!isEmpty(orgUnitFacebookPageSettingsMap)) {
|
|
@@ -510,7 +508,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
510
508
|
}
|
|
511
509
|
|
|
512
510
|
this.setState({activeMode: TEMPLATES_MODE});
|
|
513
|
-
|
|
511
|
+
|
|
514
512
|
this.getAllTemplates({params, resetPage: true});
|
|
515
513
|
});
|
|
516
514
|
}
|
|
@@ -1138,17 +1136,12 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
1138
1136
|
const channel = this.state.channel.toLowerCase();
|
|
1139
1137
|
//const keyType = ev.key && ev.key.toLowerCase() !== undefined ? ev.state.toLowerCase() : '';
|
|
1140
1138
|
let routeParams = {};
|
|
1141
|
-
const {fbAdManager} = this.props;
|
|
1142
1139
|
const isLibraryMode = this.isEnabledInLibraryModule("callCreateFromProps");
|
|
1143
|
-
if
|
|
1140
|
+
if(!isLibraryMode) {
|
|
1144
1141
|
timeTracker.startTimer(CHANNEL_CREATE_TRACK_MAPPING[channel]);
|
|
1145
1142
|
}
|
|
1146
1143
|
if (isLibraryMode) {
|
|
1147
|
-
|
|
1148
|
-
this.props.createNew(fbAdManager);
|
|
1149
|
-
} else {
|
|
1150
|
-
this.props.createNew();
|
|
1151
|
-
}
|
|
1144
|
+
this.props.createNew();
|
|
1152
1145
|
} else if (ev.key && (ev.key.toLowerCase() === "text" || ev.key.toLowerCase() === "image")) {
|
|
1153
1146
|
routeParams = {
|
|
1154
1147
|
pathname: `/${channel === 'line' ? 'line' : 'mobilepush'}/create/${ev.key.toLowerCase()}`,
|
|
@@ -1418,7 +1411,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
1418
1411
|
}
|
|
1419
1412
|
}
|
|
1420
1413
|
if (this.isEnabledInLibraryModule("callSelectFromProps")) {
|
|
1421
|
-
this.props.onSelectTemplate(
|
|
1414
|
+
this.props.onSelectTemplate(id);
|
|
1422
1415
|
} else {
|
|
1423
1416
|
timeTracker.startTimer(CHANNEL_EDIT_TRACK_MAPPING[this.state.channel.toLowerCase()]);
|
|
1424
1417
|
if (this.state.channel.toLowerCase() === 'ebill') {
|
|
@@ -1431,9 +1424,6 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
1431
1424
|
}
|
|
1432
1425
|
}
|
|
1433
1426
|
|
|
1434
|
-
selectTemplate = (id) => find(this.props.TemplatesList, {_id: id})
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
1427
|
handlePreviewClick(template, modeType) {
|
|
1438
1428
|
this.togglePreview();
|
|
1439
1429
|
const templateInfo = cloneDeep(template);
|
|
@@ -1811,10 +1801,9 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
1811
1801
|
const isWechatChannel = channel === WECHAT;
|
|
1812
1802
|
const isMobilePushChannel = channel === MOBILE_PUSH;
|
|
1813
1803
|
const isLineChannel = channel === LINE;
|
|
1814
|
-
const isFacebookChannel = channel === FACEBOOK;
|
|
1815
1804
|
|
|
1816
1805
|
|
|
1817
|
-
if ((isWechatChannel || isMobilePushChannel || isLineChannel) && !isEmpty(weCrmAccounts)
|
|
1806
|
+
if ((isWechatChannel || isMobilePushChannel || isLineChannel) && !isEmpty(weCrmAccounts)) {
|
|
1818
1807
|
forEach(weCrmAccounts, (account) => {
|
|
1819
1808
|
if ((isWechatChannel && account.configs && account.configs.is_wecrm_enabled) || isMobilePushChannel || isLineChannel) {
|
|
1820
1809
|
if (query.type === 'embedded' && (!query.module || (query.module && query.module !== 'library'))) {
|
|
@@ -1954,33 +1943,28 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
|
|
|
1954
1943
|
render() {
|
|
1955
1944
|
const isFullMode = this.isFullMode();
|
|
1956
1945
|
const { activeMode, channel, wechatFilter, lineFilter } = this.state;
|
|
1957
|
-
let
|
|
1946
|
+
let showForFacebook = true;
|
|
1958
1947
|
if (channel.toLowerCase() === FACEBOOK_CHANNEL) {
|
|
1959
|
-
|
|
1960
|
-
|
|
1961
|
-
|
|
1962
|
-
|
|
1963
|
-
|
|
1964
|
-
|
|
1965
|
-
|
|
1966
|
-
|
|
1967
|
-
|
|
1968
|
-
|
|
1969
|
-
pageAccessToken = true;
|
|
1970
|
-
}
|
|
1971
|
-
});
|
|
1972
|
-
if (!pageAccessToken) {
|
|
1973
|
-
showFbAds = true;
|
|
1948
|
+
if (isEmpty(this.props.Templates.campaignSettings)) {
|
|
1949
|
+
showForFacebook = false;
|
|
1950
|
+
}
|
|
1951
|
+
const fbSetting = get(this.props.Templates, 'campaignSettings.accountSettings.socialAccountSettings.facebookAccountSettings', []);
|
|
1952
|
+
const { orgUnitFacebookPageSettingsMap = {} } = fbSetting[0] || {};
|
|
1953
|
+
let pageAccessToken = false;
|
|
1954
|
+
if (!isEmpty(orgUnitFacebookPageSettingsMap)) {
|
|
1955
|
+
Object.values(orgUnitFacebookPageSettingsMap).forEach((obj) => {
|
|
1956
|
+
if (obj.pageAccessToken) {
|
|
1957
|
+
pageAccessToken = true;
|
|
1974
1958
|
}
|
|
1975
|
-
}
|
|
1976
|
-
|
|
1959
|
+
});
|
|
1960
|
+
if (!pageAccessToken) {
|
|
1961
|
+
showForFacebook = false;
|
|
1977
1962
|
}
|
|
1978
1963
|
}
|
|
1979
1964
|
}
|
|
1980
|
-
|
|
1981
1965
|
const showForViber = (![VIBER_CHANNEL, FACEBOOK_CHANNEL].includes(channel.toLowerCase()) ||
|
|
1982
1966
|
(channel.toLowerCase() === VIBER_CHANNEL && !this.props.isFullMode && isEmpty(get(this.props, 'Templates.selectedViberAccount', {}))) ||
|
|
1983
|
-
(channel.toLowerCase() === FACEBOOK_CHANNEL &&
|
|
1967
|
+
(channel.toLowerCase() === FACEBOOK_CHANNEL && showForFacebook)
|
|
1984
1968
|
);
|
|
1985
1969
|
|
|
1986
1970
|
|
|
@@ -372,6 +372,6 @@ export default defineMessages({
|
|
|
372
372
|
},
|
|
373
373
|
"noAccountsPresentFacebook": {
|
|
374
374
|
id: `${scope}.noAccountsPresentFacebook`,
|
|
375
|
-
defaultMessage: "
|
|
375
|
+
defaultMessage: "Facebook accounts or Facebook Page are not setup for your brand",
|
|
376
376
|
},
|
|
377
377
|
});
|
|
@@ -9,7 +9,7 @@ import * as types from './constants';
|
|
|
9
9
|
|
|
10
10
|
const initialState = fromJS({
|
|
11
11
|
getAllTemplatesInProgress: false,
|
|
12
|
-
|
|
12
|
+
fetchingOrgLevelCampaignSettings: true,
|
|
13
13
|
templates: [],
|
|
14
14
|
deleteResponse: {},
|
|
15
15
|
deleteTemplateInProgress: false,
|
|
@@ -160,9 +160,9 @@ function templatesReducer(state = initialState, action) {
|
|
|
160
160
|
.set('templates', [])
|
|
161
161
|
.set('weCRMtemplates', fromJS({}));
|
|
162
162
|
case types.GET_ORG_LEVEL_CAMPAIGN_SETTINGS_REQUEST:
|
|
163
|
-
return state.set('
|
|
163
|
+
return state.set('fetchingOrgLevelCampaignSettings', true);
|
|
164
164
|
case types.GET_ORG_LEVEL_CAMPAIGN_SETTINGS_SUCCESS:
|
|
165
|
-
return state.set('
|
|
165
|
+
return state.set('fetchingOrgLevelCampaignSettings', false).set(
|
|
166
166
|
'campaignSettings',
|
|
167
167
|
fromJS({
|
|
168
168
|
...state.get('campaignSettings'),
|
|
@@ -170,7 +170,7 @@ function templatesReducer(state = initialState, action) {
|
|
|
170
170
|
}),
|
|
171
171
|
);
|
|
172
172
|
case types.GET_ORG_LEVEL_CAMPAIGN_SETTINGS_FAILURE:
|
|
173
|
-
return state.set('
|
|
173
|
+
return state.set('fetchingOrgLevelCampaignSettings', false);
|
|
174
174
|
default:
|
|
175
175
|
return state;
|
|
176
176
|
}
|