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

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 (136) hide show
  1. package/constants/unified.js +29 -0
  2. package/package.json +1 -1
  3. package/services/tests/api.test.js +35 -20
  4. package/utils/commonUtils.js +19 -1
  5. package/utils/rcsPayloadUtils.js +92 -0
  6. package/utils/templateVarUtils.js +201 -0
  7. package/utils/tests/rcsPayloadUtils.test.js +226 -0
  8. package/utils/tests/templateVarUtils.test.js +204 -0
  9. package/v2Components/CapActionButton/constants.js +7 -0
  10. package/v2Components/CapActionButton/index.js +166 -108
  11. package/v2Components/CapActionButton/index.scss +157 -6
  12. package/v2Components/CapActionButton/messages.js +19 -3
  13. package/v2Components/CapActionButton/tests/index.test.js +41 -17
  14. package/v2Components/CapTagList/index.js +10 -0
  15. package/v2Components/CommonTestAndPreview/CustomValuesEditor.js +72 -49
  16. package/v2Components/CommonTestAndPreview/DeliverySettings/DeliverySettings.scss +8 -2
  17. package/v2Components/CommonTestAndPreview/DeliverySettings/ModifyDeliverySettings.js +213 -21
  18. package/v2Components/CommonTestAndPreview/DeliverySettings/constants.js +16 -0
  19. package/v2Components/CommonTestAndPreview/DeliverySettings/index.js +85 -10
  20. package/v2Components/CommonTestAndPreview/DeliverySettings/messages.js +30 -0
  21. package/v2Components/CommonTestAndPreview/DeliverySettings/utils/parseSenderDetailsResponse.js +79 -11
  22. package/v2Components/CommonTestAndPreview/SendTestMessage.js +10 -5
  23. package/v2Components/CommonTestAndPreview/UnifiedPreview/PreviewHeader.js +0 -17
  24. package/v2Components/CommonTestAndPreview/UnifiedPreview/RcsPreviewContent.js +157 -15
  25. package/v2Components/CommonTestAndPreview/UnifiedPreview/_unifiedPreview.scss +346 -146
  26. package/v2Components/CommonTestAndPreview/UnifiedPreview/index.js +138 -48
  27. package/v2Components/CommonTestAndPreview/_commonTestAndPreview.scss +11 -0
  28. package/v2Components/CommonTestAndPreview/constants.js +38 -4
  29. package/v2Components/CommonTestAndPreview/index.js +691 -235
  30. package/v2Components/CommonTestAndPreview/messages.js +45 -3
  31. package/v2Components/CommonTestAndPreview/previewApiUtils.js +59 -0
  32. package/v2Components/CommonTestAndPreview/sagas.js +25 -6
  33. package/v2Components/CommonTestAndPreview/tests/CustomValuesEditor.test.js +308 -284
  34. package/v2Components/CommonTestAndPreview/tests/DeliverySettings/ModifyDeliverySettings.test.js +231 -65
  35. package/v2Components/CommonTestAndPreview/tests/DeliverySettings/index.test.js +118 -5
  36. package/v2Components/CommonTestAndPreview/tests/DeliverySettings/utils/parseSenderDetailsResponse.test.js +341 -0
  37. package/v2Components/CommonTestAndPreview/tests/PreviewSection.test.js +8 -1
  38. package/v2Components/CommonTestAndPreview/tests/SendTestMessage.test.js +34 -13
  39. package/v2Components/CommonTestAndPreview/tests/UnifiedPreview/PreviewHeader.test.js +0 -159
  40. package/v2Components/CommonTestAndPreview/tests/UnifiedPreview/RcsPreviewContent.test.js +281 -283
  41. package/v2Components/CommonTestAndPreview/tests/UnifiedPreview/index.test.js +199 -256
  42. package/v2Components/CommonTestAndPreview/tests/constants.test.js +1 -2
  43. package/v2Components/CommonTestAndPreview/tests/index.test.js +132 -198
  44. package/v2Components/CommonTestAndPreview/tests/previewApiUtils.test.js +67 -0
  45. package/v2Components/CommonTestAndPreview/tests/sagas.test.js +36 -26
  46. package/v2Components/FormBuilder/index.js +11 -6
  47. package/v2Components/SmsFallback/SmsFallbackLocalSelector.js +91 -0
  48. package/v2Components/SmsFallback/constants.js +73 -0
  49. package/v2Components/SmsFallback/index.js +956 -0
  50. package/v2Components/SmsFallback/index.scss +265 -0
  51. package/v2Components/SmsFallback/messages.js +78 -0
  52. package/v2Components/SmsFallback/smsFallbackUtils.js +119 -0
  53. package/v2Components/SmsFallback/tests/SmsFallbackLocalSelector.test.js +50 -0
  54. package/v2Components/SmsFallback/tests/rcsSmsFallback.acceptance.test.js +147 -0
  55. package/v2Components/SmsFallback/tests/smsFallbackHandlers.test.js +304 -0
  56. package/v2Components/SmsFallback/tests/smsFallbackUi.test.js +223 -0
  57. package/v2Components/SmsFallback/tests/smsFallbackUtils.test.js +309 -0
  58. package/v2Components/SmsFallback/tests/useLocalTemplateList.test.js +422 -0
  59. package/v2Components/SmsFallback/useLocalTemplateList.js +92 -0
  60. package/v2Components/TemplatePreview/_templatePreview.scss +38 -23
  61. package/v2Components/TemplatePreview/constants.js +2 -0
  62. package/v2Components/TemplatePreview/index.js +143 -31
  63. package/v2Components/TemplatePreview/tests/index.test.js +142 -0
  64. package/v2Components/TestAndPreviewSlidebox/index.js +15 -3
  65. package/v2Components/TestAndPreviewSlidebox/sagas.js +11 -4
  66. package/v2Components/TestAndPreviewSlidebox/tests/saga.test.js +3 -1
  67. package/v2Components/VarSegmentMessageEditor/constants.js +2 -0
  68. package/v2Components/VarSegmentMessageEditor/index.js +125 -0
  69. package/v2Components/VarSegmentMessageEditor/index.scss +46 -0
  70. package/v2Containers/App/constants.js +0 -3
  71. package/v2Containers/CreativesContainer/CreativesSlideBoxWrapper.js +43 -0
  72. package/v2Containers/CreativesContainer/SlideBoxContent.js +36 -4
  73. package/v2Containers/CreativesContainer/SlideBoxFooter.js +10 -1
  74. package/v2Containers/CreativesContainer/SlideBoxHeader.js +29 -4
  75. package/v2Containers/CreativesContainer/constants.js +9 -0
  76. package/v2Containers/CreativesContainer/embeddedSlideboxUtils.js +79 -0
  77. package/v2Containers/CreativesContainer/index.js +322 -103
  78. package/v2Containers/CreativesContainer/index.scss +51 -1
  79. package/v2Containers/CreativesContainer/tests/SlideBoxContent.localTemplates.test.js +90 -0
  80. package/v2Containers/CreativesContainer/tests/SlideBoxFooter.test.js +78 -34
  81. package/v2Containers/CreativesContainer/tests/SlideBoxHeader.test.js +79 -16
  82. package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxContent.test.js.snap +8 -0
  83. package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxHeader.test.js.snap +357 -98
  84. package/v2Containers/CreativesContainer/tests/__snapshots__/index.test.js.snap +20 -15
  85. package/v2Containers/CreativesContainer/tests/embeddedSlideboxUtils.test.js +258 -0
  86. package/v2Containers/CreativesContainer/tests/index.test.js +71 -9
  87. package/v2Containers/CreativesContainer/tests/useLocalTemplatesProp.test.js +125 -0
  88. package/v2Containers/MobilePush/Create/test/saga.test.js +2 -2
  89. package/v2Containers/Rcs/constants.js +119 -10
  90. package/v2Containers/Rcs/index.js +2445 -813
  91. package/v2Containers/Rcs/index.scss +280 -8
  92. package/v2Containers/Rcs/messages.js +34 -3
  93. package/v2Containers/Rcs/rcsLibraryHydrationUtils.js +225 -0
  94. package/v2Containers/Rcs/tests/__snapshots__/index.test.js.snap +98018 -70073
  95. package/v2Containers/Rcs/tests/__snapshots__/utils.test.js.snap +0 -5
  96. package/v2Containers/Rcs/tests/index.test.js +152 -121
  97. package/v2Containers/Rcs/tests/mockData.js +38 -0
  98. package/v2Containers/Rcs/tests/rcsLibraryHydrationUtils.test.js +318 -0
  99. package/v2Containers/Rcs/tests/utils.test.js +646 -30
  100. package/v2Containers/Rcs/utils.js +478 -11
  101. package/v2Containers/Sms/Create/index.js +106 -40
  102. package/v2Containers/Sms/smsFormDataHelpers.js +67 -0
  103. package/v2Containers/Sms/tests/smsFormDataHelpers.test.js +253 -0
  104. package/v2Containers/SmsTrai/Create/index.js +9 -4
  105. package/v2Containers/SmsTrai/Edit/constants.js +2 -0
  106. package/v2Containers/SmsTrai/Edit/index.js +640 -130
  107. package/v2Containers/SmsTrai/Edit/index.scss +121 -0
  108. package/v2Containers/SmsTrai/Edit/messages.js +14 -4
  109. package/v2Containers/SmsTrai/Edit/tests/__snapshots__/index.test.js.snap +4328 -2375
  110. package/v2Containers/SmsWrapper/index.js +37 -8
  111. package/v2Containers/TagList/index.js +6 -0
  112. package/v2Containers/Templates/TemplatesActionBar.js +101 -0
  113. package/v2Containers/Templates/_templates.scss +166 -9
  114. package/v2Containers/Templates/actions.js +11 -0
  115. package/v2Containers/Templates/constants.js +2 -0
  116. package/v2Containers/Templates/index.js +122 -120
  117. package/v2Containers/Templates/sagas.js +56 -12
  118. package/v2Containers/Templates/tests/TemplatesActionBar.test.js +120 -0
  119. package/v2Containers/Templates/tests/__snapshots__/index.test.js.snap +1062 -1017
  120. package/v2Containers/Templates/tests/sagas.test.js +199 -16
  121. package/v2Containers/Templates/tests/smsTemplatesListApi.test.js +180 -0
  122. package/v2Containers/Templates/utils/smsTemplatesListApi.js +79 -0
  123. package/v2Containers/TemplatesV2/TemplatesV2.style.js +72 -1
  124. package/v2Containers/TemplatesV2/index.js +86 -23
  125. package/v2Containers/TemplatesV2/tests/TemplatesV2.localTemplates.test.js +131 -0
  126. package/v2Containers/WeChat/MapTemplates/test/saga.test.js +9 -9
  127. package/v2Containers/WebPush/Create/index.js +8 -91
  128. package/v2Containers/WebPush/Create/index.scss +0 -7
  129. package/v2Containers/Whatsapp/index.js +3 -20
  130. package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap +578 -34
  131. package/v2Components/CommonTestAndPreview/UnifiedPreview/WebPushPreviewContent.js +0 -169
  132. package/v2Components/CommonTestAndPreview/tests/UnifiedPreview/WebPushPreviewContent.test.js +0 -522
  133. package/v2Containers/App/tests/constants.test.js +0 -61
  134. package/v2Containers/Templates/tests/webpush.test.js +0 -375
  135. package/v2Containers/WebPush/Create/tests/getTemplateContent.test.js +0 -338
  136. package/v2Containers/WebPush/Create/tests/testAndPreviewIntegration.test.js +0 -325
