@capillarytech/creatives-library 7.17.82-alpha.0 → 7.17.82

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.
Files changed (21) hide show
  1. package/containers/Cap/sagas.js +7 -5
  2. package/containers/Cap/tests/saga.test.js +81 -1
  3. package/package.json +2 -2
  4. package/v2Components/CapWhatsappQuickReply/index.js +96 -83
  5. package/v2Components/CapWhatsappQuickReply/index.scss +4 -1
  6. package/v2Components/CapWhatsappQuickReply/messages.js +4 -0
  7. package/v2Components/TemplatePreview/_templatePreview.scss +3 -0
  8. package/v2Components/TemplatePreview/index.js +10 -25
  9. package/v2Components/TemplatePreview/tests/__snapshots__/index.test.js.snap +0 -14
  10. package/v2Containers/CreativesContainer/index.js +18 -2
  11. package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxContent.test.js.snap +4 -4
  12. package/v2Containers/Templates/index.js +3 -3
  13. package/v2Containers/Whatsapp/constants.js +2 -1
  14. package/v2Containers/Whatsapp/index.js +280 -251
  15. package/v2Containers/Whatsapp/index.scss +6 -1
  16. package/v2Containers/Whatsapp/messages.js +5 -0
  17. package/v2Containers/Whatsapp/styles.scss +6 -3
  18. package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap +4586 -53228
  19. package/v2Containers/Whatsapp/tests/__snapshots__/utils.test.js.snap +20 -20
  20. package/v2Containers/Whatsapp/utils.js +13 -13
  21. package/v2Containers/mockdata.js +8 -18
package/v2Containers/Whatsapp/tests/__snapshots__/utils.test.js.snap CHANGED
@@ -2,7 +2,8 @@
2
2
 
3
3
  exports[`Test utils test getWhatsappContent 1`] = `
4
4
  Object {
5
- "buttonsData": Array [
5
+ "charCount": 151,
6
+ "ctaData": Array [
6
7
  Object {
7
8
  "index": 0,
8
9
  "phone_number": "+919738752617",
@@ -16,9 +17,8 @@ Object {
16
17
  "url": "https://docs.google.com/{{1}}",
17
18
  },
18
19
  ],
19
- "charCount": 151,
20
- "footerMsg": "",
21
- "headerMsg": "",
20
+ "templateFooterPreview": "",
21
+ "templateHeaderPreview": "",
22
22
  "templateMsg": <CapLabel
23
23
  type="label9"
24
24
  >
@@ -32,8 +32,8 @@ Click {{unsubscribe}} to unsubscribe
32
32
  exports[`Test utils test getWhatsappContent 2`] = `
