@capillarytech/creatives-library 8.0.345-alpha.8 → 8.0.345
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 +1 -1
- package/services/api.js +20 -0
- package/services/tests/api.test.js +59 -0
- package/v2Components/CapCustomSkeleton/index.js +1 -1
- package/v2Components/CapCustomSkeleton/tests/__snapshots__/index.test.js.snap +12 -12
- package/v2Containers/Assets/images/archive_Empty_Illustration.svg +9 -0
- package/v2Containers/CreativesContainer/SlideBoxContent.js +1 -20
- package/v2Containers/CreativesContainer/SlideBoxFooter.js +3 -1
- package/v2Containers/CreativesContainer/index.js +6 -4
- package/v2Containers/CreativesContainer/messages.js +4 -0
- package/v2Containers/CreativesContainer/tests/__snapshots__/index.test.js.snap +3 -0
- package/v2Containers/Email/index.js +0 -17
- package/v2Containers/Templates/ChannelTypeIllustration.js +23 -6
- package/v2Containers/Templates/_templates.scss +130 -24
- package/v2Containers/Templates/actions.js +36 -0
- package/v2Containers/Templates/constants.js +23 -0
- package/v2Containers/Templates/index.js +286 -30
- package/v2Containers/Templates/messages.js +68 -0
- package/v2Containers/Templates/reducer.js +68 -0
- package/v2Containers/Templates/sagas.js +89 -1
- package/v2Containers/Templates/selectors.js +12 -0
- package/v2Containers/Templates/tests/ChannelTypeIllustration.test.js +12 -0
- package/v2Containers/Templates/tests/__snapshots__/index.test.js.snap +1300 -1122
- package/v2Containers/Templates/tests/index.test.js +6 -0
- package/v2Containers/Templates/tests/reducer.test.js +178 -0
- package/v2Containers/Templates/tests/sagas.test.js +314 -8
- package/v2Containers/Templates/tests/selector.test.js +32 -0
|
@@ -705,27 +705,8 @@ export function SlideBoxContent(props) {
|
|
|
705
705
|
// and getDetails?type=BEE_PLUGIN would never fire. Routing BEE
|
|
706
706
|
// templates through the direct <Email> path — which is already
|
|
707
707
|
// battle-tested for the CKEditor flow — sidesteps that entirely.
|
|
708
|
-
const vBase = templateData?.versions?.base;
|
|
709
|
-
const vBaseActiveTab = vBase?.activeTab || vBase?.selectedLanguages?.[0] || 'en';
|
|
710
708
|
const isBEETemplate = templateData?.base?.is_drag_drop === true
|
|
711
|
-
|| templateData?.base?.is_drag_drop === 1
|
|
712
|
-
|| vBase?.[vBaseActiveTab]?.is_drag_drop === true
|
|
713
|
-
|| vBase?.[vBaseActiveTab]?.is_drag_drop === 1;
|
|
714
|
-
console.log('[SlideBoxContent] BEE routing debug', {
|
|
715
|
-
supportCKEditor,
|
|
716
|
-
'templateData._id': templateData?._id,
|
|
717
|
-
'templateData.type': templateData?.type,
|
|
718
|
-
'templateData.base': templateData?.base,
|
|
719
|
-
'templateData.base.is_drag_drop': templateData?.base?.is_drag_drop,
|
|
720
|
-
'templateData.base.drag_drop_id': templateData?.base?.drag_drop_id,
|
|
721
|
-
vBase,
|
|
722
|
-
vBaseActiveTab,
|
|
723
|
-
'vBase[vBaseActiveTab]': vBase?.[vBaseActiveTab],
|
|
724
|
-
'vBase[vBaseActiveTab].is_drag_drop': vBase?.[vBaseActiveTab]?.is_drag_drop,
|
|
725
|
-
'vBase[vBaseActiveTab].drag_drop_id': vBase?.[vBaseActiveTab]?.drag_drop_id,
|
|
726
|
-
isBEETemplate,
|
|
727
|
-
routingTo: (supportCKEditor || isBEETemplate) ? 'Email (direct)' : 'EmailWrapper',
|
|
728
|
-
});
|
|
709
|
+
|| templateData?.base?.is_drag_drop === 1;
|
|
729
710
|
if (supportCKEditor || isBEETemplate) {
|
|
730
711
|
return (
|
|
731
712
|
<Email
|
|
@@ -24,6 +24,7 @@ function SlideBoxFooter(props) {
|
|
|
24
24
|
slidBoxContent,
|
|
25
25
|
onSave,
|
|
26
26
|
onEditTemplate,
|
|
27
|
+
isTemplateArchived,
|
|
27
28
|
onCreateNextStep,
|
|
28
29
|
isFullMode,
|
|
29
30
|
fetchingCmsData,
|
|
@@ -214,7 +215,7 @@ function SlideBoxFooter(props) {
|
|
|
214
215
|
<FormattedMessage {...(continueButtonLabel || messages.continue)} />
|
|
215
216
|
</CapButton>
|
|
216
217
|
)}
|
|
217
|
-
{slidBoxContent === PREVIEW && (
|
|
218
|
+
{slidBoxContent === PREVIEW && !isTemplateArchived && (
|
|
218
219
|
<CapButton onClick={onEditTemplate} type="secondary">
|
|
219
220
|
<FormattedMessage {...messages.creativesTemplatesEdit} />
|
|
220
221
|
</CapButton>
|
|
@@ -227,6 +228,7 @@ SlideBoxFooter.propTypes = {
|
|
|
227
228
|
slidBoxContent: PropTypes.node,
|
|
228
229
|
onSave: PropTypes.func,
|
|
229
230
|
onEditTemplate: PropTypes.func,
|
|
231
|
+
isTemplateArchived: PropTypes.bool,
|
|
230
232
|
onCreateNextStep: PropTypes.func,
|
|
231
233
|
shouldShowContinueFooter: PropTypes.func,
|
|
232
234
|
shouldShowDoneFooter: PropTypes.func,
|
|
@@ -260,6 +260,10 @@ export class Creatives extends React.Component {
|
|
|
260
260
|
};
|
|
261
261
|
|
|
262
262
|
onEditTemplate = () => {
|
|
263
|
+
if (this.props.templateData && this.props.templateData.isArchived) {
|
|
264
|
+
CapNotification.error({ message: this.props.intl.formatMessage(messages.cannotEditArchivedTemplate) });
|
|
265
|
+
return;
|
|
266
|
+
}
|
|
263
267
|
this.setState({ slidBoxContent: 'editTemplate', showSlideBox: true, templateNameExists: true });
|
|
264
268
|
};
|
|
265
269
|
|
|
@@ -966,13 +970,10 @@ export class Creatives extends React.Component {
|
|
|
966
970
|
case constants.EMAIL:
|
|
967
971
|
if (template?.value?.base) {
|
|
968
972
|
let emailBase = template.value.base;
|
|
969
|
-
const { html_content
|
|
973
|
+
const { html_content } = emailBase || {};
|
|
970
974
|
if (!html_content) {
|
|
971
975
|
emailBase = templateRecords.base;
|
|
972
976
|
}
|
|
973
|
-
if (!emailBase.drag_drop_id && formDragDropId) {
|
|
974
|
-
emailBase = { ...emailBase, drag_drop_id: formDragDropId };
|
|
975
|
-
}
|
|
976
977
|
const newHtmlContent = await updateImagesInHtml(html_content);
|
|
977
978
|
templateData = {
|
|
978
979
|
...templateData, ...emailBase, emailBody: newHtmlContent, emailSubject: (emailBase && emailBase.subject) ? emailBase.subject : '',
|
|
@@ -2139,6 +2140,7 @@ export class Creatives extends React.Component {
|
|
|
2139
2140
|
onSave={this.saveMessage}
|
|
2140
2141
|
onDiscard={this.discardMessage}
|
|
2141
2142
|
onEditTemplate={this.onEditTemplate}
|
|
2143
|
+
isTemplateArchived={!!(this.props.templateData && this.props.templateData.isArchived)}
|
|
2142
2144
|
slidBoxContent={slidBoxContent}
|
|
2143
2145
|
onCreateNextStep={this.onCreateNextStep}
|
|
2144
2146
|
currentChannel={currentChannel.toUpperCase()}
|
|
@@ -390,4 +390,8 @@ export default defineMessages({
|
|
|
390
390
|
id: `${scope}.personalizationTokensErrorMessage`,
|
|
391
391
|
defaultMessage: `Personalization tags are not supported for anonymous customers, please remove the tags.`,
|
|
392
392
|
},
|
|
393
|
+
"cannotEditArchivedTemplate": {
|
|
394
|
+
id: `${scope}.cannotEditArchivedTemplate`,
|
|
395
|
+
defaultMessage: 'Cannot edit an archived template. Please unarchive it first.',
|
|
396
|
+
},
|
|
393
397
|
});
|
|
@@ -295,6 +295,7 @@ exports[`Test SlideBoxContent container campaign message, whatsapp edit all data
|
|
|
295
295
|
isEmptyContent={false}
|
|
296
296
|
isFullMode={false}
|
|
297
297
|
isLiquidValidationError={false}
|
|
298
|
+
isTemplateArchived={false}
|
|
298
299
|
isTemplateNameEmpty={false}
|
|
299
300
|
onCreateNextStep={[Function]}
|
|
300
301
|
onDiscard={[Function]}
|
|
@@ -434,6 +435,7 @@ exports[`Test SlideBoxContent container campaign message, whatsapp edit min data
|
|
|
434
435
|
isEmptyContent={false}
|
|
435
436
|
isFullMode={false}
|
|
436
437
|
isLiquidValidationError={false}
|
|
438
|
+
isTemplateArchived={false}
|
|
437
439
|
isTemplateNameEmpty={false}
|
|
438
440
|
onCreateNextStep={[Function]}
|
|
439
441
|
onDiscard={[Function]}
|
|
@@ -573,6 +575,7 @@ exports[`Test SlideBoxContent container it should clear the url, on channel chan
|
|
|
573
575
|
isEmptyContent={false}
|
|
574
576
|
isFullMode={false}
|
|
575
577
|
isLiquidValidationError={false}
|
|
578
|
+
isTemplateArchived={false}
|
|
576
579
|
isTemplateNameEmpty={false}
|
|
577
580
|
onCreateNextStep={[Function]}
|
|
578
581
|
onDiscard={[Function]}
|
|
@@ -224,7 +224,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
224
224
|
|| _.get(this.props.Templates.BEETemplate, 'versions.base.drag_drop_id')
|
|
225
225
|
|| _.get(this.props.Templates.BEETemplate, 'versions.base.id')
|
|
226
226
|
|| this.props.Templates.BEETemplate?._id;
|
|
227
|
-
console.log('[Rafeeq manzoor] comes here 1');
|
|
228
227
|
this.props.actions.getCmsSetting(BEE_PLUGIN, dragDropId, 'open', undefined, isBEESupport, isBEEAppEnable);
|
|
229
228
|
} else if (this.props.location.query.module !== "library" || (this.props.location.query.module === "library" && !this.props.templateData)) {
|
|
230
229
|
// Extract drag_drop_id - check multiple possible paths
|
|
@@ -235,7 +234,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
235
234
|
|| _.get(this.props.Templates.BEETemplate, 'versions.base.drag_drop_id')
|
|
236
235
|
|| _.get(this.props.Templates.BEETemplate, 'versions.base.id')
|
|
237
236
|
|| this.props.Templates.BEETemplate?._id;
|
|
238
|
-
console.log('[Rafeeq manzoor] comes here 2');
|
|
239
237
|
this.props.actions.getCmsSetting(BEE_PLUGIN, dragDropId, 'create', undefined, isBEESupport, isBEEAppEnable);
|
|
240
238
|
}
|
|
241
239
|
}
|
|
@@ -288,10 +286,8 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
288
286
|
|
|
289
287
|
if (this.props.params.id) {
|
|
290
288
|
const activeTabForLang = beeTemplate.versions?.base?.activeTab || 'en';
|
|
291
|
-
console.log('[Rafeeq manzoor] comes here 3');
|
|
292
289
|
this.props.actions.getCmsSetting(BEE_PLUGIN, dragDropId, 'open', activeTabForLang, isBEESupport, isBEEAppEnable);
|
|
293
290
|
} else {
|
|
294
|
-
console.log('[Rafeeq manzoor] comes here 4');
|
|
295
291
|
this.props.actions.getCmsSetting(BEE_PLUGIN, dragDropId, 'create', undefined, isBEESupport, isBEEAppEnable);
|
|
296
292
|
}
|
|
297
293
|
}
|
|
@@ -456,10 +452,8 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
456
452
|
// Extract langId from active tab
|
|
457
453
|
const activeTabForLang = beeTemplate.versions?.base?.activeTab || 'en';
|
|
458
454
|
if (hasParamsId) {
|
|
459
|
-
console.log('[Rafeeq manzoor] comes here 5');
|
|
460
455
|
this.props.actions.getCmsSetting(BEE_PLUGIN, dragDropId, 'open', activeTabForLang, isBEESupport, isBEEAppEnable);
|
|
461
456
|
} else if (nextProps.location.query.module !== "library" || (nextProps.location.query.module === "library" && !nextProps.templateData)) {
|
|
462
|
-
console.log('[Rafeeq manzoor] comes here 6');
|
|
463
457
|
this.props.actions.getCmsSetting(BEE_PLUGIN, dragDropId, 'create', undefined, isBEESupport, isBEEAppEnable);
|
|
464
458
|
}
|
|
465
459
|
}
|
|
@@ -1244,7 +1238,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1244
1238
|
// formData.base.activeTab = language;
|
|
1245
1239
|
// }
|
|
1246
1240
|
if (language && editData.versions.base[language].is_drag_drop && isBEEAppEnable) {
|
|
1247
|
-
console.log('[Rafeeq manzoor] comes here 7');
|
|
1248
1241
|
this.props.actions.getCmsSetting(BEE_PLUGIN, editData._id, 'open', language, isBEESupport, isBEEAppEnable);
|
|
1249
1242
|
}
|
|
1250
1243
|
});
|
|
@@ -1468,7 +1461,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1468
1461
|
const currentTab = this.state.currentTab - 1;
|
|
1469
1462
|
const baseLanguage = this.props.currentOrgDetails.basic_details.base_language ? this.props.currentOrgDetails.basic_details.base_language : 'en';
|
|
1470
1463
|
if (formData[currentTab][baseLanguage].is_drag_drop && isBEEAppEnable) {
|
|
1471
|
-
console.log('[Rafeeq manzoor] comes here 8');
|
|
1472
1464
|
this.props.actions.getCmsSetting(BEE_PLUGIN, formData[currentTab][baseLanguage].drag_drop_id, 'duplicate', baseLanguage, isEdmSupport, isBEEAppEnable);
|
|
1473
1465
|
}
|
|
1474
1466
|
});
|
|
@@ -1647,9 +1639,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1647
1639
|
if (content.id) {
|
|
1648
1640
|
tmpData.id = content.id;
|
|
1649
1641
|
}
|
|
1650
|
-
if (content.drag_drop_id) {
|
|
1651
|
-
tmpData.drag_drop_id = content.drag_drop_id;
|
|
1652
|
-
}
|
|
1653
1642
|
}
|
|
1654
1643
|
newFormData.base = _.cloneDeep(tmpData);
|
|
1655
1644
|
newFormData.secondary_templates.push({template_data: tmpData});
|
|
@@ -2526,7 +2515,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2526
2515
|
const isBEEAppEnable = this.checkBeeEditorAllowedForLibrary();
|
|
2527
2516
|
if (templates.drag_drop_id && isBEEAppEnable) {
|
|
2528
2517
|
tempData.drag_drop_id = templates.drag_drop_id;
|
|
2529
|
-
console.log('[Rafeeq manzoor] comes here 9');
|
|
2530
2518
|
this.props.actions.getCmsSetting(BEE_PLUGIN, tempData._id, 'open', tempData.iso_code, isEdmSupport, isBEEAppEnable);
|
|
2531
2519
|
}
|
|
2532
2520
|
// formData.usingTabContainer = true;
|
|
@@ -2547,17 +2535,13 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2547
2535
|
});
|
|
2548
2536
|
this.addLanguage(false, formData, false, additionalLanguages);
|
|
2549
2537
|
}
|
|
2550
|
-
console.log("[Rafeeq manzoor] comes here lib 1", formData[0])
|
|
2551
2538
|
formData.base = _.cloneDeep(formData[0]);
|
|
2552
2539
|
if (formData?.['template-subject'] !== '') {
|
|
2553
|
-
console.log("[Rafeeq manzoor] comes here lib 1 if", formData)
|
|
2554
2540
|
this.setState({formData, loading: false, injectedTags: data.tags, tabKey, isDragDrop: (data.base.is_drag_drop !== 0 )}, () => {
|
|
2555
2541
|
// this.setState({tabKey: ''});
|
|
2556
2542
|
const isBEEEnable = this.checkBeeEditorAllowedForLibrary();
|
|
2557
|
-
console.log("[Rafeeq manzoor] comes here lib 1 isBEEEnable", isBEEEnable)
|
|
2558
2543
|
_.forEach(formData[0].selectedLanguages, (language) => {
|
|
2559
2544
|
if (formData[0][language].is_drag_drop && isBEEEnable) {
|
|
2560
|
-
console.log('[Rafeeq manzoor] comes here 10');
|
|
2561
2545
|
this.props.actions.getCmsSetting(BEE_PLUGIN, formData[0][language].drag_drop_id, 'open', language, isEdmSupport, isBEEEnable);
|
|
2562
2546
|
}
|
|
2563
2547
|
});
|
|
@@ -2900,7 +2884,6 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
2900
2884
|
// let getQuery = '';
|
|
2901
2885
|
const isEdmSupport = (this.props.location.query.isEdmSupport !== "false") || false;
|
|
2902
2886
|
const isBEEAppEnable = this.checkBeeEditorAllowedForLibrary();
|
|
2903
|
-
console.log('[Rafeeq manzoor] comes here 11');
|
|
2904
2887
|
this.props.actions.getCmsSetting(BEE_PLUGIN, data._id, 'create', this.state.formData[this.state.currentTab - 1].activeTab, isEdmSupport, isBEEAppEnable);
|
|
2905
2888
|
// this.props.templatesActions.setEdmTemplate(data);
|
|
2906
2889
|
this.toggleEdmEmailTemplateSelection();
|
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
import React, { useMemo } from 'react';
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
|
+
import zaloillustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
|
|
4
|
+
import inAppIllustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
|
|
5
|
+
import { FormattedMessage } from 'react-intl';
|
|
6
|
+
import { CapIllustration } from "@capillarytech/cap-ui-library";
|
|
3
7
|
import emailIllustration from '../Assets/images/emailIllustration.svg';
|
|
4
8
|
import smsIllustration from '../Assets/images/smsIllustration.svg';
|
|
5
9
|
import pushIllustration from '../Assets/images/pushIllustration.svg';
|
|
@@ -8,13 +12,12 @@ import lineIllustration from '../Assets/images/lineIllustration.svg';
|
|
|
8
12
|
import facebookIllustration from '../Assets/images/facebookIllustration.svg';
|
|
9
13
|
import whatsappIllustration from '../Assets/images/whatsappIllustration.png';
|
|
10
14
|
import whatsappOrZaloAccountIllustration from '../Assets/images/whatsappOrZaloAccountIllustration.svg';
|
|
15
|
+
import archiveEmptyStateIllustration from '../Assets/images/archive_Empty_Illustration.svg';
|
|
11
16
|
import rcsIllustration from '../Assets/images/rcsIllustration.png';
|
|
12
|
-
import zaloillustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
|
|
13
|
-
import inAppIllustration from '@capillarytech/cap-ui-library/assets/images/featureUiNotEnabledIllustration.svg';
|
|
14
17
|
import messages from './messages';
|
|
15
|
-
import {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
+
import {
|
|
19
|
+
MOBILE_PUSH, SMS, EMAIL, LINE, VIBER, FACEBOOK, WHATSAPP, RCS, ZALO, INAPP, WEBPUSH,
|
|
20
|
+
} from '../CreativesContainer/constants';
|
|
18
21
|
|
|
19
22
|
|
|
20
23
|
// Configuration object for channel types
|
|
@@ -80,7 +83,8 @@ function ChannelTypeIllustration(props) {
|
|
|
80
83
|
isFullMode,
|
|
81
84
|
createTemplate,
|
|
82
85
|
currentChannel,
|
|
83
|
-
hostName
|
|
86
|
+
hostName,
|
|
87
|
+
isArchivedMode,
|
|
84
88
|
} = props;
|
|
85
89
|
|
|
86
90
|
const templateText = useMemo(() => {
|
|
@@ -88,6 +92,18 @@ function ChannelTypeIllustration(props) {
|
|
|
88
92
|
return isFullMode ? templateIntlMsg : '';
|
|
89
93
|
}, [isFullMode]);
|
|
90
94
|
|
|
95
|
+
if (isArchivedMode) {
|
|
96
|
+
return (
|
|
97
|
+
<CapIllustration
|
|
98
|
+
illustrationImage={archiveEmptyStateIllustration}
|
|
99
|
+
title={<FormattedMessage {...messages.noArchivedCreatives} />}
|
|
100
|
+
description={<FormattedMessage {...messages.noArchivedCreativesDesc} />}
|
|
101
|
+
descriptionPosition="bottom"
|
|
102
|
+
descriptionClassName="illustration-desc archive-illustration"
|
|
103
|
+
/>
|
|
104
|
+
);
|
|
105
|
+
}
|
|
106
|
+
|
|
91
107
|
const getChannelTypeIllustrationInfo = (type, hostName) => {
|
|
92
108
|
// Handle special cases with hostName dependency
|
|
93
109
|
if (type === WHATSAPP) {
|
|
@@ -196,5 +212,6 @@ ChannelTypeIllustration.propTypes = {
|
|
|
196
212
|
createTemplate: PropTypes.func.isRequired,
|
|
197
213
|
currentChannel: PropTypes.string,
|
|
198
214
|
hostName: PropTypes.string,
|
|
215
|
+
isArchivedMode: PropTypes.bool,
|
|
199
216
|
};
|
|
200
217
|
export default ChannelTypeIllustration;
|
|
@@ -1,34 +1,22 @@
|
|
|
1
1
|
@import '~@capillarytech/cap-ui-library/styles/_variables.scss';
|
|
2
2
|
|
|
3
3
|
.ant-tabs-content{
|
|
4
|
-
margin-top:
|
|
4
|
+
margin-top: $CAP_SPACE_16;
|
|
5
5
|
.ant-tabs-tabpane-active{
|
|
6
6
|
padding: unset;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
@media screen and (min-width: 1172px) {
|
|
25
|
-
.creatives-templates-list.full-mode{
|
|
26
|
-
.v2-pagination-container {
|
|
27
|
-
.cap-custom-card-list-row {
|
|
28
|
-
.cap-custom-card-list-col{
|
|
29
|
-
&:nth-child(4n+4) { //every 4th child
|
|
30
|
-
margin-right: unset;
|
|
31
|
-
}
|
|
10
|
+
// 3 cards per row across all breakpoints
|
|
11
|
+
.creatives-templates-list {
|
|
12
|
+
.v2-pagination-container,
|
|
13
|
+
.v2-pagination-container-half {
|
|
14
|
+
.cap-custom-card-list-row {
|
|
15
|
+
.cap-custom-card-list-col {
|
|
16
|
+
width: calc(33.33% - #{$CAP_SPACE_08});
|
|
17
|
+
margin-right: $CAP_SPACE_12;
|
|
18
|
+
&:nth-child(3n) {
|
|
19
|
+
margin-right: 0;
|
|
32
20
|
}
|
|
33
21
|
}
|
|
34
22
|
}
|
|
@@ -674,6 +662,32 @@
|
|
|
674
662
|
font-size: 14px;
|
|
675
663
|
}
|
|
676
664
|
|
|
665
|
+
// Archive/Unarchive confirm modal overrides — scoped to avoid affecting other modals
|
|
666
|
+
.archive-confirm-modal {
|
|
667
|
+
// Remove the left margin added when an icon is present
|
|
668
|
+
.ant-modal-confirm-body {
|
|
669
|
+
> .anticon + .ant-modal-confirm-title + .ant-modal-confirm-content {
|
|
670
|
+
margin-left: 0;
|
|
671
|
+
}
|
|
672
|
+
}
|
|
673
|
+
|
|
674
|
+
// Left-align buttons, remove float
|
|
675
|
+
.ant-modal-confirm-btns {
|
|
676
|
+
float: none;
|
|
677
|
+
display: flex;
|
|
678
|
+
align-items: center;
|
|
679
|
+
gap: $CAP_SPACE_08;
|
|
680
|
+
margin-top: $CAP_SPACE_16;
|
|
681
|
+
|
|
682
|
+
// Cancel button styling
|
|
683
|
+
.ant-btn:not(.ant-btn-primary) {
|
|
684
|
+
background-color: $CAP_G08;
|
|
685
|
+
border-color: $CAP_G08;
|
|
686
|
+
color: $CAP_G01;
|
|
687
|
+
}
|
|
688
|
+
}
|
|
689
|
+
}
|
|
690
|
+
|
|
677
691
|
.popover-action-container {
|
|
678
692
|
line-height: 24px;
|
|
679
693
|
}
|
|
@@ -1101,4 +1115,96 @@
|
|
|
1101
1115
|
.inapp-illustration-parent {
|
|
1102
1116
|
height: "calc(100vh - 325px)";
|
|
1103
1117
|
overflow: 'auto';
|
|
1104
|
-
}
|
|
1118
|
+
}
|
|
1119
|
+
|
|
1120
|
+
// Archive feature layout classes
|
|
1121
|
+
.illustration-scroll-wrapper {
|
|
1122
|
+
height: calc(100vh - 20.3125rem);
|
|
1123
|
+
overflow: auto;
|
|
1124
|
+
}
|
|
1125
|
+
|
|
1126
|
+
.filter-row {
|
|
1127
|
+
display: flex;
|
|
1128
|
+
align-items: center;
|
|
1129
|
+
justify-content: space-between;
|
|
1130
|
+
width: 100%;
|
|
1131
|
+
}
|
|
1132
|
+
|
|
1133
|
+
.filter-row-content {
|
|
1134
|
+
flex: 1;
|
|
1135
|
+
}
|
|
1136
|
+
|
|
1137
|
+
.bulk-selection-bar {
|
|
1138
|
+
display: flex;
|
|
1139
|
+
align-items: center;
|
|
1140
|
+
gap: $CAP_SPACE_12;
|
|
1141
|
+
flex-shrink: 0;
|
|
1142
|
+
}
|
|
1143
|
+
|
|
1144
|
+
.archived-mode-header {
|
|
1145
|
+
display: flex;
|
|
1146
|
+
align-items: center;
|
|
1147
|
+
gap: $CAP_SPACE_12;
|
|
1148
|
+
margin-bottom: $CAP_SPACE_16;
|
|
1149
|
+
|
|
1150
|
+
.archived-mode-back-icon {
|
|
1151
|
+
cursor: pointer;
|
|
1152
|
+
font-size: 1.428rem;
|
|
1153
|
+
}
|
|
1154
|
+
}
|
|
1155
|
+
|
|
1156
|
+
.archived-tag {
|
|
1157
|
+
margin-left: $CAP_SPACE_08;
|
|
1158
|
+
font-size: 0.786rem;
|
|
1159
|
+
}
|
|
1160
|
+
|
|
1161
|
+
.popover-archive-action {
|
|
1162
|
+
cursor: pointer;
|
|
1163
|
+
padding: $CAP_SPACE_08 0;
|
|
1164
|
+
}
|
|
1165
|
+
|
|
1166
|
+
.archive-menu-item {
|
|
1167
|
+
display: inline-flex;
|
|
1168
|
+
align-items: center;
|
|
1169
|
+
gap: $CAP_SPACE_08;
|
|
1170
|
+
margin-top: 1rem;
|
|
1171
|
+
}
|
|
1172
|
+
|
|
1173
|
+
.archive-btn-label {
|
|
1174
|
+
margin-right: 0.714rem;
|
|
1175
|
+
}
|
|
1176
|
+
|
|
1177
|
+
.bulk-selection-bar .cap-button-v2-prefix {
|
|
1178
|
+
margin-top: 1rem;
|
|
1179
|
+
}
|
|
1180
|
+
|
|
1181
|
+
.bulk-selection-bar .ant-btn.cap-button-v2 > .cap-button-v2-prefix + span {
|
|
1182
|
+
margin-left: -$CAP_SPACE_06;
|
|
1183
|
+
}
|
|
1184
|
+
|
|
1185
|
+
.template-card-top-bar {
|
|
1186
|
+
display: flex;
|
|
1187
|
+
align-items: center;
|
|
1188
|
+
justify-content: space-between;
|
|
1189
|
+
padding: $CAP_SPACE_08 $CAP_SPACE_12 0;
|
|
1190
|
+
}
|
|
1191
|
+
|
|
1192
|
+
.template-listing-header-actions {
|
|
1193
|
+
display: flex;
|
|
1194
|
+
justify-content: space-between;
|
|
1195
|
+
align-items: center;
|
|
1196
|
+
gap: $CAP_SPACE_08;
|
|
1197
|
+
}
|
|
1198
|
+
|
|
1199
|
+
.template-listing-more-btn {
|
|
1200
|
+
padding: 0 $CAP_SPACE_08;
|
|
1201
|
+
min-width: auto;
|
|
1202
|
+
}
|
|
1203
|
+
|
|
1204
|
+
.notification-template-label {
|
|
1205
|
+
color: #5E6C84;
|
|
1206
|
+
}
|
|
1207
|
+
|
|
1208
|
+
.notification-template-name {
|
|
1209
|
+
color: #091E42;
|
|
1210
|
+
}
|
|
@@ -167,3 +167,39 @@ export function getCdnTransformationConfig() {
|
|
|
167
167
|
type: types.GET_CDN_TRANSFORMATION_CONFIG_REQUEST,
|
|
168
168
|
};
|
|
169
169
|
}
|
|
170
|
+
|
|
171
|
+
export function archiveTemplate(channel, id, templateName) {
|
|
172
|
+
return { type: types.ARCHIVE_TEMPLATE_REQUEST, channel, id, templateName };
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
export function unarchiveTemplate(channel, id, templateName) {
|
|
176
|
+
return { type: types.UNARCHIVE_TEMPLATE_REQUEST, channel, id, templateName };
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
export function bulkArchiveTemplates(channel, ids) {
|
|
180
|
+
return { type: types.BULK_ARCHIVE_REQUEST, channel, ids };
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
export function bulkUnarchiveTemplates(channel, ids) {
|
|
184
|
+
return { type: types.BULK_UNARCHIVE_REQUEST, channel, ids };
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
export function setArchiveFilter(filter) {
|
|
188
|
+
return { type: types.SET_ARCHIVE_FILTER, filter };
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
export function toggleTemplateSelection(id) {
|
|
192
|
+
return { type: types.TOGGLE_TEMPLATE_SELECTION, id };
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
export function selectAllTemplates(ids) {
|
|
196
|
+
return { type: types.SELECT_ALL_TEMPLATES, ids };
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
export function clearTemplateSelection() {
|
|
200
|
+
return { type: types.CLEAR_TEMPLATE_SELECTION };
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
export function setArchivedMode(isArchived) {
|
|
204
|
+
return { type: types.SET_ARCHIVED_MODE, isArchived };
|
|
205
|
+
}
|
|
@@ -91,3 +91,26 @@ export const noApprovedWhatsappTemplatesDesc ='noApprovedWhatsappTemplatesDesc'
|
|
|
91
91
|
export const zaloDescIllustration='zaloDescIllustration'
|
|
92
92
|
export const noApprovedRcsTemplatesTitle='noApprovedRcsTemplatesTitle'
|
|
93
93
|
export const noApprovedRcsTemplatesDesc='noApprovedRcsTemplatesDesc'
|
|
94
|
+
|
|
95
|
+
// Archive feature
|
|
96
|
+
export const ARCHIVE_TEMPLATE_REQUEST = 'app/v2Containers/Templates/ARCHIVE_TEMPLATE_REQUEST';
|
|
97
|
+
export const ARCHIVE_TEMPLATE_SUCCESS = 'app/v2Containers/Templates/ARCHIVE_TEMPLATE_SUCCESS';
|
|
98
|
+
export const ARCHIVE_TEMPLATE_FAILURE = 'app/v2Containers/Templates/ARCHIVE_TEMPLATE_FAILURE';
|
|
99
|
+
|
|
100
|
+
export const UNARCHIVE_TEMPLATE_REQUEST = 'app/v2Containers/Templates/UNARCHIVE_TEMPLATE_REQUEST';
|
|
101
|
+
export const UNARCHIVE_TEMPLATE_SUCCESS = 'app/v2Containers/Templates/UNARCHIVE_TEMPLATE_SUCCESS';
|
|
102
|
+
export const UNARCHIVE_TEMPLATE_FAILURE = 'app/v2Containers/Templates/UNARCHIVE_TEMPLATE_FAILURE';
|
|
103
|
+
|
|
104
|
+
export const BULK_ARCHIVE_REQUEST = 'app/v2Containers/Templates/BULK_ARCHIVE_REQUEST';
|
|
105
|
+
export const BULK_ARCHIVE_SUCCESS = 'app/v2Containers/Templates/BULK_ARCHIVE_SUCCESS';
|
|
106
|
+
export const BULK_ARCHIVE_FAILURE = 'app/v2Containers/Templates/BULK_ARCHIVE_FAILURE';
|
|
107
|
+
|
|
108
|
+
export const BULK_UNARCHIVE_REQUEST = 'app/v2Containers/Templates/BULK_UNARCHIVE_REQUEST';
|
|
109
|
+
export const BULK_UNARCHIVE_SUCCESS = 'app/v2Containers/Templates/BULK_UNARCHIVE_SUCCESS';
|
|
110
|
+
export const BULK_UNARCHIVE_FAILURE = 'app/v2Containers/Templates/BULK_UNARCHIVE_FAILURE';
|
|
111
|
+
|
|
112
|
+
export const SET_ARCHIVE_FILTER = 'app/v2Containers/Templates/SET_ARCHIVE_FILTER';
|
|
113
|
+
export const TOGGLE_TEMPLATE_SELECTION = 'app/v2Containers/Templates/TOGGLE_TEMPLATE_SELECTION';
|
|
114
|
+
export const SELECT_ALL_TEMPLATES = 'app/v2Containers/Templates/SELECT_ALL_TEMPLATES';
|
|
115
|
+
export const CLEAR_TEMPLATE_SELECTION = 'app/v2Containers/Templates/CLEAR_TEMPLATE_SELECTION';
|
|
116
|
+
export const SET_ARCHIVED_MODE = 'app/v2Containers/Templates/SET_ARCHIVED_MODE';
|