@@ -221,35 +221,40 @@ exports[`Test Templates container Should render sms illustration when no templat
221
221
  <div
222
222
  className="action-container"
223
223
  >
224
- <_Class
225
- className="search-text"
226
- disabled={false}
227
- labelPosition="top"
228
- onChange={[Function]}
229
- onClear={[Function]}
230
- onScroll={[Function]}
231
- placeholder="Search"
232
- style={
233
- Object {
234
- "width": "210px",
235
- }
236
- }
237
- value=""
238
- />
239
- <Component />
240
- <Component />
241
224
  <div
242
- className="template-listing-header-actions"
225
+ className="action-container__toolbar-row"
243
226
  >
244
- <CapButton
245
- className="create-new-sms margin-l-8 margin-b-12"
227
+ <_Class
228
+ className="search-text"
246
229
  disabled={false}
247
- isAddBtn={false}
248
- onClick={[Function]}
249
- type="primary"
230
+ labelPosition="top"
231
+ onChange={[Function]}
232
+ onClear={[Function]}
233
+ onScroll={[Function]}
234
+ onSearch={[Function]}
235
+ placeholder="Search"
236
+ value=""
237
+ />
238
+ <Component />
239
+ <Component />
240
+ <div
241
+ className="template-listing-header-actions"
242
+ />
243
+ </div>
244
+ <div>
245
+ <div
246
+ className="action-container__create-row"
250
247
  >
251
- Create new
252
- </CapButton>
248
+ <CapButton
249
+ className="create-new-sms margin-l-8 margin-b-12"
250
+ disabled={false}
251
+ isAddBtn={false}
252
+ onClick={[Function]}
253
+ type="primary"
254
+ >
255
+ Create new
256
+ </CapButton>
257
+ </div>
253
258
  </div>
254
259
  </div>
255
260
  </div>
@@ -420,109 +425,114 @@ exports[`Test Templates container Should render temlates when whatsapp templates
420
425
  <div
421
426
  className="action-container"
422
427
  >
423
- <_Class
424
- className="search-text"
425
- disabled={false}
426
- labelPosition="top"
427
- onChange={[Function]}
428
- onClear={[Function]}
429
- onScroll={[Function]}
430
- placeholder="Search"
431
- style={
432
- Object {
433
- "width": "210px",
434
- }
435
- }
436
- value=""
437
- />
438
428
  <div
439
- className="whatsapp-filters"
429
+ className="action-container__toolbar-row"
440
430
  >
441
- <CapSelectFilter
442
- data={
443
- Array [
444
- Object {
445
- "key": "utility",
446
- "label": <FormattedMessage
447
- defaultMessage="Utility"
448
- id="creatives.containersV2.Whatsapp.utility"
449
- values={Object {}}
450
- />,
451
- "tagColor": "#f2e7fe",
452
- "tagTextColor": "#a451ff",
453
- "tooltipLabel": <FormattedMessage
454
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
455
- id="creatives.containersV2.Whatsapp.utilityTooltip"
456
- values={Object {}}
457
- />,
458
- "value": "UTILITY",
459
- },
460
- Object {
461
- "key": "marketing",
462
- "label": <FormattedMessage
463
- defaultMessage="Marketing"
464
- id="creatives.containersV2.Whatsapp.marketing"
465
- values={Object {}}
466
- />,
467
- "tagColor": "#ffe5d2",
468
- "tagTextColor": "#f87d23",
469
- "tooltipLabel": <FormattedMessage
470
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
471
- id="creatives.containersV2.Whatsapp.marketingTooltip"
472
- values={Object {}}
473
- />,
474
- "value": "MARKETING",
475
- },
431
+ <_Class
432
+ className="search-text"
433
+ disabled={false}
434
+ labelPosition="top"
435
+ onChange={[Function]}
436
+ onClear={[Function]}
437
+ onScroll={[Function]}
438
+ onSearch={[Function]}
439
+ placeholder="Search"
440
+ value=""
441
+ />
442
+ <div
443
+ className="whatsapp-filters"
444
+ >
445
+ <CapSelectFilter
446
+ data={
447
+ Array [
448
+ Object {
449
+ "key": "utility",
450
+ "label": <FormattedMessage
451
+ defaultMessage="Utility"
452
+ id="creatives.containersV2.Whatsapp.utility"
453
+ values={Object {}}
454
+ />,
455
+ "tagColor": "#f2e7fe",
456
+ "tagTextColor": "#a451ff",
457
+ "tooltipLabel": <FormattedMessage
458
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
459
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
460
+ values={Object {}}
461
+ />,
462
+ "value": "UTILITY",
463
+ },
464
+ Object {
465
+ "key": "marketing",
466
+ "label": <FormattedMessage
467
+ defaultMessage="Marketing"
468
+ id="creatives.containersV2.Whatsapp.marketing"
469
+ values={Object {}}
470
+ />,
471
+ "tagColor": "#ffe5d2",
472
+ "tagTextColor": "#f87d23",
473
+ "tooltipLabel": <FormattedMessage
474
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
475
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
476
+ values={Object {}}
477
+ />,
478
+ "value": "MARKETING",
479
+ },
480
+ Object {
481
+ "key": "authentication",
482
+ "label": <FormattedMessage
483
+ defaultMessage="Authentication"
484
+ id="creatives.containersV2.Whatsapp.authentication"
485
+ values={Object {}}
486
+ />,
487
+ "tagColor": "#ecf7ec",
488
+ "tagTextColor": "#6bb56b",
489
+ "tooltipLabel": <FormattedMessage
490
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
491
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
492
+ values={Object {}}
493
+ />,
494
+ "value": "AUTHENTICATION",
495
+ },
496
+ ]
497
+ }
498
+ dropdownMaxHeight="320px"
499
+ dropdownWidth="228px"
500
+ onSelect={[Function]}
501
+ overlayStyle={
476
502
  Object {
477
- "key": "authentication",
478
- "label": <FormattedMessage
479
- defaultMessage="Authentication"
480
- id="creatives.containersV2.Whatsapp.authentication"
481
- values={Object {}}
482
- />,
483
- "tagColor": "#ecf7ec",
484
- "tagTextColor": "#6bb56b",
485
- "tooltipLabel": <FormattedMessage
486
- defaultMessage="Send codes that allow your customers to securely access their accounts."
487
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
488
- values={Object {}}
489
- />,
490
- "value": "AUTHENTICATION",
491
- },
492
- ]
493
- }
494
- dropdownMaxHeight="320px"
495
- dropdownWidth="228px"
496
- onSelect={[Function]}
497
- overlayStyle={
498
- Object {
499
- "overflowY": "hidden",
503
+ "overflowY": "hidden",
504
+ }
500
505
  }
501
- }
502
- placeholder="Category"
503
- placement="bottomLeft"
504
- selectedValue=""
505
- showBadge={true}
506
- width="105px"
506
+ placeholder="Category"
507
+ placement="bottomLeft"
508
+ selectedValue=""
509
+ showBadge={true}
510
+ width="105px"
511
+ />
512
+ </div>
513
+ <Component />
514
+ <Component />
515
+ <div
516
+ className="template-listing-header-actions"
507
517
  />
508
518
  </div>
509
- <Component />
510
- <Component />
511
- <div
512
- className="template-listing-header-actions"
513
- >
514
- <CapLink
515
- className="create-new-link"
516
- disabled={false}
517
- onClick={[Function]}
518
- suffix={
519
- <CapIcon
520
- size="s"
521
- type="open-in-new"
522
- />
523
- }
524
- title="Create new template"
525
- />
519
+ <div>
520
+ <div
521
+ className="action-container__create-row"
522
+ >
523
+ <CapLink
524
+ className="create-new-link"
525
+ disabled={false}
526
+ onClick={[Function]}
527
+ suffix={
528
+ <CapIcon
529
+ size="s"
530
+ type="open-in-new"
531
+ />
532
+ }
533
+ title="Create new template"
534
+ />
535
+ </div>
526
536
  </div>
527
537
  </div>
528
538
  </div>
@@ -672,165 +682,170 @@ exports[`Test Templates container Should render temlates when whatsapp templates
672
682
  <div
673
683
  className="action-container"
674
684
  >
675
- <_Class
676
- className="search-text"
677
- disabled={false}
678
- labelPosition="top"
679
- onChange={[Function]}
680
- onClear={[Function]}
681
- onScroll={[Function]}
682
- placeholder="Search"
683
- style={
684
- Object {
685
- "width": "210px",
686
- }
687
- }
688
- value=""
689
- />
690
685
  <div
691
- className="whatsapp-filters"
686
+ className="action-container__toolbar-row"
692
687
  >
693
- <CapSelectFilter
694
- data={
695
- Array [
696
- Object {
697
- "key": "awaitingApproval",
698
- "label": <FormattedMessage
699
- defaultMessage="Awaiting approval"
700
- id="creatives.containersV2.Whatsapp.awaitingApproval"
701
- values={Object {}}
702
- />,
703
- "value": "awaitingApproval",
704
- },
705
- Object {
706
- "key": "approved",
707
- "label": <FormattedMessage
708
- defaultMessage="Approved"
709
- id="creatives.containersV2.Whatsapp.approved"
710
- values={Object {}}
711
- />,
712
- "value": "approved",
713
- },
714
- Object {
715
- "key": "rejected",
716
- "label": <FormattedMessage
717
- defaultMessage="Rejected"
718
- id="creatives.containersV2.Whatsapp.rejected"
719
- values={Object {}}
720
- />,
721
- "value": "rejected",
722
- },
723
- Object {
724
- "key": "pending",
725
- "label": <FormattedMessage
726
- defaultMessage="Pending"
727
- id="creatives.containersV2.Whatsapp.pending"
728
- values={Object {}}
729
- />,
730
- "value": "pending",
731
- },
732
- Object {
733
- "key": "paused",
734
- "label": <FormattedMessage
735
- defaultMessage="Paused"
736
- id="creatives.containersV2.Whatsapp.paused"
737
- values={Object {}}
738
- />,
739
- "value": "paused",
740
- },
741
- ]
742
- }
743
- dropdownMaxHeight="320px"
744
- dropdownWidth="228px"
745
- onSelect={[Function]}
746
- placeholder="Status"
747
- placement="bottomLeft"
748
- selectedValue="approved"
749
- showBadge={true}
750
- width="90px"
688
+ <_Class
689
+ className="search-text"
690
+ disabled={false}
691
+ labelPosition="top"
692
+ onChange={[Function]}
693
+ onClear={[Function]}
694
+ onScroll={[Function]}
695
+ onSearch={[Function]}
696
+ placeholder="Search"
697
+ value=""
751
698
  />
752
- <CapSelectFilter
753
- data={
754
- Array [
755
- Object {
756
- "key": "utility",
757
- "label": <FormattedMessage
758
- defaultMessage="Utility"
759
- id="creatives.containersV2.Whatsapp.utility"
760
- values={Object {}}
761
- />,
762
- "tagColor": "#f2e7fe",
763
- "tagTextColor": "#a451ff",
764
- "tooltipLabel": <FormattedMessage
765
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
766
- id="creatives.containersV2.Whatsapp.utilityTooltip"
767
- values={Object {}}
768
- />,
769
- "value": "UTILITY",
770
- },
771
- Object {
772
- "key": "marketing",
773
- "label": <FormattedMessage
774
- defaultMessage="Marketing"
775
- id="creatives.containersV2.Whatsapp.marketing"
776
- values={Object {}}
777
- />,
778
- "tagColor": "#ffe5d2",
779
- "tagTextColor": "#f87d23",
780
- "tooltipLabel": <FormattedMessage
781
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
782
- id="creatives.containersV2.Whatsapp.marketingTooltip"
783
- values={Object {}}
784
- />,
785
- "value": "MARKETING",
786
- },
699
+ <div
700
+ className="whatsapp-filters"
701
+ >
702
+ <CapSelectFilter
703
+ data={
704
+ Array [
705
+ Object {
706
+ "key": "awaitingApproval",
707
+ "label": <FormattedMessage
708
+ defaultMessage="Awaiting approval"
709
+ id="creatives.containersV2.Whatsapp.awaitingApproval"
710
+ values={Object {}}
711
+ />,
712
+ "value": "awaitingApproval",
713
+ },
714
+ Object {
715
+ "key": "approved",
716
+ "label": <FormattedMessage
717
+ defaultMessage="Approved"
718
+ id="creatives.containersV2.Whatsapp.approved"
719
+ values={Object {}}
720
+ />,
721
+ "value": "approved",
722
+ },
723
+ Object {
724
+ "key": "rejected",
725
+ "label": <FormattedMessage
726
+ defaultMessage="Rejected"
727
+ id="creatives.containersV2.Whatsapp.rejected"
728
+ values={Object {}}
729
+ />,
730
+ "value": "rejected",
731
+ },
732
+ Object {
733
+ "key": "pending",
734
+ "label": <FormattedMessage
735
+ defaultMessage="Pending"
736
+ id="creatives.containersV2.Whatsapp.pending"
737
+ values={Object {}}
738
+ />,
739
+ "value": "pending",
740
+ },
741
+ Object {
742
+ "key": "paused",
743
+ "label": <FormattedMessage
744
+ defaultMessage="Paused"
745
+ id="creatives.containersV2.Whatsapp.paused"
746
+ values={Object {}}
747
+ />,
748
+ "value": "paused",
749
+ },
750
+ ]
751
+ }
752
+ dropdownMaxHeight="320px"
753
+ dropdownWidth="228px"
754
+ onSelect={[Function]}
755
+ placeholder="Status"
756
+ placement="bottomLeft"
757
+ selectedValue="approved"
758
+ showBadge={true}
759
+ width="90px"
760
+ />
761
+ <CapSelectFilter
762
+ data={
763
+ Array [
764
+ Object {
765
+ "key": "utility",
766
+ "label": <FormattedMessage
767
+ defaultMessage="Utility"
768
+ id="creatives.containersV2.Whatsapp.utility"
769
+ values={Object {}}
770
+ />,
771
+ "tagColor": "#f2e7fe",
772
+ "tagTextColor": "#a451ff",
773
+ "tooltipLabel": <FormattedMessage
774
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
775
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
776
+ values={Object {}}
777
+ />,
778
+ "value": "UTILITY",
779
+ },
780
+ Object {
781
+ "key": "marketing",
782
+ "label": <FormattedMessage
783
+ defaultMessage="Marketing"
784
+ id="creatives.containersV2.Whatsapp.marketing"
785
+ values={Object {}}
786
+ />,
787
+ "tagColor": "#ffe5d2",
788
+ "tagTextColor": "#f87d23",
789
+ "tooltipLabel": <FormattedMessage
790
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
791
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
792
+ values={Object {}}
793
+ />,
794
+ "value": "MARKETING",
795
+ },
796
+ Object {
797
+ "key": "authentication",
798
+ "label": <FormattedMessage
799
+ defaultMessage="Authentication"
800
+ id="creatives.containersV2.Whatsapp.authentication"
801
+ values={Object {}}
802
+ />,
803
+ "tagColor": "#ecf7ec",
804
+ "tagTextColor": "#6bb56b",
805
+ "tooltipLabel": <FormattedMessage
806
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
807
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
808
+ values={Object {}}
809
+ />,
810
+ "value": "AUTHENTICATION",
811
+ },
812
+ ]
813
+ }
814
+ dropdownMaxHeight="320px"
815
+ dropdownWidth="228px"
816
+ onSelect={[Function]}
817
+ overlayStyle={
787
818
  Object {
788
- "key": "authentication",
789
- "label": <FormattedMessage
790
- defaultMessage="Authentication"
791
- id="creatives.containersV2.Whatsapp.authentication"
792
- values={Object {}}
793
- />,
794
- "tagColor": "#ecf7ec",
795
- "tagTextColor": "#6bb56b",
796
- "tooltipLabel": <FormattedMessage
797
- defaultMessage="Send codes that allow your customers to securely access their accounts."
798
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
799
- values={Object {}}
800
- />,
801
- "value": "AUTHENTICATION",
802
- },
803
- ]
804
- }
805
- dropdownMaxHeight="320px"
806
- dropdownWidth="228px"
807
- onSelect={[Function]}
808
- overlayStyle={
809
- Object {
810
- "overflowY": "hidden",
819
+ "overflowY": "hidden",
820
+ }
811
821
  }
812
- }
813
- placeholder="Category"
814
- placement="bottomLeft"
815
- selectedValue=""
816
- showBadge={true}
817
- width="105px"
822
+ placeholder="Category"
823
+ placement="bottomLeft"
824
+ selectedValue=""
825
+ showBadge={true}
826
+ width="105px"
827
+ />
828
+ </div>
829
+ <Component />
830
+ <Component />
831
+ <div
832
+ className="template-listing-header-actions"
818
833
  />
819
834
  </div>
820
- <Component />
821
- <Component />
822
- <div
823
- className="template-listing-header-actions"
824
- >
825
- <CapButton
826
- className="create-new-whatsapp margin-l-8 margin-b-12"
827
- disabled={false}
828
- isAddBtn={false}
829
- onClick={[Function]}
830
- type="primary"
835
+ <div>
836
+ <div
837
+ className="action-container__create-row"
831
838
  >
832
- Create new
833
- </CapButton>
839
+ <CapButton
840
+ className="create-new-whatsapp margin-l-8 margin-b-12"
841
+ disabled={false}
842
+ isAddBtn={false}
843
+ onClick={[Function]}
844
+ type="primary"
845
+ >
846
+ Create new
847
+ </CapButton>
848
+ </div>
834
849
  </div>
835
850
  </div>
836
851
  </div>
@@ -1092,165 +1107,170 @@ exports[`Test Templates container Test max templates exceeded 1`] = `
1092
1107
  <div
1093
1108
  className="action-container"
1094
1109
  >
1095
- <_Class
1096
- className="search-text"
1097
- disabled={false}
1098
- labelPosition="top"
1099
- onChange={[Function]}
1100
- onClear={[Function]}
1101
- onScroll={[Function]}
1102
- placeholder="Search"
1103
- style={
1104
- Object {
1105
- "width": "210px",
1106
- }
1107
- }
1108
- value=""
1109
- />
1110
1110
  <div
1111
- className="whatsapp-filters"
1111
+ className="action-container__toolbar-row"
1112
1112
  >
1113
- <CapSelectFilter
1114
- data={
1115
- Array [
1116
- Object {
1117
- "key": "awaitingApproval",
1118
- "label": <FormattedMessage
1119
- defaultMessage="Awaiting approval"
1120
- id="creatives.containersV2.Whatsapp.awaitingApproval"
1121
- values={Object {}}
1122
- />,
1123
- "value": "awaitingApproval",
1124
- },
1125
- Object {
1126
- "key": "approved",
1127
- "label": <FormattedMessage
1128
- defaultMessage="Approved"
1129
- id="creatives.containersV2.Whatsapp.approved"
1130
- values={Object {}}
1131
- />,
1132
- "value": "approved",
1133
- },
1134
- Object {
1135
- "key": "rejected",
1136
- "label": <FormattedMessage
1137
- defaultMessage="Rejected"
1138
- id="creatives.containersV2.Whatsapp.rejected"
1139
- values={Object {}}
1140
- />,
1141
- "value": "rejected",
1142
- },
1143
- Object {
1144
- "key": "pending",
1145
- "label": <FormattedMessage
1146
- defaultMessage="Pending"
1147
- id="creatives.containersV2.Whatsapp.pending"
1148
- values={Object {}}
1149
- />,
1150
- "value": "pending",
1151
- },
1152
- Object {
1153
- "key": "paused",
1154
- "label": <FormattedMessage
1155
- defaultMessage="Paused"
1156
- id="creatives.containersV2.Whatsapp.paused"
1157
- values={Object {}}
1158
- />,
1159
- "value": "paused",
1160
- },
1161
- ]
1162
- }
1163
- dropdownMaxHeight="320px"
1164
- dropdownWidth="228px"
1165
- onSelect={[Function]}
1166
- placeholder="Status"
1167
- placement="bottomLeft"
1168
- selectedValue=""
1169
- showBadge={true}
1170
- width="90px"
1113
+ <_Class
1114
+ className="search-text"
1115
+ disabled={false}
1116
+ labelPosition="top"
1117
+ onChange={[Function]}
1118
+ onClear={[Function]}
1119
+ onScroll={[Function]}
1120
+ onSearch={[Function]}
1121
+ placeholder="Search"
1122
+ value=""
1171
1123
  />
1172
- <CapSelectFilter
1173
- data={
1174
- Array [
1175
- Object {
1176
- "key": "utility",
1177
- "label": <FormattedMessage
1178
- defaultMessage="Utility"
1179
- id="creatives.containersV2.Whatsapp.utility"
1180
- values={Object {}}
1181
- />,
1182
- "tagColor": "#f2e7fe",
1183
- "tagTextColor": "#a451ff",
1184
- "tooltipLabel": <FormattedMessage
1185
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
1186
- id="creatives.containersV2.Whatsapp.utilityTooltip"
1187
- values={Object {}}
1188
- />,
1189
- "value": "UTILITY",
1190
- },
1191
- Object {
1192
- "key": "marketing",
1193
- "label": <FormattedMessage
1194
- defaultMessage="Marketing"
1195
- id="creatives.containersV2.Whatsapp.marketing"
1196
- values={Object {}}
1197
- />,
1198
- "tagColor": "#ffe5d2",
1199
- "tagTextColor": "#f87d23",
1200
- "tooltipLabel": <FormattedMessage
1201
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
1202
- id="creatives.containersV2.Whatsapp.marketingTooltip"
1203
- values={Object {}}
1204
- />,
1205
- "value": "MARKETING",
1206
- },
1124
+ <div
1125
+ className="whatsapp-filters"
1126
+ >
1127
+ <CapSelectFilter
1128
+ data={
1129
+ Array [
1130
+ Object {
1131
+ "key": "awaitingApproval",
1132
+ "label": <FormattedMessage
1133
+ defaultMessage="Awaiting approval"
1134
+ id="creatives.containersV2.Whatsapp.awaitingApproval"
1135
+ values={Object {}}
1136
+ />,
1137
+ "value": "awaitingApproval",
1138
+ },
1139
+ Object {
1140
+ "key": "approved",
1141
+ "label": <FormattedMessage
1142
+ defaultMessage="Approved"
1143
+ id="creatives.containersV2.Whatsapp.approved"
1144
+ values={Object {}}
1145
+ />,
1146
+ "value": "approved",
1147
+ },
1148
+ Object {
1149
+ "key": "rejected",
1150
+ "label": <FormattedMessage
1151
+ defaultMessage="Rejected"
1152
+ id="creatives.containersV2.Whatsapp.rejected"
1153
+ values={Object {}}
1154
+ />,
1155
+ "value": "rejected",
1156
+ },
1157
+ Object {
1158
+ "key": "pending",
1159
+ "label": <FormattedMessage
1160
+ defaultMessage="Pending"
1161
+ id="creatives.containersV2.Whatsapp.pending"
1162
+ values={Object {}}
1163
+ />,
1164
+ "value": "pending",
1165
+ },
1166
+ Object {
1167
+ "key": "paused",
1168
+ "label": <FormattedMessage
1169
+ defaultMessage="Paused"
1170
+ id="creatives.containersV2.Whatsapp.paused"
1171
+ values={Object {}}
1172
+ />,
1173
+ "value": "paused",
1174
+ },
1175
+ ]
1176
+ }
1177
+ dropdownMaxHeight="320px"
1178
+ dropdownWidth="228px"
1179
+ onSelect={[Function]}
1180
+ placeholder="Status"
1181
+ placement="bottomLeft"
1182
+ selectedValue=""
1183
+ showBadge={true}
1184
+ width="90px"
1185
+ />
1186
+ <CapSelectFilter
1187
+ data={
1188
+ Array [
1189
+ Object {
1190
+ "key": "utility",
1191
+ "label": <FormattedMessage
1192
+ defaultMessage="Utility"
1193
+ id="creatives.containersV2.Whatsapp.utility"
1194
+ values={Object {}}
1195
+ />,
1196
+ "tagColor": "#f2e7fe",
1197
+ "tagTextColor": "#a451ff",
1198
+ "tooltipLabel": <FormattedMessage
1199
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
1200
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
1201
+ values={Object {}}
1202
+ />,
1203
+ "value": "UTILITY",
1204
+ },
1205
+ Object {
1206
+ "key": "marketing",
1207
+ "label": <FormattedMessage
1208
+ defaultMessage="Marketing"
1209
+ id="creatives.containersV2.Whatsapp.marketing"
1210
+ values={Object {}}
1211
+ />,
1212
+ "tagColor": "#ffe5d2",
1213
+ "tagTextColor": "#f87d23",
1214
+ "tooltipLabel": <FormattedMessage
1215
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
1216
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
1217
+ values={Object {}}
1218
+ />,
1219
+ "value": "MARKETING",
1220
+ },
1221
+ Object {
1222
+ "key": "authentication",
1223
+ "label": <FormattedMessage
1224
+ defaultMessage="Authentication"
1225
+ id="creatives.containersV2.Whatsapp.authentication"
1226
+ values={Object {}}
1227
+ />,
1228
+ "tagColor": "#ecf7ec",
1229
+ "tagTextColor": "#6bb56b",
1230
+ "tooltipLabel": <FormattedMessage
1231
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
1232
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
1233
+ values={Object {}}
1234
+ />,
1235
+ "value": "AUTHENTICATION",
1236
+ },
1237
+ ]
1238
+ }
1239
+ dropdownMaxHeight="320px"
1240
+ dropdownWidth="228px"
1241
+ onSelect={[Function]}
1242
+ overlayStyle={
1207
1243
  Object {
1208
- "key": "authentication",
1209
- "label": <FormattedMessage
1210
- defaultMessage="Authentication"
1211
- id="creatives.containersV2.Whatsapp.authentication"
1212
- values={Object {}}
1213
- />,
1214
- "tagColor": "#ecf7ec",
1215
- "tagTextColor": "#6bb56b",
1216
- "tooltipLabel": <FormattedMessage
1217
- defaultMessage="Send codes that allow your customers to securely access their accounts."
1218
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
1219
- values={Object {}}
1220
- />,
1221
- "value": "AUTHENTICATION",
1222
- },
1223
- ]
1224
- }
1225
- dropdownMaxHeight="320px"
1226
- dropdownWidth="228px"
1227
- onSelect={[Function]}
1228
- overlayStyle={
1229
- Object {
1230
- "overflowY": "hidden",
1244
+ "overflowY": "hidden",
1245
+ }
1231
1246
  }
1232
- }
1233
- placeholder="Category"
1234
- placement="bottomLeft"
1235
- selectedValue=""
1236
- showBadge={true}
1237
- width="105px"
1247
+ placeholder="Category"
1248
+ placement="bottomLeft"
1249
+ selectedValue=""
1250
+ showBadge={true}
1251
+ width="105px"
1252
+ />
1253
+ </div>
1254
+ <Component />
1255
+ <Component />
1256
+ <div
1257
+ className="template-listing-header-actions"
1238
1258
  />
1239
1259
  </div>
1240
- <Component />
1241
- <Component />
1242
- <div
1243
- className="template-listing-header-actions"
1244
- >
1245
- <CapButton
1246
- className="create-new-whatsapp margin-l-8 margin-b-12"
1247
- disabled={false}
1248
- isAddBtn={false}
1249
- onClick={[Function]}
1250
- type="primary"
1260
+ <div>
1261
+ <div
1262
+ className="action-container__create-row"
1251
1263
  >
1252
- Create new
1253
- </CapButton>
1264
+ <CapButton
1265
+ className="create-new-whatsapp margin-l-8 margin-b-12"
1266
+ disabled={false}
1267
+ isAddBtn={false}
1268
+ onClick={[Function]}
1269
+ type="primary"
1270
+ >
1271
+ Create new
1272
+ </CapButton>
1273
+ </div>
1254
1274
  </div>
1255
1275
  </div>
1256
1276
  </div>
@@ -1565,165 +1585,170 @@ exports[`Test Templates container Test max templates not exceeded 1`] = `
1565
1585
  <div
1566
1586
  className="action-container"
1567
1587
  >
1568
- <_Class
1569
- className="search-text"
1570
- disabled={false}
1571
- labelPosition="top"
1572
- onChange={[Function]}
1573
- onClear={[Function]}
1574
- onScroll={[Function]}
1575
- placeholder="Search"
1576
- style={
1577
- Object {
1578
- "width": "210px",
1579
- }
1580
- }
1581
- value=""
1582
- />
1583
1588
  <div
1584
- className="whatsapp-filters"
1589
+ className="action-container__toolbar-row"
1585
1590
  >
1586
- <CapSelectFilter
1587
- data={
1588
- Array [
1589
- Object {
1590
- "key": "awaitingApproval",
1591
- "label": <FormattedMessage
1592
- defaultMessage="Awaiting approval"
1593
- id="creatives.containersV2.Whatsapp.awaitingApproval"
1594
- values={Object {}}
1595
- />,
1596
- "value": "awaitingApproval",
1597
- },
1598
- Object {
1599
- "key": "approved",
1600
- "label": <FormattedMessage
1601
- defaultMessage="Approved"
1602
- id="creatives.containersV2.Whatsapp.approved"
1603
- values={Object {}}
1604
- />,
1605
- "value": "approved",
1606
- },
1607
- Object {
1608
- "key": "rejected",
1609
- "label": <FormattedMessage
1610
- defaultMessage="Rejected"
1611
- id="creatives.containersV2.Whatsapp.rejected"
1612
- values={Object {}}
1613
- />,
1614
- "value": "rejected",
1615
- },
1616
- Object {
1617
- "key": "pending",
1618
- "label": <FormattedMessage
1619
- defaultMessage="Pending"
1620
- id="creatives.containersV2.Whatsapp.pending"
1621
- values={Object {}}
1622
- />,
1623
- "value": "pending",
1624
- },
1625
- Object {
1626
- "key": "paused",
1627
- "label": <FormattedMessage
1628
- defaultMessage="Paused"
1629
- id="creatives.containersV2.Whatsapp.paused"
1630
- values={Object {}}
1631
- />,
1632
- "value": "paused",
1633
- },
1634
- ]
1635
- }
1636
- dropdownMaxHeight="320px"
1637
- dropdownWidth="228px"
1638
- onSelect={[Function]}
1639
- placeholder="Status"
1640
- placement="bottomLeft"
1641
- selectedValue=""
1642
- showBadge={true}
1643
- width="90px"
1591
+ <_Class
1592
+ className="search-text"
1593
+ disabled={false}
1594
+ labelPosition="top"
1595
+ onChange={[Function]}
1596
+ onClear={[Function]}
1597
+ onScroll={[Function]}
1598
+ onSearch={[Function]}
1599
+ placeholder="Search"
1600
+ value=""
1644
1601
  />
1645
- <CapSelectFilter
1646
- data={
1647
- Array [
1648
- Object {
1649
- "key": "utility",
1650
- "label": <FormattedMessage
1651
- defaultMessage="Utility"
1652
- id="creatives.containersV2.Whatsapp.utility"
1653
- values={Object {}}
1654
- />,
1655
- "tagColor": "#f2e7fe",
1656
- "tagTextColor": "#a451ff",
1657
- "tooltipLabel": <FormattedMessage
1658
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
1659
- id="creatives.containersV2.Whatsapp.utilityTooltip"
1660
- values={Object {}}
1661
- />,
1662
- "value": "UTILITY",
1663
- },
1664
- Object {
1665
- "key": "marketing",
1666
- "label": <FormattedMessage
1667
- defaultMessage="Marketing"
1668
- id="creatives.containersV2.Whatsapp.marketing"
1669
- values={Object {}}
1670
- />,
1671
- "tagColor": "#ffe5d2",
1672
- "tagTextColor": "#f87d23",
1673
- "tooltipLabel": <FormattedMessage
1674
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
1675
- id="creatives.containersV2.Whatsapp.marketingTooltip"
1676
- values={Object {}}
1677
- />,
1678
- "value": "MARKETING",
1679
- },
1602
+ <div
1603
+ className="whatsapp-filters"
1604
+ >
1605
+ <CapSelectFilter
1606
+ data={
1607
+ Array [
1608
+ Object {
1609
+ "key": "awaitingApproval",
1610
+ "label": <FormattedMessage
1611
+ defaultMessage="Awaiting approval"
1612
+ id="creatives.containersV2.Whatsapp.awaitingApproval"
1613
+ values={Object {}}
1614
+ />,
1615
+ "value": "awaitingApproval",
1616
+ },
1617
+ Object {
1618
+ "key": "approved",
1619
+ "label": <FormattedMessage
1620
+ defaultMessage="Approved"
1621
+ id="creatives.containersV2.Whatsapp.approved"
1622
+ values={Object {}}
1623
+ />,
1624
+ "value": "approved",
1625
+ },
1626
+ Object {
1627
+ "key": "rejected",
1628
+ "label": <FormattedMessage
1629
+ defaultMessage="Rejected"
1630
+ id="creatives.containersV2.Whatsapp.rejected"
1631
+ values={Object {}}
1632
+ />,
1633
+ "value": "rejected",
1634
+ },
1635
+ Object {
1636
+ "key": "pending",
1637
+ "label": <FormattedMessage
1638
+ defaultMessage="Pending"
1639
+ id="creatives.containersV2.Whatsapp.pending"
1640
+ values={Object {}}
1641
+ />,
1642
+ "value": "pending",
1643
+ },
1644
+ Object {
1645
+ "key": "paused",
1646
+ "label": <FormattedMessage
1647
+ defaultMessage="Paused"
1648
+ id="creatives.containersV2.Whatsapp.paused"
1649
+ values={Object {}}
1650
+ />,
1651
+ "value": "paused",
1652
+ },
1653
+ ]
1654
+ }
1655
+ dropdownMaxHeight="320px"
1656
+ dropdownWidth="228px"
1657
+ onSelect={[Function]}
1658
+ placeholder="Status"
1659
+ placement="bottomLeft"
1660
+ selectedValue=""
1661
+ showBadge={true}
1662
+ width="90px"
1663
+ />
1664
+ <CapSelectFilter
1665
+ data={
1666
+ Array [
1667
+ Object {
1668
+ "key": "utility",
1669
+ "label": <FormattedMessage
1670
+ defaultMessage="Utility"
1671
+ id="creatives.containersV2.Whatsapp.utility"
1672
+ values={Object {}}
1673
+ />,
1674
+ "tagColor": "#f2e7fe",
1675
+ "tagTextColor": "#a451ff",
1676
+ "tooltipLabel": <FormattedMessage
1677
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
1678
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
1679
+ values={Object {}}
1680
+ />,
1681
+ "value": "UTILITY",
1682
+ },
1683
+ Object {
1684
+ "key": "marketing",
1685
+ "label": <FormattedMessage
1686
+ defaultMessage="Marketing"
1687
+ id="creatives.containersV2.Whatsapp.marketing"
1688
+ values={Object {}}
1689
+ />,
1690
+ "tagColor": "#ffe5d2",
1691
+ "tagTextColor": "#f87d23",
1692
+ "tooltipLabel": <FormattedMessage
1693
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
1694
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
1695
+ values={Object {}}
1696
+ />,
1697
+ "value": "MARKETING",
1698
+ },
1699
+ Object {
1700
+ "key": "authentication",
1701
+ "label": <FormattedMessage
1702
+ defaultMessage="Authentication"
1703
+ id="creatives.containersV2.Whatsapp.authentication"
1704
+ values={Object {}}
1705
+ />,
1706
+ "tagColor": "#ecf7ec",
1707
+ "tagTextColor": "#6bb56b",
1708
+ "tooltipLabel": <FormattedMessage
1709
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
1710
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
1711
+ values={Object {}}
1712
+ />,
1713
+ "value": "AUTHENTICATION",
1714
+ },
1715
+ ]
1716
+ }
1717
+ dropdownMaxHeight="320px"
1718
+ dropdownWidth="228px"
1719
+ onSelect={[Function]}
1720
+ overlayStyle={
1680
1721
  Object {
1681
- "key": "authentication",
1682
- "label": <FormattedMessage
1683
- defaultMessage="Authentication"
1684
- id="creatives.containersV2.Whatsapp.authentication"
1685
- values={Object {}}
1686
- />,
1687
- "tagColor": "#ecf7ec",
1688
- "tagTextColor": "#6bb56b",
1689
- "tooltipLabel": <FormattedMessage
1690
- defaultMessage="Send codes that allow your customers to securely access their accounts."
1691
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
1692
- values={Object {}}
1693
- />,
1694
- "value": "AUTHENTICATION",
1695
- },
1696
- ]
1697
- }
1698
- dropdownMaxHeight="320px"
1699
- dropdownWidth="228px"
1700
- onSelect={[Function]}
1701
- overlayStyle={
1702
- Object {
1703
- "overflowY": "hidden",
1722
+ "overflowY": "hidden",
1723
+ }
1704
1724
  }
1705
- }
1706
- placeholder="Category"
1707
- placement="bottomLeft"
1708
- selectedValue=""
1709
- showBadge={true}
1710
- width="105px"
1725
+ placeholder="Category"
1726
+ placement="bottomLeft"
1727
+ selectedValue=""
1728
+ showBadge={true}
1729
+ width="105px"
1730
+ />
1731
+ </div>
1732
+ <Component />
1733
+ <Component />
1734
+ <div
1735
+ className="template-listing-header-actions"
1711
1736
  />
1712
1737
  </div>
1713
- <Component />
1714
- <Component />
1715
- <div
1716
- className="template-listing-header-actions"
1717
- >
1718
- <CapButton
1719
- className="create-new-whatsapp margin-l-8 margin-b-12"
1720
- disabled={false}
1721
- isAddBtn={false}
1722
- onClick={[Function]}
1723
- type="primary"
1738
+ <div>
1739
+ <div
1740
+ className="action-container__create-row"
1724
1741
  >
1725
- Create new
1726
- </CapButton>
1742
+ <CapButton
1743
+ className="create-new-whatsapp margin-l-8 margin-b-12"
1744
+ disabled={false}
1745
+ isAddBtn={false}
1746
+ onClick={[Function]}
1747
+ type="primary"
1748
+ >
1749
+ Create new
1750
+ </CapButton>
1751
+ </div>
1727
1752
  </div>
1728
1753
  </div>
1729
1754
  </div>
@@ -2038,165 +2063,170 @@ exports[`Test Templates container Test max templates warning 1`] = `
2038
2063
  <div
2039
2064
  className="action-container"
2040
2065
  >
2041
- <_Class
2042
- className="search-text"
2043
- disabled={false}
2044
- labelPosition="top"
2045
- onChange={[Function]}
2046
- onClear={[Function]}
2047
- onScroll={[Function]}
2048
- placeholder="Search"
2049
- style={
2050
- Object {
2051
- "width": "210px",
2052
- }
2053
- }
2054
- value=""
2055
- />
2056
2066
  <div
2057
- className="whatsapp-filters"
2067
+ className="action-container__toolbar-row"
2058
2068
  >
2059
- <CapSelectFilter
2060
- data={
2061
- Array [
2062
- Object {
2063
- "key": "awaitingApproval",
2064
- "label": <FormattedMessage
2065
- defaultMessage="Awaiting approval"
2066
- id="creatives.containersV2.Whatsapp.awaitingApproval"
2067
- values={Object {}}
2068
- />,
2069
- "value": "awaitingApproval",
2070
- },
2071
- Object {
2072
- "key": "approved",
2073
- "label": <FormattedMessage
2074
- defaultMessage="Approved"
2075
- id="creatives.containersV2.Whatsapp.approved"
2076
- values={Object {}}
2077
- />,
2078
- "value": "approved",
2079
- },
2080
- Object {
2081
- "key": "rejected",
2082
- "label": <FormattedMessage
2083
- defaultMessage="Rejected"
2084
- id="creatives.containersV2.Whatsapp.rejected"
2085
- values={Object {}}
2086
- />,
2087
- "value": "rejected",
2088
- },
2089
- Object {
2090
- "key": "pending",
2091
- "label": <FormattedMessage
2092
- defaultMessage="Pending"
2093
- id="creatives.containersV2.Whatsapp.pending"
2094
- values={Object {}}
2095
- />,
2096
- "value": "pending",
2097
- },
2098
- Object {
2099
- "key": "paused",
2100
- "label": <FormattedMessage
2101
- defaultMessage="Paused"
2102
- id="creatives.containersV2.Whatsapp.paused"
2103
- values={Object {}}
2104
- />,
2105
- "value": "paused",
2106
- },
2107
- ]
2108
- }
2109
- dropdownMaxHeight="320px"
2110
- dropdownWidth="228px"
2111
- onSelect={[Function]}
2112
- placeholder="Status"
2113
- placement="bottomLeft"
2114
- selectedValue=""
2115
- showBadge={true}
2116
- width="90px"
2069
+ <_Class
2070
+ className="search-text"
2071
+ disabled={false}
2072
+ labelPosition="top"
2073
+ onChange={[Function]}
2074
+ onClear={[Function]}
2075
+ onScroll={[Function]}
2076
+ onSearch={[Function]}
2077
+ placeholder="Search"
2078
+ value=""
2117
2079
  />
2118
- <CapSelectFilter
2119
- data={
2120
- Array [
2121
- Object {
2122
- "key": "utility",
2123
- "label": <FormattedMessage
2124
- defaultMessage="Utility"
2125
- id="creatives.containersV2.Whatsapp.utility"
2126
- values={Object {}}
2127
- />,
2128
- "tagColor": "#f2e7fe",
2129
- "tagTextColor": "#a451ff",
2130
- "tooltipLabel": <FormattedMessage
2131
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
2132
- id="creatives.containersV2.Whatsapp.utilityTooltip"
2133
- values={Object {}}
2134
- />,
2135
- "value": "UTILITY",
2136
- },
2137
- Object {
2138
- "key": "marketing",
2139
- "label": <FormattedMessage
2140
- defaultMessage="Marketing"
2141
- id="creatives.containersV2.Whatsapp.marketing"
2142
- values={Object {}}
2143
- />,
2144
- "tagColor": "#ffe5d2",
2145
- "tagTextColor": "#f87d23",
2146
- "tooltipLabel": <FormattedMessage
2147
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
2148
- id="creatives.containersV2.Whatsapp.marketingTooltip"
2149
- values={Object {}}
2150
- />,
2151
- "value": "MARKETING",
2152
- },
2080
+ <div
2081
+ className="whatsapp-filters"
2082
+ >
2083
+ <CapSelectFilter
2084
+ data={
2085
+ Array [
2086
+ Object {
2087
+ "key": "awaitingApproval",
2088
+ "label": <FormattedMessage
2089
+ defaultMessage="Awaiting approval"
2090
+ id="creatives.containersV2.Whatsapp.awaitingApproval"
2091
+ values={Object {}}
2092
+ />,
2093
+ "value": "awaitingApproval",
2094
+ },
2095
+ Object {
2096
+ "key": "approved",
2097
+ "label": <FormattedMessage
2098
+ defaultMessage="Approved"
2099
+ id="creatives.containersV2.Whatsapp.approved"
2100
+ values={Object {}}
2101
+ />,
2102
+ "value": "approved",
2103
+ },
2104
+ Object {
2105
+ "key": "rejected",
2106
+ "label": <FormattedMessage
2107
+ defaultMessage="Rejected"
2108
+ id="creatives.containersV2.Whatsapp.rejected"
2109
+ values={Object {}}
2110
+ />,
2111
+ "value": "rejected",
2112
+ },
2113
+ Object {
2114
+ "key": "pending",
2115
+ "label": <FormattedMessage
2116
+ defaultMessage="Pending"
2117
+ id="creatives.containersV2.Whatsapp.pending"
2118
+ values={Object {}}
2119
+ />,
2120
+ "value": "pending",
2121
+ },
2122
+ Object {
2123
+ "key": "paused",
2124
+ "label": <FormattedMessage
2125
+ defaultMessage="Paused"
2126
+ id="creatives.containersV2.Whatsapp.paused"
2127
+ values={Object {}}
2128
+ />,
2129
+ "value": "paused",
2130
+ },
2131
+ ]
2132
+ }
2133
+ dropdownMaxHeight="320px"
2134
+ dropdownWidth="228px"
2135
+ onSelect={[Function]}
2136
+ placeholder="Status"
2137
+ placement="bottomLeft"
2138
+ selectedValue=""
2139
+ showBadge={true}
2140
+ width="90px"
2141
+ />
2142
+ <CapSelectFilter
2143
+ data={
2144
+ Array [
2145
+ Object {
2146
+ "key": "utility",
2147
+ "label": <FormattedMessage
2148
+ defaultMessage="Utility"
2149
+ id="creatives.containersV2.Whatsapp.utility"
2150
+ values={Object {}}
2151
+ />,
2152
+ "tagColor": "#f2e7fe",
2153
+ "tagTextColor": "#a451ff",
2154
+ "tooltipLabel": <FormattedMessage
2155
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
2156
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
2157
+ values={Object {}}
2158
+ />,
2159
+ "value": "UTILITY",
2160
+ },
2161
+ Object {
2162
+ "key": "marketing",
2163
+ "label": <FormattedMessage
2164
+ defaultMessage="Marketing"
2165
+ id="creatives.containersV2.Whatsapp.marketing"
2166
+ values={Object {}}
2167
+ />,
2168
+ "tagColor": "#ffe5d2",
2169
+ "tagTextColor": "#f87d23",
2170
+ "tooltipLabel": <FormattedMessage
2171
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
2172
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
2173
+ values={Object {}}
2174
+ />,
2175
+ "value": "MARKETING",
2176
+ },
2177
+ Object {
2178
+ "key": "authentication",
2179
+ "label": <FormattedMessage
2180
+ defaultMessage="Authentication"
2181
+ id="creatives.containersV2.Whatsapp.authentication"
2182
+ values={Object {}}
2183
+ />,
2184
+ "tagColor": "#ecf7ec",
2185
+ "tagTextColor": "#6bb56b",
2186
+ "tooltipLabel": <FormattedMessage
2187
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
2188
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
2189
+ values={Object {}}
2190
+ />,
2191
+ "value": "AUTHENTICATION",
2192
+ },
2193
+ ]
2194
+ }
2195
+ dropdownMaxHeight="320px"
2196
+ dropdownWidth="228px"
2197
+ onSelect={[Function]}
2198
+ overlayStyle={
2153
2199
  Object {
2154
- "key": "authentication",
2155
- "label": <FormattedMessage
2156
- defaultMessage="Authentication"
2157
- id="creatives.containersV2.Whatsapp.authentication"
2158
- values={Object {}}
2159
- />,
2160
- "tagColor": "#ecf7ec",
2161
- "tagTextColor": "#6bb56b",
2162
- "tooltipLabel": <FormattedMessage
2163
- defaultMessage="Send codes that allow your customers to securely access their accounts."
2164
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
2165
- values={Object {}}
2166
- />,
2167
- "value": "AUTHENTICATION",
2168
- },
2169
- ]
2170
- }
2171
- dropdownMaxHeight="320px"
2172
- dropdownWidth="228px"
2173
- onSelect={[Function]}
2174
- overlayStyle={
2175
- Object {
2176
- "overflowY": "hidden",
2200
+ "overflowY": "hidden",
2201
+ }
2177
2202
  }
2178
- }
2179
- placeholder="Category"
2180
- placement="bottomLeft"
2181
- selectedValue=""
2182
- showBadge={true}
2183
- width="105px"
2203
+ placeholder="Category"
2204
+ placement="bottomLeft"
2205
+ selectedValue=""
2206
+ showBadge={true}
2207
+ width="105px"
2208
+ />
2209
+ </div>
2210
+ <Component />
2211
+ <Component />
2212
+ <div
2213
+ className="template-listing-header-actions"
2184
2214
  />
2185
2215
  </div>
2186
- <Component />
2187
- <Component />
2188
- <div
2189
- className="template-listing-header-actions"
2190
- >
2191
- <CapButton
2192
- className="create-new-whatsapp margin-l-8 margin-b-12"
2193
- disabled={false}
2194
- isAddBtn={false}
2195
- onClick={[Function]}
2196
- type="primary"
2216
+ <div>
2217
+ <div
2218
+ className="action-container__create-row"
2197
2219
  >
2198
- Create new
2199
- </CapButton>
2220
+ <CapButton
2221
+ className="create-new-whatsapp margin-l-8 margin-b-12"
2222
+ disabled={false}
2223
+ isAddBtn={false}
2224
+ onClick={[Function]}
2225
+ type="primary"
2226
+ >
2227
+ Create new
2228
+ </CapButton>
2229
+ </div>
2200
2230
  </div>
2201
2231
  </div>
2202
2232
  </div>
@@ -2511,109 +2541,114 @@ exports[`Test Templates container Test removing all whatsapp filterss 1`] = `
2511
2541
  <div
2512
2542
  className="action-container"
2513
2543
  >
2514
- <_Class
2515
- className="search-text"
2516
- disabled={false}
2517
- labelPosition="top"
2518
- onChange={[Function]}
2519
- onClear={[Function]}
2520
- onScroll={[Function]}
2521
- placeholder="Search"
2522
- style={
2523
- Object {
2524
- "width": "210px",
2525
- }
2526
- }
2527
- value=""
2528
- />
2529
2544
  <div
2530
- className="whatsapp-filters"
2545
+ className="action-container__toolbar-row"
2531
2546
  >
2532
- <CapSelectFilter
2533
- data={
2534
- Array [
2535
- Object {
2536
- "key": "utility",
2537
- "label": <FormattedMessage
2538
- defaultMessage="Utility"
2539
- id="creatives.containersV2.Whatsapp.utility"
2540
- values={Object {}}
2541
- />,
2542
- "tagColor": "#f2e7fe",
2543
- "tagTextColor": "#a451ff",
2544
- "tooltipLabel": <FormattedMessage
2545
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
2546
- id="creatives.containersV2.Whatsapp.utilityTooltip"
2547
- values={Object {}}
2548
- />,
2549
- "value": "UTILITY",
2550
- },
2551
- Object {
2552
- "key": "marketing",
2553
- "label": <FormattedMessage
2554
- defaultMessage="Marketing"
2555
- id="creatives.containersV2.Whatsapp.marketing"
2556
- values={Object {}}
2557
- />,
2558
- "tagColor": "#ffe5d2",
2559
- "tagTextColor": "#f87d23",
2560
- "tooltipLabel": <FormattedMessage
2561
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
2562
- id="creatives.containersV2.Whatsapp.marketingTooltip"
2563
- values={Object {}}
2564
- />,
2565
- "value": "MARKETING",
2566
- },
2547
+ <_Class
2548
+ className="search-text"
2549
+ disabled={false}
2550
+ labelPosition="top"
2551
+ onChange={[Function]}
2552
+ onClear={[Function]}
2553
+ onScroll={[Function]}
2554
+ onSearch={[Function]}
2555
+ placeholder="Search"
2556
+ value=""
2557
+ />
2558
+ <div
2559
+ className="whatsapp-filters"
2560
+ >
2561
+ <CapSelectFilter
2562
+ data={
2563
+ Array [
2564
+ Object {
2565
+ "key": "utility",
2566
+ "label": <FormattedMessage
2567
+ defaultMessage="Utility"
2568
+ id="creatives.containersV2.Whatsapp.utility"
2569
+ values={Object {}}
2570
+ />,
2571
+ "tagColor": "#f2e7fe",
2572
+ "tagTextColor": "#a451ff",
2573
+ "tooltipLabel": <FormattedMessage
2574
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
2575
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
2576
+ values={Object {}}
2577
+ />,
2578
+ "value": "UTILITY",
2579
+ },
2580
+ Object {
2581
+ "key": "marketing",
2582
+ "label": <FormattedMessage
2583
+ defaultMessage="Marketing"
2584
+ id="creatives.containersV2.Whatsapp.marketing"
2585
+ values={Object {}}
2586
+ />,
2587
+ "tagColor": "#ffe5d2",
2588
+ "tagTextColor": "#f87d23",
2589
+ "tooltipLabel": <FormattedMessage
2590
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
2591
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
2592
+ values={Object {}}
2593
+ />,
2594
+ "value": "MARKETING",
2595
+ },
2596
+ Object {
2597
+ "key": "authentication",
2598
+ "label": <FormattedMessage
2599
+ defaultMessage="Authentication"
2600
+ id="creatives.containersV2.Whatsapp.authentication"
2601
+ values={Object {}}
2602
+ />,
2603
+ "tagColor": "#ecf7ec",
2604
+ "tagTextColor": "#6bb56b",
2605
+ "tooltipLabel": <FormattedMessage
2606
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
2607
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
2608
+ values={Object {}}
2609
+ />,
2610
+ "value": "AUTHENTICATION",
2611
+ },
2612
+ ]
2613
+ }
2614
+ dropdownMaxHeight="320px"
2615
+ dropdownWidth="228px"
2616
+ onSelect={[Function]}
2617
+ overlayStyle={
2567
2618
  Object {
2568
- "key": "authentication",
2569
- "label": <FormattedMessage
2570
- defaultMessage="Authentication"
2571
- id="creatives.containersV2.Whatsapp.authentication"
2572
- values={Object {}}
2573
- />,
2574
- "tagColor": "#ecf7ec",
2575
- "tagTextColor": "#6bb56b",
2576
- "tooltipLabel": <FormattedMessage
2577
- defaultMessage="Send codes that allow your customers to securely access their accounts."
2578
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
2579
- values={Object {}}
2580
- />,
2581
- "value": "AUTHENTICATION",
2582
- },
2583
- ]
2584
- }
2585
- dropdownMaxHeight="320px"
2586
- dropdownWidth="228px"
2587
- onSelect={[Function]}
2588
- overlayStyle={
2589
- Object {
2590
- "overflowY": "hidden",
2619
+ "overflowY": "hidden",
2620
+ }
2591
2621
  }
2592
- }
2593
- placeholder="Category"
2594
- placement="bottomLeft"
2595
- selectedValue="ALERT_UPDATE"
2596
- showBadge={true}
2597
- width="105px"
2622
+ placeholder="Category"
2623
+ placement="bottomLeft"
2624
+ selectedValue="ALERT_UPDATE"
2625
+ showBadge={true}
2626
+ width="105px"
2627
+ />
2628
+ </div>
2629
+ <Component />
2630
+ <Component />
2631
+ <div
2632
+ className="template-listing-header-actions"
2598
2633
  />
2599
2634
  </div>
2600
- <Component />
2601
- <Component />
2602
- <div
2603
- className="template-listing-header-actions"
2604
- >
2605
- <CapLink
2606
- className="create-new-link"
2607
- disabled={false}
2608
- onClick={[Function]}
2609
- suffix={
2610
- <CapIcon
2611
- size="s"
2612
- type="open-in-new"
2613
- />
2614
- }
2615
- title="Create new template"
2616
- />
2635
+ <div>
2636
+ <div
2637
+ className="action-container__create-row"
2638
+ >
2639
+ <CapLink
2640
+ className="create-new-link"
2641
+ disabled={false}
2642
+ onClick={[Function]}
2643
+ suffix={
2644
+ <CapIcon
2645
+ size="s"
2646
+ type="open-in-new"
2647
+ />
2648
+ }
2649
+ title="Create new template"
2650
+ />
2651
+ </div>
2617
2652
  </div>
2618
2653
  </div>
2619
2654
  </div>
@@ -2789,109 +2824,114 @@ exports[`Test Templates container Test removing all whatsapp filterss 2`] = `
2789
2824
  <div
2790
2825
  className="action-container"
2791
2826
  >
2792
- <_Class
2793
- className="search-text"
2794
- disabled={false}
2795
- labelPosition="top"
2796
- onChange={[Function]}
2797
- onClear={[Function]}
2798
- onScroll={[Function]}
2799
- placeholder="Search"
2800
- style={
2801
- Object {
2802
- "width": "210px",
2803
- }
2804
- }
2805
- value=""
2806
- />
2807
2827
  <div
2808
- className="whatsapp-filters"
2828
+ className="action-container__toolbar-row"
2809
2829
  >
2810
- <CapSelectFilter
2811
- data={
2812
- Array [
2813
- Object {
2814
- "key": "utility",
2815
- "label": <FormattedMessage
2816
- defaultMessage="Utility"
2817
- id="creatives.containersV2.Whatsapp.utility"
2818
- values={Object {}}
2819
- />,
2820
- "tagColor": "#f2e7fe",
2821
- "tagTextColor": "#a451ff",
2822
- "tooltipLabel": <FormattedMessage
2823
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
2824
- id="creatives.containersV2.Whatsapp.utilityTooltip"
2825
- values={Object {}}
2826
- />,
2827
- "value": "UTILITY",
2828
- },
2829
- Object {
2830
- "key": "marketing",
2831
- "label": <FormattedMessage
2832
- defaultMessage="Marketing"
2833
- id="creatives.containersV2.Whatsapp.marketing"
2834
- values={Object {}}
2835
- />,
2836
- "tagColor": "#ffe5d2",
2837
- "tagTextColor": "#f87d23",
2838
- "tooltipLabel": <FormattedMessage
2839
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
2840
- id="creatives.containersV2.Whatsapp.marketingTooltip"
2841
- values={Object {}}
2842
- />,
2843
- "value": "MARKETING",
2844
- },
2830
+ <_Class
2831
+ className="search-text"
2832
+ disabled={false}
2833
+ labelPosition="top"
2834
+ onChange={[Function]}
2835
+ onClear={[Function]}
2836
+ onScroll={[Function]}
2837
+ onSearch={[Function]}
2838
+ placeholder="Search"
2839
+ value=""
2840
+ />
2841
+ <div
2842
+ className="whatsapp-filters"
2843
+ >
2844
+ <CapSelectFilter
2845
+ data={
2846
+ Array [
2847
+ Object {
2848
+ "key": "utility",
2849
+ "label": <FormattedMessage
2850
+ defaultMessage="Utility"
2851
+ id="creatives.containersV2.Whatsapp.utility"
2852
+ values={Object {}}
2853
+ />,
2854
+ "tagColor": "#f2e7fe",
2855
+ "tagTextColor": "#a451ff",
2856
+ "tooltipLabel": <FormattedMessage
2857
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
2858
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
2859
+ values={Object {}}
2860
+ />,
2861
+ "value": "UTILITY",
2862
+ },
2863
+ Object {
2864
+ "key": "marketing",
2865
+ "label": <FormattedMessage
2866
+ defaultMessage="Marketing"
2867
+ id="creatives.containersV2.Whatsapp.marketing"
2868
+ values={Object {}}
2869
+ />,
2870
+ "tagColor": "#ffe5d2",
2871
+ "tagTextColor": "#f87d23",
2872
+ "tooltipLabel": <FormattedMessage
2873
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
2874
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
2875
+ values={Object {}}
2876
+ />,
2877
+ "value": "MARKETING",
2878
+ },
2879
+ Object {
2880
+ "key": "authentication",
2881
+ "label": <FormattedMessage
2882
+ defaultMessage="Authentication"
2883
+ id="creatives.containersV2.Whatsapp.authentication"
2884
+ values={Object {}}
2885
+ />,
2886
+ "tagColor": "#ecf7ec",
2887
+ "tagTextColor": "#6bb56b",
2888
+ "tooltipLabel": <FormattedMessage
2889
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
2890
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
2891
+ values={Object {}}
2892
+ />,
2893
+ "value": "AUTHENTICATION",
2894
+ },
2895
+ ]
2896
+ }
2897
+ dropdownMaxHeight="320px"
2898
+ dropdownWidth="228px"
2899
+ onSelect={[Function]}
2900
+ overlayStyle={
2845
2901
  Object {
2846
- "key": "authentication",
2847
- "label": <FormattedMessage
2848
- defaultMessage="Authentication"
2849
- id="creatives.containersV2.Whatsapp.authentication"
2850
- values={Object {}}
2851
- />,
2852
- "tagColor": "#ecf7ec",
2853
- "tagTextColor": "#6bb56b",
2854
- "tooltipLabel": <FormattedMessage
2855
- defaultMessage="Send codes that allow your customers to securely access their accounts."
2856
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
2857
- values={Object {}}
2858
- />,
2859
- "value": "AUTHENTICATION",
2860
- },
2861
- ]
2862
- }
2863
- dropdownMaxHeight="320px"
2864
- dropdownWidth="228px"
2865
- onSelect={[Function]}
2866
- overlayStyle={
2867
- Object {
2868
- "overflowY": "hidden",
2902
+ "overflowY": "hidden",
2903
+ }
2869
2904
  }
2870
- }
2871
- placeholder="Category"
2872
- placement="bottomLeft"
2873
- selectedValue={null}
2874
- showBadge={true}
2875
- width="105px"
2905
+ placeholder="Category"
2906
+ placement="bottomLeft"
2907
+ selectedValue={null}
2908
+ showBadge={true}
2909
+ width="105px"
2910
+ />
2911
+ </div>
2912
+ <Component />
2913
+ <Component />
2914
+ <div
2915
+ className="template-listing-header-actions"
2876
2916
  />
2877
2917
  </div>
2878
- <Component />
2879
- <Component />
2880
- <div
2881
- className="template-listing-header-actions"
2882
- >
2883
- <CapLink
2884
- className="create-new-link"
2885
- disabled={false}
2886
- onClick={[Function]}
2887
- suffix={
2888
- <CapIcon
2889
- size="s"
2890
- type="open-in-new"
2891
- />
2892
- }
2893
- title="Create new template"
2894
- />
2918
+ <div>
2919
+ <div
2920
+ className="action-container__create-row"
2921
+ >
2922
+ <CapLink
2923
+ className="create-new-link"
2924
+ disabled={false}
2925
+ onClick={[Function]}
2926
+ suffix={
2927
+ <CapIcon
2928
+ size="s"
2929
+ type="open-in-new"
2930
+ />
2931
+ }
2932
+ title="Create new template"
2933
+ />
2934
+ </div>
2895
2935
  </div>
2896
2936
  </div>
2897
2937
  </div>
@@ -3041,109 +3081,114 @@ exports[`Test Templates container Test removing single filter 1`] = `
3041
3081
  <div
3042
3082
  className="action-container"
3043
3083
  >
3044
- <_Class
3045
- className="search-text"
3046
- disabled={false}
3047
- labelPosition="top"
3048
- onChange={[Function]}
3049
- onClear={[Function]}
3050
- onScroll={[Function]}
3051
- placeholder="Search"
3052
- style={
3053
- Object {
3054
- "width": "210px",
3055
- }
3056
- }
3057
- value=""
3058
- />
3059
3084
  <div
3060
- className="whatsapp-filters"
3085
+ className="action-container__toolbar-row"
3061
3086
  >
3062
- <CapSelectFilter
3063
- data={
3064
- Array [
3065
- Object {
3066
- "key": "utility",
3067
- "label": <FormattedMessage
3068
- defaultMessage="Utility"
3069
- id="creatives.containersV2.Whatsapp.utility"
3070
- values={Object {}}
3071
- />,
3072
- "tagColor": "#f2e7fe",
3073
- "tagTextColor": "#a451ff",
3074
- "tooltipLabel": <FormattedMessage
3075
- defaultMessage="Send account updates, order updates, alerts, and more to share important information."
3076
- id="creatives.containersV2.Whatsapp.utilityTooltip"
3077
- values={Object {}}
3078
- />,
3079
- "value": "UTILITY",
3080
- },
3081
- Object {
3082
- "key": "marketing",
3083
- "label": <FormattedMessage
3084
- defaultMessage="Marketing"
3085
- id="creatives.containersV2.Whatsapp.marketing"
3086
- values={Object {}}
3087
- />,
3088
- "tagColor": "#ffe5d2",
3089
- "tagTextColor": "#f87d23",
3090
- "tooltipLabel": <FormattedMessage
3091
- defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
3092
- id="creatives.containersV2.Whatsapp.marketingTooltip"
3093
- values={Object {}}
3094
- />,
3095
- "value": "MARKETING",
3096
- },
3087
+ <_Class
3088
+ className="search-text"
3089
+ disabled={false}
3090
+ labelPosition="top"
3091
+ onChange={[Function]}
3092
+ onClear={[Function]}
3093
+ onScroll={[Function]}
3094
+ onSearch={[Function]}
3095
+ placeholder="Search"
3096
+ value=""
3097
+ />
3098
+ <div
3099
+ className="whatsapp-filters"
3100
+ >
3101
+ <CapSelectFilter
3102
+ data={
3103
+ Array [
3104
+ Object {
3105
+ "key": "utility",
3106
+ "label": <FormattedMessage
3107
+ defaultMessage="Utility"
3108
+ id="creatives.containersV2.Whatsapp.utility"
3109
+ values={Object {}}
3110
+ />,
3111
+ "tagColor": "#f2e7fe",
3112
+ "tagTextColor": "#a451ff",
3113
+ "tooltipLabel": <FormattedMessage
3114
+ defaultMessage="Send account updates, order updates, alerts, and more to share important information."
3115
+ id="creatives.containersV2.Whatsapp.utilityTooltip"
3116
+ values={Object {}}
3117
+ />,
3118
+ "value": "UTILITY",
3119
+ },
3120
+ Object {
3121
+ "key": "marketing",
3122
+ "label": <FormattedMessage
3123
+ defaultMessage="Marketing"
3124
+ id="creatives.containersV2.Whatsapp.marketing"
3125
+ values={Object {}}
3126
+ />,
3127
+ "tagColor": "#ffe5d2",
3128
+ "tagTextColor": "#f87d23",
3129
+ "tooltipLabel": <FormattedMessage
3130
+ defaultMessage="Send promotional offers, product announcements, and more to increase awareness and engagement."
3131
+ id="creatives.containersV2.Whatsapp.marketingTooltip"
3132
+ values={Object {}}
3133
+ />,
3134
+ "value": "MARKETING",
3135
+ },
3136
+ Object {
3137
+ "key": "authentication",
3138
+ "label": <FormattedMessage
3139
+ defaultMessage="Authentication"
3140
+ id="creatives.containersV2.Whatsapp.authentication"
3141
+ values={Object {}}
3142
+ />,
3143
+ "tagColor": "#ecf7ec",
3144
+ "tagTextColor": "#6bb56b",
3145
+ "tooltipLabel": <FormattedMessage
3146
+ defaultMessage="Send codes that allow your customers to securely access their accounts."
3147
+ id="creatives.containersV2.Whatsapp.authenticationTooltip"
3148
+ values={Object {}}
3149
+ />,
3150
+ "value": "AUTHENTICATION",
3151
+ },
3152
+ ]
3153
+ }
3154
+ dropdownMaxHeight="320px"
3155
+ dropdownWidth="228px"
3156
+ onSelect={[Function]}
3157
+ overlayStyle={
3097
3158
  Object {
3098
- "key": "authentication",
3099
- "label": <FormattedMessage
3100
- defaultMessage="Authentication"
3101
- id="creatives.containersV2.Whatsapp.authentication"
3102
- values={Object {}}
3103
- />,
3104
- "tagColor": "#ecf7ec",
3105
- "tagTextColor": "#6bb56b",
3106
- "tooltipLabel": <FormattedMessage
3107
- defaultMessage="Send codes that allow your customers to securely access their accounts."
3108
- id="creatives.containersV2.Whatsapp.authenticationTooltip"
3109
- values={Object {}}
3110
- />,
3111
- "value": "AUTHENTICATION",
3112
- },
3113
- ]
3114
- }
3115
- dropdownMaxHeight="320px"
3116
- dropdownWidth="228px"
3117
- onSelect={[Function]}
3118
- overlayStyle={
3119
- Object {
3120
- "overflowY": "hidden",
3159
+ "overflowY": "hidden",
3160
+ }
3121
3161
  }
3122
- }
3123
- placeholder="Category"
3124
- placement="bottomLeft"
3125
- selectedValue=""
3126
- showBadge={true}
3127
- width="105px"
3162
+ placeholder="Category"
3163
+ placement="bottomLeft"
3164
+ selectedValue=""
3165
+ showBadge={true}
3166
+ width="105px"
3167
+ />
3168
+ </div>
3169
+ <Component />
3170
+ <Component />
3171
+ <div
3172
+ className="template-listing-header-actions"
3128
3173
  />
3129
3174
  </div>
3130
- <Component />
3131
- <Component />
3132
- <div
3133
- className="template-listing-header-actions"
3134
- >
3135
- <CapLink
3136
- className="create-new-link"
3137
- disabled={false}
3138
- onClick={[Function]}
3139
- suffix={
3140
- <CapIcon
3141
- size="s"
3142
- type="open-in-new"
3143
- />
3144
- }
3145
- title="Create new template"
3146
- />
3175
+ <div>
3176
+ <div
3177
+ className="action-container__create-row"
3178
+ >
3179
+ <CapLink
3180
+ className="create-new-link"
3181
+ disabled={false}
3182
+ onClick={[Function]}
3183
+ suffix={
3184
+ <CapIcon
3185
+ size="s"
3186
+ type="open-in-new"
3187
+ />
3188
+ }
3189
+ title="Create new template"
3190
+ />
3191
+ </div>
3147
3192
  </div>
3148
3193
  </div>
3149
3194
  </div>