@capillarytech/creatives-library 8.0.353-alpha.6 → 8.0.354

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 (127) hide show
  1. package/constants/unified.js +0 -29
  2. package/index.html +1 -0
  3. package/package.json +1 -1
  4. package/services/tests/api.test.js +20 -35
  5. package/utils/cdnTransformation.js +63 -3
  6. package/utils/commonUtils.js +1 -19
  7. package/utils/tests/cdnTransformation.test.js +111 -0
  8. package/v2Components/CapActionButton/constants.js +0 -7
  9. package/v2Components/CapActionButton/index.js +108 -166
  10. package/v2Components/CapActionButton/index.scss +6 -157
  11. package/v2Components/CapActionButton/messages.js +3 -19
  12. package/v2Components/CapActionButton/tests/index.test.js +17 -41
  13. package/v2Components/CapTagList/index.js +0 -10
  14. package/v2Components/CommonTestAndPreview/CustomValuesEditor.js +49 -72
  15. package/v2Components/CommonTestAndPreview/DeliverySettings/DeliverySettings.scss +2 -8
  16. package/v2Components/CommonTestAndPreview/DeliverySettings/ModifyDeliverySettings.js +21 -213
  17. package/v2Components/CommonTestAndPreview/DeliverySettings/constants.js +0 -16
  18. package/v2Components/CommonTestAndPreview/DeliverySettings/index.js +10 -85
  19. package/v2Components/CommonTestAndPreview/DeliverySettings/messages.js +0 -30
  20. package/v2Components/CommonTestAndPreview/DeliverySettings/utils/parseSenderDetailsResponse.js +11 -79
  21. package/v2Components/CommonTestAndPreview/SendTestMessage.js +5 -10
  22. package/v2Components/CommonTestAndPreview/UnifiedPreview/RcsPreviewContent.js +15 -157
  23. package/v2Components/CommonTestAndPreview/UnifiedPreview/_unifiedPreview.scss +76 -346
  24. package/v2Components/CommonTestAndPreview/UnifiedPreview/index.js +4 -133
  25. package/v2Components/CommonTestAndPreview/_commonTestAndPreview.scss +0 -11
  26. package/v2Components/CommonTestAndPreview/constants.js +2 -38
  27. package/v2Components/CommonTestAndPreview/index.js +186 -691
  28. package/v2Components/CommonTestAndPreview/messages.js +3 -45
  29. package/v2Components/CommonTestAndPreview/sagas.js +6 -25
  30. package/v2Components/CommonTestAndPreview/tests/CustomValuesEditor.test.js +284 -308
  31. package/v2Components/CommonTestAndPreview/tests/DeliverySettings/ModifyDeliverySettings.test.js +65 -231
  32. package/v2Components/CommonTestAndPreview/tests/DeliverySettings/index.test.js +5 -118
  33. package/v2Components/CommonTestAndPreview/tests/DeliverySettings/utils/parseSenderDetailsResponse.test.js +0 -341
  34. package/v2Components/CommonTestAndPreview/tests/PreviewSection.test.js +1 -8
  35. package/v2Components/CommonTestAndPreview/tests/SendTestMessage.test.js +13 -34
  36. package/v2Components/CommonTestAndPreview/tests/UnifiedPreview/RcsPreviewContent.test.js +283 -281
  37. package/v2Components/CommonTestAndPreview/tests/UnifiedPreview/index.test.js +1 -199
  38. package/v2Components/CommonTestAndPreview/tests/index.test.js +4 -132
  39. package/v2Components/CommonTestAndPreview/tests/sagas.test.js +26 -36
  40. package/v2Components/FormBuilder/index.js +6 -11
  41. package/v2Components/TemplatePreview/_templatePreview.scss +23 -38
  42. package/v2Components/TemplatePreview/index.js +31 -143
  43. package/v2Components/TemplatePreview/tests/index.test.js +0 -142
  44. package/v2Components/TestAndPreviewSlidebox/index.js +1 -13
  45. package/v2Components/TestAndPreviewSlidebox/sagas.js +4 -11
  46. package/v2Components/TestAndPreviewSlidebox/tests/saga.test.js +1 -3
  47. package/v2Containers/CreativesContainer/SlideBoxContent.js +4 -36
  48. package/v2Containers/CreativesContainer/SlideBoxFooter.js +1 -10
  49. package/v2Containers/CreativesContainer/SlideBoxHeader.js +4 -29
  50. package/v2Containers/CreativesContainer/constants.js +0 -9
  51. package/v2Containers/CreativesContainer/index.js +103 -322
  52. package/v2Containers/CreativesContainer/index.scss +1 -51
  53. package/v2Containers/CreativesContainer/tests/SlideBoxFooter.test.js +34 -78
  54. package/v2Containers/CreativesContainer/tests/SlideBoxHeader.test.js +16 -79
  55. package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxContent.test.js.snap +0 -8
  56. package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxHeader.test.js.snap +98 -357
  57. package/v2Containers/CreativesContainer/tests/__snapshots__/index.test.js.snap +15 -20
  58. package/v2Containers/CreativesContainer/tests/index.test.js +9 -71
  59. package/v2Containers/MobilePush/Create/test/saga.test.js +2 -2
  60. package/v2Containers/Rcs/constants.js +10 -119
  61. package/v2Containers/Rcs/index.js +818 -2450
  62. package/v2Containers/Rcs/index.scss +8 -280
  63. package/v2Containers/Rcs/messages.js +3 -34
  64. package/v2Containers/Rcs/tests/__snapshots__/index.test.js.snap +70073 -98018
  65. package/v2Containers/Rcs/tests/__snapshots__/utils.test.js.snap +5 -0
  66. package/v2Containers/Rcs/tests/index.test.js +121 -152
  67. package/v2Containers/Rcs/tests/mockData.js +0 -38
  68. package/v2Containers/Rcs/tests/utils.test.js +30 -646
  69. package/v2Containers/Rcs/utils.js +11 -478
  70. package/v2Containers/Sms/Create/index.js +40 -106
  71. package/v2Containers/SmsTrai/Create/index.js +4 -9
  72. package/v2Containers/SmsTrai/Edit/constants.js +0 -2
  73. package/v2Containers/SmsTrai/Edit/index.js +130 -640
  74. package/v2Containers/SmsTrai/Edit/messages.js +4 -14
  75. package/v2Containers/SmsTrai/Edit/tests/__snapshots__/index.test.js.snap +2296 -4249
  76. package/v2Containers/SmsWrapper/index.js +8 -37
  77. package/v2Containers/TagList/index.js +0 -6
  78. package/v2Containers/Templates/_templates.scss +9 -166
  79. package/v2Containers/Templates/actions.js +0 -11
  80. package/v2Containers/Templates/constants.js +0 -2
  81. package/v2Containers/Templates/index.js +52 -120
  82. package/v2Containers/Templates/sagas.js +18 -57
  83. package/v2Containers/Templates/tests/__snapshots__/index.test.js.snap +1017 -1062
  84. package/v2Containers/Templates/tests/sagas.test.js +39 -205
  85. package/v2Containers/TemplatesV2/TemplatesV2.style.js +1 -72
  86. package/v2Containers/TemplatesV2/index.js +23 -86
  87. package/v2Containers/WeChat/MapTemplates/test/saga.test.js +9 -9
  88. package/v2Containers/Whatsapp/index.js +20 -3
  89. package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap +34 -578
  90. package/utils/rcsPayloadUtils.js +0 -92
  91. package/utils/templateVarUtils.js +0 -201
  92. package/utils/tests/rcsPayloadUtils.test.js +0 -226
  93. package/utils/tests/templateVarUtils.test.js +0 -204
  94. package/v2Components/CommonTestAndPreview/previewApiUtils.js +0 -59
  95. package/v2Components/CommonTestAndPreview/tests/previewApiUtils.test.js +0 -67
  96. package/v2Components/SmsFallback/SmsFallbackLocalSelector.js +0 -91
  97. package/v2Components/SmsFallback/constants.js +0 -73
  98. package/v2Components/SmsFallback/index.js +0 -956
  99. package/v2Components/SmsFallback/index.scss +0 -265
  100. package/v2Components/SmsFallback/messages.js +0 -78
  101. package/v2Components/SmsFallback/smsFallbackUtils.js +0 -119
  102. package/v2Components/SmsFallback/tests/SmsFallbackLocalSelector.test.js +0 -50
  103. package/v2Components/SmsFallback/tests/rcsSmsFallback.acceptance.test.js +0 -147
  104. package/v2Components/SmsFallback/tests/smsFallbackHandlers.test.js +0 -304
  105. package/v2Components/SmsFallback/tests/smsFallbackUi.test.js +0 -223
  106. package/v2Components/SmsFallback/tests/smsFallbackUtils.test.js +0 -309
  107. package/v2Components/SmsFallback/tests/useLocalTemplateList.test.js +0 -422
  108. package/v2Components/SmsFallback/useLocalTemplateList.js +0 -92
  109. package/v2Components/TemplatePreview/constants.js +0 -2
  110. package/v2Components/VarSegmentMessageEditor/constants.js +0 -2
  111. package/v2Components/VarSegmentMessageEditor/index.js +0 -125
  112. package/v2Components/VarSegmentMessageEditor/index.scss +0 -46
  113. package/v2Containers/CreativesContainer/CreativesSlideBoxWrapper.js +0 -43
  114. package/v2Containers/CreativesContainer/embeddedSlideboxUtils.js +0 -79
  115. package/v2Containers/CreativesContainer/tests/SlideBoxContent.localTemplates.test.js +0 -90
  116. package/v2Containers/CreativesContainer/tests/embeddedSlideboxUtils.test.js +0 -258
  117. package/v2Containers/CreativesContainer/tests/useLocalTemplatesProp.test.js +0 -125
  118. package/v2Containers/Rcs/rcsLibraryHydrationUtils.js +0 -225
  119. package/v2Containers/Rcs/tests/rcsLibraryHydrationUtils.test.js +0 -318
  120. package/v2Containers/Sms/smsFormDataHelpers.js +0 -67
  121. package/v2Containers/Sms/tests/smsFormDataHelpers.test.js +0 -253
  122. package/v2Containers/SmsTrai/Edit/index.scss +0 -121
  123. package/v2Containers/Templates/TemplatesActionBar.js +0 -101
  124. package/v2Containers/Templates/tests/TemplatesActionBar.test.js +0 -120
  125. package/v2Containers/Templates/tests/smsTemplatesListApi.test.js +0 -180
  126. package/v2Containers/Templates/utils/smsTemplatesListApi.js +0 -79
  127. package/v2Containers/TemplatesV2/tests/TemplatesV2.localTemplates.test.js +0 -131