33
33
  Object {
34
34
  "charCount": 36,
35
- "footerMsg": "",
36
- "headerMsg": "",
35
+ "templateFooterPreview": "",
36
+ "templateHeaderPreview": "",
37
37
  "templateMsg": <CapLabel
38
38
  type="label9"
39
39
  >
@@ -44,7 +44,8 @@ Object {
44
44
 
45
45
  exports[`Test utils test getWhatsappContent 3`] = `
46
46
  Object {
47
- "buttonsData": Array [
47
+ "charCount": 151,
48
+ "ctaData": Array [
48
49
  Object {
49
50
  "index": 0,
50
51
  "phone_number": "+919738752617",
@@ -58,9 +59,8 @@ Object {
58
59
  "url": "https://docs.google.com/{{1}}",
59
60
  },
60
61
  ],
61
- "charCount": 151,
62
- "footerMsg": "",
63
- "headerMsg": "",
62
+ "templateFooterPreview": "",
63
+ "templateHeaderPreview": "",
64
64
  "templateMsg": <CapLabel
65
65
  type="label9"
66
66
  >
@@ -73,7 +73,8 @@ Click {{unsubscribe}} to unsubscribe
73
73
 
74
74
  exports[`Test utils test getWhatsappContent 4`] = `
75
75
  Object {
76
- "buttonsData": Array [
76
+ "charCount": 151,
77
+ "ctaData": Array [
77
78
  Object {
78
79
  "index": 0,
79
80
  "phone_number": "+919738752617",
@@ -87,7 +88,6 @@ Object {
87
88
  "url": "https://docs.google.com/{{1}}",
88
89
  },
89
90
  ],
90
- "charCount": 151,
91
91
  "docPreview": <React.Fragment>
92
92
  <div
93
93
  className="pdf-img-box"
@@ -138,8 +138,8 @@ Object {
138
138
  </div>
139
139
  </div>
140
140
  </React.Fragment>,
141
- "footerMsg": "",
142
- "headerMsg": "",
141
+ "templateFooterPreview": "",
142
+ "templateHeaderPreview": "",
143
143
  "templateMsg": <CapLabel
144
144
  type="label9"
145
145
  >
@@ -152,8 +152,8 @@ Click {{unsubscribe}} to unsubscribe
152
152
  exports[`Test utils test getWhatsappContent 5`] = `
153
153
  Object {
154
154
  "charCount": -1,
155
- "footerMsg": "",
156
- "headerMsg": "",
155
+ "templateFooterPreview": "",
156
+ "templateHeaderPreview": "",
157
157
  "templateMsg": <CapLabel
158
158
  type="label9"
159
159
  >
@@ -164,7 +164,8 @@ Object {
164
164
 
165
165
  exports[`Test utils test getWhatsappContent for preview 1`] = `
166
166
  Object {
167
- "buttonsData": Array [
167
+ "charCount": 151,
168
+ "ctaData": Array [
168
169
  Object {
169
170
  "index": 0,
170
171
  "phone_number": "+919738752617",
@@ -178,9 +179,8 @@ Object {
178
179
  "url": "https://docs.google.com/{{1}}",
179
180
  },
180
181
  ],
181
- "charCount": 151,
182
- "footerMsg": "",
183
- "headerMsg": "",
182
+ "templateFooterPreview": "",
183
+ "templateHeaderPreview": "",
184
184
  "templateMsg": <CapLabel
185
185
  type="label5"
186
186
  >
package/v2Containers/Whatsapp/utils.js CHANGED
@@ -110,15 +110,15 @@ export const getWhatsappContent = (template, isPreview) => {
110
110
  }
111
111
 
112
112
  return {
113
- headerMsg: header ? <CapLabel className="whatsapp-template-header-preview">{header}</CapLabel> : '',
114
- footerMsg: header ? <CapLabel className="whatsapp-template-footer-preview">{footer}</CapLabel> : '',
113
+ templateHeaderPreview: header ? <CapLabel className="whatsapp-template-list-header-preview">{header}</CapLabel> : '',
114
+ templateFooterPreview: footer ? <CapLabel className="whatsapp-template-list-footer-preview">{footer}</CapLabel> : '',
115
115
  templateMsg: <CapLabel type={isPreview ? 'label5' : 'label9'}>{text}</CapLabel>,
116
- charCount: text?.length - 1,
116
+ charCount: text?.length - 1 + header?.length + footer?.length,
117
117
  ...(buttonType === CTA && {
118
- buttonsData,
118
+ ctaData: buttonsData
119
119
  }),
120
120
  ...(buttonType === QUICK_REPLY && {
121
- buttonsData,
121
+ quickReplyData: buttonsData
122
122
  }),
123
123
  ...mediaParams,
124
124
  };
@@ -154,31 +154,31 @@ export const getWhatsappCta = (template) => {
154
154
  return renderArray;
155
155
  };
156
156
 
157
- export const getWhatsappQuickReply= (template) => {
158
- const { buttonType = NONE, buttons = [] } = get(
157
+ // It will render all the quick reply button in mobile preview and template list
158
+ export const getWhatsappQuickReply= (template, templatePreview) => {
159
+ const { buttonType = NONE, buttons = [] } = templatePreview ? template : get(
159
160
  template,
160
161
  `versions.base.content.whatsapp`,
161
162
  {},
162
163
  );
163
164
  const renderArray = [];
164
165
  if (buttonType === QUICK_REPLY && buttons?.length) {
165
- renderArray.push(<CapDivider className="whatsapp-list-view-divider" />);
166
- buttons.forEach((quickReply, index) => {
166
+ renderArray.push(<CapDivider className={templatePreview ? "whatsapp-divider" : "whatsapp-list-view-divider"} />);
167
+ buttons?.forEach((quickReply, index) => {
167
168
  const { text } = quickReply || {};
168
169
  if (text) {
169
170
  renderArray.push(
170
- <CapLabel type="label21" className="whatsapp-list-cta-preview">
171
+ <CapLabel type="label21" className={templatePreview ? "whatsapp-cta-preview" : "whatsapp-list-quick-reply-preview"}>
171
172
  <CapIcon
172
173
  type='small-link'
173
174
  size="xs"
174
- svgProps={{ style: { marginRight: '4px' } }}
175
175
  />
176
176
  {text}
177
177
  </CapLabel>
178
178
  )
179
179
  }
180
- if (index < buttons.length -1) {
181
- renderArray.push(<CapDivider className="whatsapp-list-view-divider" />);
180
+ if (index < buttons?.length -1) {
181
+ renderArray.push(<CapDivider className={templatePreview ? "whatsapp-divider" : "whatsapp-list-view-divider"} />);
182
182
  }
183
183
  })
184
184
  }
package/v2Containers/mockdata.js CHANGED
@@ -1473,7 +1473,7 @@ export default {
1473
1473
  totalCount: 7,
1474
1474
  },
1475
1475
  whatsappPreviewTemplateData3Result: {
1476
- buttonsData: [
1476
+ quickReplyData: [
1477
1477
  {
1478
1478
  index: 0,
1479
1479
  type: "QUICK_REPLY",
@@ -1485,14 +1485,14 @@ export default {
1485
1485
  text: "Not Interested",
1486
1486
  },
1487
1487
  ],
1488
- charCount: 30,
1489
- footerMsg: (
1490
- <CapLabel className="whatsapp-template-footer-preview" type="label1">
1488
+ charCount: 49,
1489
+ templateFooterPreview: (
1490
+ <CapLabel className="whatsapp-template-list-footer-preview" type="label1">
1491
1491
  Thanks
1492
1492
  </CapLabel>
1493
1493
  ),
1494
- headerMsg: (
1495
- <CapLabel className="whatsapp-template-header-preview" type="label1">
1494
+ templateHeaderPreview: (
1495
+ <CapLabel className="whatsapp-template-list-header-preview" type="label1">
1496
1496
  Hello welcome
1497
1497
  </CapLabel>
1498
1498
  ),
@@ -1502,27 +1502,17 @@ export default {
1502
1502
  },
1503
1503
  whatsappPreviewTemplateData3QuickReplyResult: [
1504
1504
  <CapDivider className="whatsapp-list-view-divider" />,
1505
- <CapLabel className="whatsapp-list-cta-preview" type="label21">
1505
+ <CapLabel className="whatsapp-list-quick-reply-preview" type="label21">
1506
1506
  <CapIcon
1507
1507
  size="xs"
1508
- svgProps={{
1509
- style: {
1510
- marginRight: "4px",
1511
- },
1512
- }}
1513
1508
  type="small-link"
1514
1509
  />
1515
1510
  Interested
1516
1511
  </CapLabel>,
1517
1512
  <CapDivider className="whatsapp-list-view-divider" />,
1518
- <CapLabel className="whatsapp-list-cta-preview" type="label21">
1513
+ <CapLabel className="whatsapp-list-quick-reply-preview" type="label21">
1519
1514
  <CapIcon
1520
1515
  size="xs"
1521
- svgProps={{
1522
- style: {
1523
- marginRight: "4px",
1524
- },
1525
- }}
1526
1516
  type="small-link"
1527
1517
  />
1528
1518
  Not Interested