@@ -52,7 +52,6 @@ import { QUICK_REPLY, WHATSAPP_CATEGORIES, PHONE_NUMBER, TEMPLATE_VARIABLE_REGEX
52
52
  import { RCS_BUTTON_TYPES, LEFT, HORIZONTAL, VERTICAL, RIGHT} from '../../v2Containers/Rcs/constants';
53
53
  import { ANDROID, INAPP_MESSAGE_LAYOUT_TYPES } from '../../v2Containers/InApp/constants';
54
54
  import { CAROUSEL } from '../../v2Containers/MobilePushNew/constants';
55
- import { TEMPLATE_VAR_REGEX } from './constants';
56
55
 
57
56
  const wechatBodyNew = require('./assets/images/wechat_mobile_android.svg');
58
57
  const smsMobileAndroid = require('./assets/images/sms_mobile_android.svg');
@@ -237,23 +236,7 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
237
236
  let content = channel && channel.toLowerCase() === 'sms' ? [this.props.content] : this.props.content;
238
237
  const { formatMessage } = intl;
239
238
  const { rcsPreviewContent, inAppPreviewContent, viberPreviewContent, isBeeFreeTemplate } = content || {};
240
- const normalizedRcsPreviewContent = Array.isArray(rcsPreviewContent)
241
- ? { carouselData: rcsPreviewContent }
242
- : (rcsPreviewContent || {});
243
- const {
244
- rcsImageSrc,
245
- rcsVideoSrc,
246
- rcsTitle,
247
- rcsDesc,
248
- rcsSuggestions,
249
- carouselData: rcsCarouselData,
250
- rcsCarouselData: rcsCarouselDataAlt,
251
- cardVarMapped: rcsCardVarMapped,
252
- } = normalizedRcsPreviewContent;
253
- const resolvedRcsCarouselData =
254
- Array.isArray(rcsCarouselData) && rcsCarouselData.length > 0
255
- ? rcsCarouselData
256
- : rcsCarouselDataAlt;
239
+ const { rcsImageSrc, rcsVideoSrc, rcsTitle, rcsDesc, rcsSuggestions } = rcsPreviewContent || {};
257
240
  const {
258
241
  videoParams,
259
242
  imageURL,
@@ -334,18 +317,6 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
334
317
  'flex-shrink': 0,
335
318
  'left': 0,
336
319
  };
337
-
338
- const resolveVarsWithMap = (input, varMap) => {
339
- if (input === null || input === undefined) return '';
340
- const str = typeof input === 'string' ? input : String(input);
341
- return str.replace(TEMPLATE_VAR_REGEX, (token, varName) => {
342
- const mappedValue = varMap?.[varName];
343
- if (mappedValue === null || mappedValue === undefined || String(mappedValue) === '') {
344
- return token;
345
- }
346
- return String(mappedValue);
347
- });
348
- };
349
320
  const getVideoContent = ({
350
321
  video,
351
322
  actionUrl,
@@ -502,15 +473,13 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
502
473
  const whatsappUpdatedAccountName = whatsappAccountName || templateData?.versions?.base?.content?.whatsapp?.accountName || '';
503
474
  const whatsappUpdatedLen = whatsappContentLen !== undefined ? whatsappContentLen : content?.charCount;
504
475
 
505
- const renderRcsSuggestionsPreview = (suggestionsArg) => {
476
+ const renderRcsSuggestionsPreview = () => {
506
477
  const renderArray = [];
507
- const suggestions = Array.isArray(suggestionsArg) ? suggestionsArg : (rcsSuggestions || []);
508
- (suggestions || []).forEach((suggestion, idx) => {
509
- const suggestionKey = `${suggestion?.type || 'unknown'}-${suggestion?.text || ''}-${idx}`;
510
- renderArray.push(<CapDivider key={`rcs-divider-${suggestionKey}`} className="whatsapp-divider" />);
478
+ (rcsSuggestions || []).forEach((suggestion) => {
479
+ renderArray.push(<CapDivider className="whatsapp-divider" />);
511
480
  if (suggestion.type === RCS_BUTTON_TYPES.QUICK_REPLY) {
512
481
  renderArray.push(
513
- <CapLabel key={`rcs-suggestion-${suggestionKey}`} type="label21" className="rcs-cta-preview">
482
+ <CapLabel type="label21" className="rcs-cta-preview">
514
483
  <CapIcon
515
484
  type='small-link'
516
485
  size="xs"
@@ -520,14 +489,14 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
520
489
  );
521
490
  } else if (suggestion.type === RCS_BUTTON_TYPES.CTA) {
522
491
  renderArray.push(
523
- <CapLabel key={`rcs-suggestion-${suggestionKey}`} type="label21" className="rcs-cta-preview">
492
+ <CapLabel type="label21" className="rcs-cta-preview">
524
493
  <CapIcon type="launch" size="xs" />
525
494
  {suggestion.text}
526
495
  </CapLabel>,
527
496
  );
528
497
  } else if (suggestion.type === RCS_BUTTON_TYPES.PHONE_NUMBER) {
529
498
  renderArray.push(
530
- <CapLabel key={`rcs-suggestion-${suggestionKey}`} type="label21" className="rcs-cta-preview">
499
+ <CapLabel type="label21" className="rcs-cta-preview">
531
500
  <CapIcon type="call" size="xs" />
532
501
  {suggestion.text}
533
502
  </CapLabel>,
@@ -540,20 +509,23 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
540
509
  const renderTextPreviewContent = () => (
541
510
  <>
542
511
  {rcsTitle && (
512
+ <>
543
513
  <CapLabel
544
514
  type="label5"
545
515
  className="message-pop-item align-left rcs-content"
546
516
  fontWeight="bold"
547
517
  >
548
- {resolveVarsWithMap(rcsTitle, rcsCardVarMapped)}
518
+ {rcsTitle}
549
519
  </CapLabel>
520
+ <CapDivider className="whatsapp-divider" />
521
+ </>
550
522
  )}
551
523
  {rcsDesc && (
552
524
  <CapLabel
553
525
  type="label5"
554
526
  className="message-pop-item align-left rcs-desc rcs-content"
555
527
  >
556
- {resolveVarsWithMap(rcsDesc, rcsCardVarMapped)}
528
+ {rcsDesc}
557
529
  </CapLabel>
558
530
  )}
559
531
  {renderRcsSuggestionsPreview()}
@@ -570,134 +542,50 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
570
542
  />
571
543
  )}
572
544
  {rcsVideoSrc && (
573
- <CapRow className="video-preview">
545
+ <div className="video-preview">
574
546
  <CapImage
575
547
  src={rcsVideoSrc}
576
548
  className="rcs-image"
577
549
  alt={formatMessage(messages.previewGenerated)}
578
550
  />
579
- <CapRow className="icon-position">
551
+ <div className="icon-position">
580
552
  <CapImage
581
553
  className="video-icon"
582
554
  src={videoPlay}
583
555
  />
584
- </CapRow>
585
- </CapRow>
556
+ </div>
557
+ </div>
586
558
  )}
587
559
  </>
588
560
  );
589
561
 
590
562
  const renderRcsPreviewContent = () => {
591
- const carouselCards = Array.isArray(resolvedRcsCarouselData) ? resolvedRcsCarouselData : [];
592
- if (carouselCards.length > 0) {
593
- return (
594
- <CapRow className="msg-container sms">
595
- <CapRow className="message-pop sms">
596
- <CapRow className="msg-container-carousel">
597
- <CapRow className="scroll-container">
598
- {carouselCards.map((card, idx) => {
599
- const key = `rcs-carousel-${idx}-${card?.bodyText || card?.imageSrc || card?.videoPreviewImg || ''}`;
600
- const isVideo = (card?.mediaType || '').toLowerCase() === 'video';
601
- const cardSuggestions = Array.isArray(card?.suggestions) ? card.suggestions : [];
602
- const effectiveCardVarMap = card?.cardVarMapped || rcsCardVarMapped;
603
- const suggestionsNode = cardSuggestions.length > 0
604
- ? renderRcsSuggestionsPreview(cardSuggestions)
605
- : null;
606
-
607
- const resolvedCardTitle = resolveVarsWithMap(card?.title, effectiveCardVarMap);
608
- const resolvedCardBodyText = resolveVarsWithMap(card?.bodyText, effectiveCardVarMap);
609
-
610
- return (
611
- <CapRow
612
- key={key}
613
- className="message-pop align-left message-pop-carousel rcs-carousel-card"
614
- >
615
- <CapRow className="whatsapp-content">
616
- {!isVideo && (
617
- <CapImage
618
- src={card?.imageSrc ? card.imageSrc : whatsappImageEmptyPreview}
619
- className="whatsapp-image"
620
- alt={formatMessage(messages.previewGenerated)}
621
- />
622
- )}
623
- {isVideo && (
624
- <CapTooltip title={formatMessage(messages.videoPreviewTooltip)}>
625
- <CapRow className="video-preview">
626
- <CapImage
627
- src={card?.videoPreviewImg ? card.videoPreviewImg : whatsappVideoEmptyPreview}
628
- className="whatsapp-image"
629
- alt={formatMessage(messages.previewGenerated)}
630
- />
631
- <CapRow className="icon-position">
632
- <CapImage className="video-icon" src={videoPlay} alt="Play" />
633
- </CapRow>
634
- </CapRow>
635
- </CapTooltip>
636
- )}
637
-
638
- {(resolvedCardTitle || resolvedCardBodyText) && (
639
- <CapRow className="carousel-content">
640
- {!!resolvedCardTitle && (
641
- <CapLabel
642
- type={card?.titleLabelType || 'label1'}
643
- className="carousel-title"
644
- >
645
- {resolvedCardTitle}
646
- </CapLabel>
647
- )}
648
- {!!resolvedCardBodyText && (
649
- <CapLabel
650
- type={card?.bodyLabelType || 'label2'}
651
- className="carousel-message"
652
- >
653
- {resolvedCardBodyText}
654
- </CapLabel>
655
- )}
656
- </CapRow>
657
- )}
658
-
659
- {!!suggestionsNode && (
660
- <>
661
- {suggestionsNode}
662
- </>
663
- )}
664
- </CapRow>
665
- </CapRow>
666
- );
667
- })}
668
- </CapRow>
669
- </CapRow>
670
- </CapRow>
671
- </CapRow>
672
- );
673
- }
674
-
675
563
  if (rcsOrientation === HORIZONTAL) {
676
564
  return rcsType === RIGHT ? (
677
- <CapRow className="msg-container sms">
678
- <CapRow className="message-pop sms horizontal">
565
+ <div className="msg-container sms">
566
+ <div className="message-pop sms horizontal">
679
567
  <CapColumn className="rcs-preview-text" span={12}>{renderTextPreviewContent()}</CapColumn>
680
568
  <CapColumn span={12}>{renderMediaPreviewContent()}</CapColumn>
681
- </CapRow>
682
- </CapRow>
569
+ </div>
570
+ </div>
683
571
 
684
572
  ) : (
685
- <CapRow className="msg-container sms">
686
- <CapRow className="message-pop sms horizontal">
573
+ <div className="msg-container sms">
574
+ <div className="message-pop sms horizontal">
687
575
  <CapColumn span={12}>{renderMediaPreviewContent()}</CapColumn>
688
576
  <CapColumn className="rcs-preview-text" span={12}>{renderTextPreviewContent()}</CapColumn>
689
- </CapRow>
690
- </CapRow>
577
+ </div>
578
+ </div>
691
579
  );
692
580
  }
693
581
 
694
582
  return (
695
- <CapRow className="msg-container sms">
696
- <CapRow className="message-pop sms">
583
+ <div className="msg-container sms">
584
+ <div className="message-pop sms">
697
585
  {renderMediaPreviewContent()}
698
586
  {renderTextPreviewContent()}
699
- </CapRow>
700
- </CapRow>
587
+ </div>
588
+ </div>
701
589
  );
702
590
  };
703
591
 
@@ -1415,14 +1303,14 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
1415
1303
  ""
1416
1304
  )}
1417
1305
  {channel?.toUpperCase() === RCS && (
1418
- <CapRow className="shell-v2 align-center rcs-preview">
1306
+ <div className="shell-v2 align-center rcs-preview">
1419
1307
  <CapImage
1420
1308
  className="preview-image"
1421
1309
  src={rcsIosPreview ? smsMobileIos : smsMobileAndroid}
1422
1310
  alt={formatMessage(messages.previewGenerated)}
1423
1311
  />
1424
1312
  {renderRcsPreviewContent()}
1425
- </CapRow>
1313
+ </div>
1426
1314
 
1427
1315
  )}
1428
1316
  {channel?.toUpperCase() === ZALO && (
@@ -1623,4 +1511,4 @@ TemplatePreview.propTypes = {
1623
1511
  rcsOrientation: PropTypes.string,
1624
1512
  };
1625
1513
 
1626
- export default (injectIntl(TemplatePreview));
1514
+ export default (injectIntl(TemplatePreview));
@@ -2,9 +2,6 @@ import React from 'react';
2
2
  import { shallowWithIntl } from '../../../helpers/intl-enzym-test-helpers';
3
3
 
4
4
  import { TemplatePreview } from '../index';
5
- import { RCS } from '../../../v2Containers/CreativesContainer/constants';
6
- import whatsappImageEmptyPreview from '../assets/images/empty_image_preview.svg';
7
- import whatsappVideoEmptyPreview from '../assets/images/empty_video_preview.svg';
8
5
 
9
6
  describe('Test Templates container', () => {
10
7
  let renderedComponent;
@@ -72,143 +69,4 @@ describe('Test Templates container', () => {
72
69
  });
73
70
  expect(renderedComponent).toMatchSnapshot();
74
71
  });
75
-
76
- describe('RCS carousel preview branches', () => {
77
- const buildRcsContent = (cards) => ({
78
- rcsPreviewContent: {
79
- carouselData: cards,
80
- },
81
- });
82
-
83
- const getNodesByClassName = (className) =>
84
- renderedComponent.findWhere((node) => node.prop('className') === className);
85
-
86
- it('renders image and video cards with proper media-specific markup', () => {
87
- renderFunction(
88
- RCS,
89
- buildRcsContent([
90
- {
91
- mediaType: 'image',
92
- imageSrc: 'https://example.com/image-card.jpg',
93
- bodyText: 'image body',
94
- suggestions: [],
95
- },
96
- {
97
- mediaType: 'video',
98
- videoPreviewImg: 'https://example.com/video-thumb.jpg',
99
- bodyText: 'video body',
100
- suggestions: [],
101
- },
102
- ]),
103
- '',
104
- 0,
105
- );
106
-
107
- // Video card should render tooltip/video icon path; image-only card should not.
108
- expect(renderedComponent.find('CapTooltip')).toHaveLength(1);
109
- expect(
110
- renderedComponent.findWhere((node) => node.prop('className') === 'video-icon')
111
- ).toHaveLength(1);
112
-
113
- // Both cards render media containers.
114
- expect(
115
- renderedComponent.findWhere((node) => node.prop('className') === 'whatsapp-image')
116
- ).toHaveLength(2);
117
- });
118
-
119
- it('renders per-card suggestions only for cards that provide suggestions', () => {
120
- renderFunction(
121
- RCS,
122
- buildRcsContent([
123
- {
124
- mediaType: 'image',
125
- imageSrc: 'https://example.com/with-suggestions.jpg',
126
- bodyText: 'has suggestions',
127
- suggestions: [
128
- { type: 'QUICK_REPLY', text: 'Reply 1' },
129
- { type: 'CTA', text: 'Visit' },
130
- ],
131
- },
132
- {
133
- mediaType: 'image',
134
- imageSrc: 'https://example.com/no-suggestions.jpg',
135
- bodyText: 'no suggestions',
136
- suggestions: [],
137
- },
138
- ]),
139
- '',
140
- 0,
141
- );
142
-
143
- // Suggestion labels/icons should be rendered only from first card.
144
- expect(getNodesByClassName('rcs-cta-preview')).toHaveLength(2);
145
- expect(getNodesByClassName('whatsapp-divider')).not.toHaveLength(0);
146
- });
147
-
148
- it('falls back to empty preview assets when image/video media src is missing', () => {
149
- renderFunction(
150
- RCS,
151
- buildRcsContent([
152
- {
153
- mediaType: 'image',
154
- bodyText: 'fallback image',
155
- suggestions: [],
156
- },
157
- {
158
- mediaType: 'video',
159
- bodyText: 'fallback video',
160
- suggestions: [],
161
- },
162
- ]),
163
- '',
164
- 0,
165
- );
166
-
167
- const mediaImageNodes = renderedComponent.findWhere(
168
- (node) => node.name() === 'CapImage' && node.prop('className') === 'whatsapp-image'
169
- );
170
- const mediaSrcs = mediaImageNodes.map((node) => node.prop('src'));
171
-
172
- expect(mediaSrcs).toContain(whatsappImageEmptyPreview);
173
- expect(mediaSrcs).toContain(whatsappVideoEmptyPreview);
174
- });
175
-
176
- it('generates unique carousel keys using rcs-carousel-<idx>-<bodyText|imageSrc|videoPreviewImg>', () => {
177
- renderFunction(
178
- RCS,
179
- buildRcsContent([
180
- {
181
- mediaType: 'image',
182
- imageSrc: 'https://example.com/one.jpg',
183
- bodyText: 'same body',
184
- suggestions: [],
185
- },
186
- {
187
- mediaType: 'image',
188
- imageSrc: 'https://example.com/two.jpg',
189
- bodyText: 'same body',
190
- suggestions: [],
191
- },
192
- {
193
- mediaType: 'video',
194
- videoPreviewImg: 'https://example.com/three-thumb.jpg',
195
- bodyText: 'same body',
196
- suggestions: [],
197
- },
198
- ]),
199
- '',
200
- 0,
201
- );
202
-
203
- const cardNodes = getNodesByClassName('message-pop align-left message-pop-carousel rcs-carousel-card');
204
- const keys = cardNodes.map((node) => node.key());
205
-
206
- expect(keys).toEqual([
207
- 'rcs-carousel-0-same body',
208
- 'rcs-carousel-1-same body',
209
- 'rcs-carousel-2-same body',
210
- ]);
211
- expect(new Set(keys).size).toBe(keys.length);
212
- });
213
- });
214
72
  });
@@ -18,7 +18,7 @@ import injectReducer from '../../utils/injectReducer';
18
18
  import injectSaga from '../../utils/injectSaga';
19
19
 
20
20
  import CommonTestAndPreview from '../CommonTestAndPreview';
21
- import { CHANNELS, RCS_SMS_FALLBACK_VAR_MAPPED_PROP } from '../CommonTestAndPreview/constants';
21
+ import { CHANNELS } from '../CommonTestAndPreview/constants';
22
22
  import * as commonTestAndPreviewActions from '../CommonTestAndPreview/actions';
23
23
  import { commonTestAndPreviewSaga } from '../CommonTestAndPreview/sagas';
24
24
  import commonTestAndPreviewReducer from '../CommonTestAndPreview/reducer';
@@ -78,16 +78,6 @@ TestAndPreviewSlidebox.propTypes = {
78
78
  content: PropTypes.string,
79
79
  beeInstance: PropTypes.object,
80
80
  currentTab: PropTypes.number,
81
- smsFallbackContent: PropTypes.shape({
82
- templateContent: PropTypes.string,
83
- senderId: PropTypes.string,
84
- templateName: PropTypes.string,
85
- [RCS_SMS_FALLBACK_VAR_MAPPED_PROP]: PropTypes.object,
86
- }),
87
- /** Passed to CommonTestAndPreview for RCS test-meta resolution (slot semantics vs full-mode). */
88
- rcsTestPreviewOptions: PropTypes.shape({
89
- isLibraryMode: PropTypes.bool,
90
- }),
91
81
  // Redux props are passed through
92
82
  actions: PropTypes.object.isRequired,
93
83
  extractedTags: PropTypes.array.isRequired,
@@ -119,12 +109,10 @@ TestAndPreviewSlidebox.defaultProps = {
119
109
  currentTab: 1,
120
110
  messageMetaConfigId: null,
121
111
  prefilledValues: {},
122
- rcsTestPreviewOptions: undefined,
123
112
  senderDetailsByChannel: {},
124
113
  wecrmAccounts: [],
125
114
  isLoadingSenderDetails: false,
126
115
  orgUnitId: -1,
127
- smsFallbackContent: null,
128
116
  };
129
117
 
130
118
  const mapStateToProps = createStructuredSelector({
@@ -34,7 +34,6 @@ import {
34
34
  GET_PREFILLED_VALUES_SUCCESS,
35
35
  GET_PREFILLED_VALUES_FAILURE,
36
36
  } from './constants';
37
- import { extractPreviewFromLiquidResponse } from '../CommonTestAndPreview/previewApiUtils';
38
37
 
39
38
  // Search Customers Saga
40
39
  export function* searchCustomersSaga(action) {
@@ -81,12 +80,11 @@ export function* updatePreviewSaga(action) {
81
80
  const customValues = action.payload.resolvedTags;
82
81
 
83
82
  const response = yield call(Api.updateEmailPreview, action.payload);
84
- const previewPayload = extractPreviewFromLiquidResponse(response);
85
- if (previewPayload) {
83
+ if (response?.data) {
86
84
  yield put({
87
85
  type: UPDATE_PREVIEW_SUCCESS,
88
86
  payload: {
89
- previewData: previewPayload,
87
+ previewData: response.data,
90
88
  customValues, // Pass custom values to be preserved
91
89
  },
92
90
  });
@@ -223,13 +221,8 @@ export function* createMessageMetaSaga(action) {
223
221
  export function* getPrefilledValuesSaga(action) {
224
222
  try {
225
223
  const response = yield call(Api.updateEmailPreview, action.payload);
226
- const body =
227
- response?.data !== undefined && response?.data !== null
228
- ? response.data
229
- : response;
230
- const resolvedTagValues = body?.resolvedTagValues;
231
- if (resolvedTagValues != null) {
232
- yield put({ type: GET_PREFILLED_VALUES_SUCCESS, payload: { values: resolvedTagValues } });
224
+ if (response?.data) {
225
+ yield put({ type: GET_PREFILLED_VALUES_SUCCESS, payload: { values: response?.data?.resolvedTagValues } });
233
226
  } else {
234
227
  yield put({ type: GET_PREFILLED_VALUES_FAILURE, payload: { error: response.error || 'Failed to fetch prefilled values' } });
235
228
  }
@@ -136,9 +136,7 @@ describe('TestAndPreviewSlidebox Sagas', () => {
136
136
  describe('updatePreviewSaga', () => {
137
137
  it('should handle successful preview update', () => {
138
138
  const mockResponse = {
139
- data: {
140
- resolvedBody: 'Test Preview Data',
141
- },
139
+ data: 'Test Preview Data',
142
140
  };
143
141
  const customValues = { test: 'value' };
144
142
  return expectSaga(sagas.updatePreviewSaga, {
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
3
3
  import styled from 'styled-components';
4
4
  import get from 'lodash/get';
5
5
  import isEmpty from 'lodash/isEmpty';
6
- import pick from 'lodash/pick';
7
6
  import cloneDeep from 'lodash/cloneDeep';
8
7
  import TemplatesV2 from '../TemplatesV2';
9
8
  import TemplatePreview from '../../v2Components/TemplatePreview';
@@ -26,7 +25,6 @@ import Viber from '../Viber';
26
25
  import Whatsapp from '../Whatsapp';
27
26
  import InApp from '../InApp';
28
27
  import Rcs from '../Rcs';
29
- import { isRcsTextOnlyCardMediaType, resolveRcsCardPreviewStrings } from '../Rcs/utils';
30
28
  import { getWhatsappContent } from '../Whatsapp/utils';
31
29
  import * as commonUtil from '../../utils/common';
32
30
  import Zalo from '../Zalo';
@@ -182,8 +180,6 @@ export function SlideBoxContent(props) {
182
180
  isTestAndPreviewMode,
183
181
  onHtmlEditorValidationStateChange,
184
182
  } = props;
185
- const localTemplatesConfig = props.localTemplatesConfig || pick(props, constants.LOCAL_TEMPLATE_CONFIG_KEYS);
186
- const useLocalTemplates = !!get(localTemplatesConfig, 'useLocalTemplates');
187
183
  const type = (messageDetails.type || '').toLowerCase(); // type is context in get tags values : outbound | dvs | referral | loyalty | coupons
188
184
  const query = { type: !isFullMode && 'embedded', module: isFullMode ? 'default' : 'library', isEditFromCampaigns: (templateData || {}).isEditFromCampaigns};
189
185
  const creativesLocationProps = {
@@ -403,37 +399,12 @@ export function SlideBoxContent(props) {
403
399
  }
404
400
  case constants.RCS: {
405
401
  const template = cloneDeep(templateDataObject);
406
- const cardPath = 'versions.base.content.RCS.rcsContent.cardContent[0]';
407
- const card = get(template, cardPath, {}) || {};
408
- const {
409
- description = '',
410
- media: { mediaUrl = '' } = {},
411
- title = '',
412
- mediaType: cardMediaType,
413
- suggestions = [],
414
- cardVarMapped: nestedCardVarMapped,
415
- } = card;
416
- const rootMirror = templateDataObject?.rcsCardVarMapped;
417
- const nestedRecord =
418
- nestedCardVarMapped != null && typeof nestedCardVarMapped === 'object'
419
- ? nestedCardVarMapped
420
- : {};
421
- const rootRecord =
422
- rootMirror != null && typeof rootMirror === 'object' ? rootMirror : {};
423
- const mergedCardVarMapped = { ...rootRecord, ...nestedRecord };
424
- const textOnlyCard = isRcsTextOnlyCardMediaType(cardMediaType);
425
- const { rcsTitle, rcsDesc } = resolveRcsCardPreviewStrings(
426
- title,
427
- description,
428
- mergedCardVarMapped,
429
- !isFullMode,
430
- textOnlyCard,
431
- );
402
+ const { description = "", media: { mediaUrl = "" } = {}, title = "", suggestions = [] } = get(template, 'versions.base.content.RCS.rcsContent.cardContent[0]', {});
432
403
  return {
433
404
  rcsPreviewContent: {
434
405
  rcsImageSrc: mediaUrl,
435
- rcsTitle,
436
- rcsDesc,
406
+ rcsTitle: title,
407
+ rcsDesc: description,
437
408
  ...(suggestions.length > 0 && {
438
409
  buttonText: suggestions[0]?.text,
439
410
  }),
@@ -459,7 +430,7 @@ export function SlideBoxContent(props) {
459
430
 
460
431
  return (
461
432
  <CreativesWrapper>
462
- {slidBoxContent === 'templates' && (!isFullMode || useLocalTemplates) && (
433
+ {!isFullMode && slidBoxContent === 'templates' && (
463
434
  <TemplatesV2
464
435
  isFullMode={isFullMode}
465
436
  onSelectTemplate={onSelectTemplate}
@@ -492,7 +463,6 @@ export function SlideBoxContent(props) {
492
463
  waitEventContextTags={waitEventContextTags}
493
464
  loyaltyMetaData={loyaltyMetaData}
494
465
  isLoyaltyModule={isLoyaltyModule}
495
- localTemplatesConfig={localTemplatesConfig}
496
466
  />
497
467
  )}
498
468
  {isPreview && (
@@ -663,7 +633,6 @@ export function SlideBoxContent(props) {
663
633
  route={{ name: 'sms' }}
664
634
  isCreateSms={isCreateSms}
665
635
  isComponent
666
- templateData={templateData}
667
636
  isGetFormData={isGetFormData}
668
637
  getFormSubscriptionData={getFormData}
669
638
  getLiquidTags={getLiquidTags}
@@ -1270,7 +1239,6 @@ export function SlideBoxContent(props) {
1270
1239
  )}
1271
1240
  {isCreateRcs && (<Rcs
1272
1241
  {...rcsCommonProps}
1273
- templateData={templateData}
1274
1242
  showLiquidErrorInFooter={showLiquidErrorInFooter}
1275
1243
  showTestAndPreviewSlidebox={showTestAndPreviewSlidebox}
1276
1244
  handleTestAndPreview={handleTestAndPreview}
@@ -49,8 +49,6 @@ function SlideBoxFooter(props) {
49
49
  isAnonymousType = false,
50
50
  templateData = {},
51
51
  hasPersonalizationTokenError: hasPersonalizationTokenErrorProp = false,
52
- /** When set (e.g. SMS library create), overrides `creativesTemplatesSave` (“Done”) for the primary button */
53
- primarySaveButtonMessage,
54
52
  } = props;
55
53
  // Calculate if buttons should be disabled
56
54
  // Only apply validation state checks for EMAIL channel in HTML Editor mode (not BEE/DragDrop)
@@ -189,9 +187,7 @@ function SlideBoxFooter(props) {
189
187
  onClick={onSave}
190
188
  disabled={isTemplateNameEmpty || fetchingCmsData || shouldDisableButtons || hasPersonalizationTokenError}
191
189
  >
192
- {primarySaveButtonMessage ? (
193
- <FormattedMessage {...primarySaveButtonMessage} />
194
- ) : isFullMode ? (
190
+ {isFullMode ? (
195
191
  getFullModeSaveBtn(slidBoxContent, isCreatingTemplate)
196
192
  ) : (
197
193
  <FormattedMessage {...messages.creativesTemplatesSave} />
@@ -268,10 +264,6 @@ SlideBoxFooter.propTypes = {
268
264
  templateData: PropTypes.object,
269
265
  formData: PropTypes.array,
270
266
  hasPersonalizationTokenError: PropTypes.bool,
271
- primarySaveButtonMessage: PropTypes.shape({
272
- id: PropTypes.string,
273
- defaultMessage: PropTypes.string,
274
- }),
275
267
  };
276
268
 
277
269
  SlideBoxFooter.defaultProps = {
@@ -299,6 +291,5 @@ SlideBoxFooter.defaultProps = {
299
291
  selectedEmailCreateMode: '',
300
292
  formData: [],
301
293
  hasPersonalizationTokenError: false,
302
- primarySaveButtonMessage: undefined,
303
294
  };
304
295
  export default SlideBoxFooter;