@capillarytech/creatives-library 8.0.264 → 8.0.265

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 (158) hide show
  1. package/constants/unified.js +0 -1
  2. package/package.json +1 -1
  3. package/services/api.js +0 -5
  4. package/utils/common.js +0 -6
  5. package/utils/tagValidations.js +1 -2
  6. package/utils/tests/transformerUtils.test.js +0 -297
  7. package/utils/transformerUtils.js +0 -40
  8. package/v2Components/CapImageUpload/constants.js +0 -2
  9. package/v2Components/CapImageUpload/index.js +16 -65
  10. package/v2Components/CapImageUpload/index.scss +1 -4
  11. package/v2Components/CapImageUpload/messages.js +1 -5
  12. package/v2Components/CommonTestAndPreview/UnifiedPreview/_unifiedPreview.scss +2 -2
  13. package/v2Components/FormBuilder/index.js +8 -8
  14. package/v2Containers/App/constants.js +0 -5
  15. package/v2Containers/CreativesContainer/SlideBoxContent.js +2 -57
  16. package/v2Containers/CreativesContainer/SlideBoxHeader.js +0 -1
  17. package/v2Containers/CreativesContainer/constants.js +0 -3
  18. package/v2Containers/CreativesContainer/index.js +0 -168
  19. package/v2Containers/CreativesContainer/messages.js +0 -4
  20. package/v2Containers/CreativesContainer/tests/SlideBoxContent.test.js +0 -210
  21. package/v2Containers/CreativesContainer/tests/__snapshots__/SlideBoxContent.test.js.snap +0 -304
  22. package/v2Containers/Email/index.js +7 -3
  23. package/v2Containers/FTP/index.js +1 -1
  24. package/v2Containers/InApp/index.js +0 -1
  25. package/v2Containers/Line/Container/Text/index.js +0 -1
  26. package/v2Containers/MobilePushNew/index.js +0 -1
  27. package/v2Containers/Rcs/index.js +0 -3
  28. package/v2Containers/SmsTrai/Edit/index.js +0 -1
  29. package/v2Containers/Templates/ChannelTypeIllustration.js +1 -13
  30. package/v2Containers/Templates/_templates.scss +0 -205
  31. package/v2Containers/Templates/actions.js +1 -2
  32. package/v2Containers/Templates/constants.js +0 -1
  33. package/v2Containers/Templates/index.js +34 -274
  34. package/v2Containers/Templates/messages.js +0 -24
  35. package/v2Containers/Templates/reducer.js +0 -2
  36. package/v2Containers/Templates/tests/index.test.js +0 -10
  37. package/v2Containers/TemplatesV2/index.js +7 -15
  38. package/v2Containers/TemplatesV2/messages.js +0 -4
  39. package/v2Containers/Viber/index.js +0 -1
  40. package/v2Containers/Whatsapp/index.js +0 -1
  41. package/v2Containers/Zalo/index.js +0 -1
  42. package/v2Containers/Zalo/tests/index.test.js +5 -1
  43. package/utils/imageUrlUpload.js +0 -141
  44. package/v2Components/CapImageUrlUpload/constants.js +0 -26
  45. package/v2Components/CapImageUrlUpload/index.js +0 -365
  46. package/v2Components/CapImageUrlUpload/index.scss +0 -35
  47. package/v2Components/CapImageUrlUpload/messages.js +0 -47
  48. package/v2Containers/WebPush/Create/components/BrandIconSection.js +0 -108
  49. package/v2Containers/WebPush/Create/components/ButtonForm.js +0 -172
  50. package/v2Containers/WebPush/Create/components/ButtonItem.js +0 -101
  51. package/v2Containers/WebPush/Create/components/ButtonList.js +0 -145
  52. package/v2Containers/WebPush/Create/components/ButtonsLinksSection.js +0 -164
  53. package/v2Containers/WebPush/Create/components/ButtonsLinksSection.test.js +0 -463
  54. package/v2Containers/WebPush/Create/components/FormActions.js +0 -54
  55. package/v2Containers/WebPush/Create/components/FormActions.test.js +0 -163
  56. package/v2Containers/WebPush/Create/components/MediaSection.js +0 -142
  57. package/v2Containers/WebPush/Create/components/MediaSection.test.js +0 -341
  58. package/v2Containers/WebPush/Create/components/MessageSection.js +0 -103
  59. package/v2Containers/WebPush/Create/components/MessageSection.test.js +0 -268
  60. package/v2Containers/WebPush/Create/components/NotificationTitleSection.js +0 -87
  61. package/v2Containers/WebPush/Create/components/NotificationTitleSection.test.js +0 -210
  62. package/v2Containers/WebPush/Create/components/TemplateNameSection.js +0 -54
  63. package/v2Containers/WebPush/Create/components/TemplateNameSection.test.js +0 -143
  64. package/v2Containers/WebPush/Create/components/__snapshots__/ButtonsLinksSection.test.js.snap +0 -86
  65. package/v2Containers/WebPush/Create/components/__snapshots__/FormActions.test.js.snap +0 -16
  66. package/v2Containers/WebPush/Create/components/__snapshots__/MediaSection.test.js.snap +0 -41
  67. package/v2Containers/WebPush/Create/components/__snapshots__/MessageSection.test.js.snap +0 -54
  68. package/v2Containers/WebPush/Create/components/__snapshots__/NotificationTitleSection.test.js.snap +0 -37
  69. package/v2Containers/WebPush/Create/components/__snapshots__/TemplateNameSection.test.js.snap +0 -21
  70. package/v2Containers/WebPush/Create/components/_buttons.scss +0 -246
  71. package/v2Containers/WebPush/Create/components/tests/ButtonForm.test.js +0 -554
  72. package/v2Containers/WebPush/Create/components/tests/ButtonItem.test.js +0 -607
  73. package/v2Containers/WebPush/Create/components/tests/ButtonList.test.js +0 -633
  74. package/v2Containers/WebPush/Create/components/tests/__snapshots__/ButtonForm.test.js.snap +0 -666
  75. package/v2Containers/WebPush/Create/components/tests/__snapshots__/ButtonItem.test.js.snap +0 -74
  76. package/v2Containers/WebPush/Create/components/tests/__snapshots__/ButtonList.test.js.snap +0 -78
  77. package/v2Containers/WebPush/Create/hooks/useButtonManagement.js +0 -138
  78. package/v2Containers/WebPush/Create/hooks/useButtonManagement.test.js +0 -406
  79. package/v2Containers/WebPush/Create/hooks/useCharacterCount.js +0 -30
  80. package/v2Containers/WebPush/Create/hooks/useCharacterCount.test.js +0 -151
  81. package/v2Containers/WebPush/Create/hooks/useImageUpload.js +0 -104
  82. package/v2Containers/WebPush/Create/hooks/useImageUpload.test.js +0 -538
  83. package/v2Containers/WebPush/Create/hooks/useTagManagement.js +0 -122
  84. package/v2Containers/WebPush/Create/hooks/useTagManagement.test.js +0 -633
  85. package/v2Containers/WebPush/Create/index.js +0 -1148
  86. package/v2Containers/WebPush/Create/index.scss +0 -134
  87. package/v2Containers/WebPush/Create/messages.js +0 -211
  88. package/v2Containers/WebPush/Create/preview/DevicePreviewContent.js +0 -228
  89. package/v2Containers/WebPush/Create/preview/NotificationContainer.js +0 -294
  90. package/v2Containers/WebPush/Create/preview/PreviewContent.js +0 -90
  91. package/v2Containers/WebPush/Create/preview/PreviewControls.js +0 -305
  92. package/v2Containers/WebPush/Create/preview/PreviewDisclaimer.js +0 -25
  93. package/v2Containers/WebPush/Create/preview/WebPushPreview.js +0 -155
  94. package/v2Containers/WebPush/Create/preview/assets/Light.svg +0 -53
  95. package/v2Containers/WebPush/Create/preview/assets/Top.svg +0 -5
  96. package/v2Containers/WebPush/Create/preview/assets/android-arrow-down.svg +0 -9
  97. package/v2Containers/WebPush/Create/preview/assets/android-arrow-up.svg +0 -9
  98. package/v2Containers/WebPush/Create/preview/assets/chrome-icon.png +0 -0
  99. package/v2Containers/WebPush/Create/preview/assets/edge-icon.png +0 -0
  100. package/v2Containers/WebPush/Create/preview/assets/firefox-icon.svg +0 -106
  101. package/v2Containers/WebPush/Create/preview/assets/iOS.svg +0 -26
  102. package/v2Containers/WebPush/Create/preview/assets/macos-arrow-down-icon.svg +0 -9
  103. package/v2Containers/WebPush/Create/preview/assets/macos-triple-dot-icon.svg +0 -9
  104. package/v2Containers/WebPush/Create/preview/assets/opera-icon.svg +0 -18
  105. package/v2Containers/WebPush/Create/preview/assets/safari-icon.svg +0 -29
  106. package/v2Containers/WebPush/Create/preview/assets/windows-close-icon.svg +0 -9
  107. package/v2Containers/WebPush/Create/preview/assets/windows-triple-dot-icon.svg +0 -9
  108. package/v2Containers/WebPush/Create/preview/components/AndroidMobileChromeHeader.js +0 -51
  109. package/v2Containers/WebPush/Create/preview/components/AndroidMobileExpanded.js +0 -145
  110. package/v2Containers/WebPush/Create/preview/components/IOSHeader.js +0 -45
  111. package/v2Containers/WebPush/Create/preview/components/NotificationExpandedContent.js +0 -68
  112. package/v2Containers/WebPush/Create/preview/components/NotificationHeader.js +0 -61
  113. package/v2Containers/WebPush/Create/preview/components/WindowsChromeExpanded.js +0 -99
  114. package/v2Containers/WebPush/Create/preview/components/tests/AndroidMobileExpanded.test.js +0 -733
  115. package/v2Containers/WebPush/Create/preview/components/tests/WindowsChromeExpanded.test.js +0 -571
  116. package/v2Containers/WebPush/Create/preview/components/tests/__snapshots__/AndroidMobileExpanded.test.js.snap +0 -85
  117. package/v2Containers/WebPush/Create/preview/components/tests/__snapshots__/WindowsChromeExpanded.test.js.snap +0 -81
  118. package/v2Containers/WebPush/Create/preview/config/notificationMappings.js +0 -50
  119. package/v2Containers/WebPush/Create/preview/constants.js +0 -637
  120. package/v2Containers/WebPush/Create/preview/notification-container.scss +0 -79
  121. package/v2Containers/WebPush/Create/preview/preview.scss +0 -358
  122. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-chrome.scss +0 -370
  123. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-edge.scss +0 -12
  124. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-firefox.scss +0 -12
  125. package/v2Containers/WebPush/Create/preview/styles/_android-mobile-opera.scss +0 -12
  126. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-chrome.scss +0 -47
  127. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-edge.scss +0 -11
  128. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-firefox.scss +0 -11
  129. package/v2Containers/WebPush/Create/preview/styles/_android-tablet-opera.scss +0 -11
  130. package/v2Containers/WebPush/Create/preview/styles/_base.scss +0 -207
  131. package/v2Containers/WebPush/Create/preview/styles/_ios.scss +0 -153
  132. package/v2Containers/WebPush/Create/preview/styles/_ipados.scss +0 -107
  133. package/v2Containers/WebPush/Create/preview/styles/_macos-chrome.scss +0 -101
  134. package/v2Containers/WebPush/Create/preview/styles/_windows-chrome.scss +0 -229
  135. package/v2Containers/WebPush/Create/preview/tests/DevicePreviewContent.test.js +0 -909
  136. package/v2Containers/WebPush/Create/preview/tests/NotificationContainer.test.js +0 -1081
  137. package/v2Containers/WebPush/Create/preview/tests/PreviewControls.test.js +0 -723
  138. package/v2Containers/WebPush/Create/preview/tests/WebPushPreview.test.js +0 -1327
  139. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/DevicePreviewContent.test.js.snap +0 -131
  140. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/NotificationContainer.test.js.snap +0 -112
  141. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/PreviewControls.test.js.snap +0 -144
  142. package/v2Containers/WebPush/Create/preview/tests/__snapshots__/WebPushPreview.test.js.snap +0 -129
  143. package/v2Containers/WebPush/Create/utils/payloadBuilder.js +0 -96
  144. package/v2Containers/WebPush/Create/utils/payloadBuilder.test.js +0 -396
  145. package/v2Containers/WebPush/Create/utils/previewUtils.js +0 -89
  146. package/v2Containers/WebPush/Create/utils/urlValidation.js +0 -115
  147. package/v2Containers/WebPush/Create/utils/urlValidation.test.js +0 -449
  148. package/v2Containers/WebPush/Create/utils/validation.js +0 -76
  149. package/v2Containers/WebPush/Create/utils/validation.test.js +0 -283
  150. package/v2Containers/WebPush/actions.js +0 -60
  151. package/v2Containers/WebPush/constants.js +0 -132
  152. package/v2Containers/WebPush/index.js +0 -2
  153. package/v2Containers/WebPush/reducer.js +0 -104
  154. package/v2Containers/WebPush/sagas.js +0 -119
  155. package/v2Containers/WebPush/selectors.js +0 -65
  156. package/v2Containers/WebPush/tests/reducer.test.js +0 -863
  157. package/v2Containers/WebPush/tests/sagas.test.js +0 -566
  158. package/v2Containers/WebPush/tests/selectors.test.js +0 -960
@@ -1,164 +0,0 @@
1
- import React from 'react';
2
- import PropTypes from 'prop-types';
3
- import { FormattedMessage } from 'react-intl';
4
- import CapRow from '@capillarytech/cap-ui-library/CapRow';
5
- import CapHeading from '@capillarytech/cap-ui-library/CapHeading';
6
- import CapRadioGroup from '@capillarytech/cap-ui-library/CapRadioGroup';
7
- import CapInput from '@capillarytech/cap-ui-library/CapInput';
8
- import CapButton from '@capillarytech/cap-ui-library/CapButton';
9
- import ButtonList from './ButtonList';
10
- import ButtonForm from './ButtonForm';
11
- import { ON_CLICK_BEHAVIOUR_OPTIONS } from '../../constants';
12
-
13
- /**
14
- * ButtonsLinksSection component - On-click behavior and CTA buttons management
15
- */
16
- export const ButtonsLinksSection = ({
17
- onClickBehaviour,
18
- onClickBehaviourOptions,
19
- onClickBehaviourChange,
20
- redirectUrl,
21
- redirectUrlError,
22
- onRedirectUrlChange,
23
- buttonState,
24
- formatMessage,
25
- messages,
26
- }) => {
27
- const {
28
- buttons,
29
- isAddingButton,
30
- buttonBeingAdded,
31
- editingButtonIndex,
32
- handleAddPrimaryButton,
33
- handleAddSecondaryButton,
34
- handleButtonSave,
35
- handleButtonCancel,
36
- handleButtonEdit,
37
- handleButtonDelete,
38
- handleButtonReorder,
39
- isAddFlow,
40
- isEditFlow,
41
- showAddPrimaryButton,
42
- showAddSecondaryButton,
43
- showDisabledSecondaryDuringPrimary,
44
- disableSecondaryAddButton,
45
- } = buttonState;
46
-
47
- const renderButtonForm = (isEditMode) => (
48
- <ButtonForm
49
- buttonType={buttonBeingAdded}
50
- formatMessage={formatMessage}
51
- onSave={handleButtonSave}
52
- onCancel={handleButtonCancel}
53
- initialData={isEditMode && editingButtonIndex !== null ? buttons[editingButtonIndex] : null}
54
- isEditMode={isEditMode}
55
- />
56
- );
57
-
58
- return (
59
- <>
60
- <CapRow className="creatives-webpush-buttons-links">
61
- <CapHeading type="h4" className="webpush-buttons-links">
62
- <FormattedMessage {...messages.buttonsAndLinks} />
63
- </CapHeading>
64
- <CapHeading type="h5" className="webpush-on-click-behaviour">
65
- <FormattedMessage {...messages.onClickBehaviour} />
66
- </CapHeading>
67
- <CapRadioGroup
68
- options={onClickBehaviourOptions}
69
- value={onClickBehaviour}
70
- onChange={onClickBehaviourChange}
71
- />
72
- {onClickBehaviour === ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL && (
73
- <CapInput
74
- id="webpush-redirect-url-input"
75
- className="webpush-redirect-url-input"
76
- placeholder={formatMessage(messages.enterUrl)}
77
- value={redirectUrl}
78
- onChange={onRedirectUrlChange}
79
- size="default"
80
- status={redirectUrlError ? 'error' : ''}
81
- help={redirectUrlError || ''}
82
- />
83
- )}
84
- </CapRow>
85
- <CapRow className="creatives-webpush-buttons-section">
86
- <CapHeading type="h5" className="webpush-buttons-section-heading">
87
- <FormattedMessage {...messages.buttons} />{' '}
88
- <span className="optional-text">
89
- <FormattedMessage {...messages.optional} />
90
- </span>
91
- </CapHeading>
92
- <ButtonList
93
- buttons={buttons}
94
- onEdit={handleButtonEdit}
95
- onDelete={handleButtonDelete}
96
- onReorder={handleButtonReorder}
97
- onAddPrimary={handleAddPrimaryButton}
98
- onAddSecondary={handleAddSecondaryButton}
99
- showAddPrimary={false}
100
- showAddSecondary={false}
101
- disabled={isAddFlow}
102
- disableSecondaryButton={disableSecondaryAddButton}
103
- isInlineFormVisible={isEditFlow}
104
- inlineFormIndex={isEditFlow ? editingButtonIndex : null}
105
- renderInlineForm={isEditFlow ? () => renderButtonForm(true) : null}
106
- />
107
- {isAddFlow && buttonBeingAdded && renderButtonForm(false)}
108
- {(showAddPrimaryButton || showAddSecondaryButton || showDisabledSecondaryDuringPrimary) && (
109
- <div className="button-add-controls">
110
- {showAddPrimaryButton && (
111
- <CapButton
112
- type="flat"
113
- onClick={handleAddPrimaryButton}
114
- className="add-primary-button button-add-trigger"
115
- icon="plus"
116
- >
117
- <FormattedMessage {...messages.addButton} />
118
- </CapButton>
119
- )}
120
- {showAddSecondaryButton && (
121
- <CapButton
122
- type="flat"
123
- onClick={handleAddSecondaryButton}
124
- className="add-secondary-button button-add-trigger"
125
- icon="plus"
126
- >
127
- <FormattedMessage {...messages.addButton} />
128
- </CapButton>
129
- )}
130
- {showDisabledSecondaryDuringPrimary && (
131
- <CapButton
132
- type="flat"
133
- className="add-secondary-button button-add-trigger"
134
- icon="plus"
135
- disabled
136
- >
137
- <FormattedMessage {...messages.addButton} />
138
- </CapButton>
139
- )}
140
- </div>
141
- )}
142
- </CapRow>
143
- </>
144
- );
145
- };
146
-
147
- ButtonsLinksSection.propTypes = {
148
- onClickBehaviour: PropTypes.string.isRequired,
149
- onClickBehaviourOptions: PropTypes.array.isRequired,
150
- onClickBehaviourChange: PropTypes.func.isRequired,
151
- redirectUrl: PropTypes.string.isRequired,
152
- redirectUrlError: PropTypes.string,
153
- onRedirectUrlChange: PropTypes.func.isRequired,
154
- buttonState: PropTypes.object.isRequired,
155
- formatMessage: PropTypes.func.isRequired,
156
- messages: PropTypes.object.isRequired,
157
- };
158
-
159
- ButtonsLinksSection.defaultProps = {
160
- redirectUrlError: '',
161
- };
162
-
163
- export default ButtonsLinksSection;
164
-
@@ -1,463 +0,0 @@
1
- import React from 'react';
2
- import { mountWithIntl, shallowWithIntl } from '../../../../helpers/intl-enzym-test-helpers';
3
- import ButtonsLinksSection from './ButtonsLinksSection';
4
- import CapRow from '@capillarytech/cap-ui-library/CapRow';
5
- import CapHeading from '@capillarytech/cap-ui-library/CapHeading';
6
- import CapRadioGroup from '@capillarytech/cap-ui-library/CapRadioGroup';
7
- import CapInput from '@capillarytech/cap-ui-library/CapInput';
8
- import CapButton from '@capillarytech/cap-ui-library/CapButton';
9
- import { ON_CLICK_BEHAVIOUR_OPTIONS, WEBPUSH_BUTTON_TYPES } from '../../constants';
10
-
11
- // Mock ButtonList
12
- jest.mock('./ButtonList', () => {
13
- const React = require('react');
14
- return function MockButtonList(props) {
15
- return (
16
- <div data-testid="button-list" className="mock-button-list">
17
- <div>Buttons: {props.buttons?.length || 0}</div>
18
- <div>Disabled: {props.disabled ? 'true' : 'false'}</div>
19
- <div>DisableSecondary: {props.disableSecondaryButton ? 'true' : 'false'}</div>
20
- <div>IsInlineFormVisible: {props.isInlineFormVisible ? 'true' : 'false'}</div>
21
- {props.renderInlineForm && <div data-testid="inline-form">{props.renderInlineForm()}</div>}
22
- </div>
23
- );
24
- };
25
- });
26
-
27
- // Mock ButtonForm
28
- jest.mock('./ButtonForm', () => {
29
- const React = require('react');
30
- return function MockButtonForm(props) {
31
- return (
32
- <div data-testid="button-form" className="mock-button-form">
33
- <div>ButtonType: {props.buttonType}</div>
34
- <div>IsEditMode: {props.isEditMode ? 'true' : 'false'}</div>
35
- <div>InitialData: {props.initialData ? JSON.stringify(props.initialData) : 'null'}</div>
36
- <button onClick={props.onSave} data-testid="button-form-save">
37
- Save
38
- </button>
39
- <button onClick={props.onCancel} data-testid="button-form-cancel">
40
- Cancel
41
- </button>
42
- </div>
43
- );
44
- };
45
- });
46
-
47
- describe('ButtonsLinksSection', () => {
48
- const mockFormatMessage = jest.fn((message) => message?.defaultMessage || message?.id || message);
49
- const mockOnClickBehaviourChange = jest.fn();
50
- const mockOnRedirectUrlChange = jest.fn();
51
-
52
- const mockMessages = {
53
- buttonsAndLinks: {
54
- id: 'app.webpush.buttonsAndLinks',
55
- defaultMessage: 'Buttons and Links',
56
- },
57
- onClickBehaviour: {
58
- id: 'app.webpush.onClickBehaviour',
59
- defaultMessage: 'On-click Behaviour',
60
- },
61
- enterUrl: {
62
- id: 'app.webpush.enterUrl',
63
- defaultMessage: 'Enter URL',
64
- },
65
- buttons: {
66
- id: 'app.webpush.buttons',
67
- defaultMessage: 'Buttons',
68
- },
69
- optional: {
70
- id: 'app.webpush.optional',
71
- defaultMessage: '(Optional)',
72
- },
73
- addButton: {
74
- id: 'app.webpush.addButton',
75
- defaultMessage: 'Add Button',
76
- },
77
- };
78
-
79
- const createMockButtonState = (overrides = {}) => ({
80
- buttons: [],
81
- isAddingButton: false,
82
- buttonBeingAdded: null,
83
- editingButtonIndex: null,
84
- handleAddPrimaryButton: jest.fn(),
85
- handleAddSecondaryButton: jest.fn(),
86
- handleButtonSave: jest.fn(),
87
- handleButtonCancel: jest.fn(),
88
- handleButtonEdit: jest.fn(),
89
- handleButtonDelete: jest.fn(),
90
- handleButtonReorder: jest.fn(),
91
- isAddFlow: false,
92
- isEditFlow: false,
93
- showAddPrimaryButton: false,
94
- showAddSecondaryButton: false,
95
- showDisabledSecondaryDuringPrimary: false,
96
- disableSecondaryAddButton: false,
97
- ...overrides,
98
- });
99
-
100
- const defaultProps = {
101
- onClickBehaviour: ON_CLICK_BEHAVIOUR_OPTIONS.SITE_URL,
102
- onClickBehaviourOptions: [
103
- { value: ON_CLICK_BEHAVIOUR_OPTIONS.SITE_URL, label: 'Open Site' },
104
- { value: ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL, label: 'Redirect to URL' },
105
- ],
106
- onClickBehaviourChange: mockOnClickBehaviourChange,
107
- redirectUrl: '',
108
- redirectUrlError: '',
109
- onRedirectUrlChange: mockOnRedirectUrlChange,
110
- buttonState: createMockButtonState(),
111
- formatMessage: mockFormatMessage,
112
- messages: mockMessages,
113
- };
114
-
115
- beforeEach(() => {
116
- jest.clearAllMocks();
117
- });
118
-
119
- describe('Rendering', () => {
120
- it('should render correctly with default props', () => {
121
- const wrapper = shallowWithIntl(<ButtonsLinksSection {...defaultProps} />);
122
- expect(wrapper).toMatchSnapshot();
123
- });
124
-
125
- it('should render buttons and links section', () => {
126
- const wrapper = mountWithIntl(<ButtonsLinksSection {...defaultProps} />);
127
- const section = wrapper.find('.creatives-webpush-buttons-links');
128
- expect(section.exists()).toBe(true);
129
- });
130
-
131
- it('should render buttons section', () => {
132
- const wrapper = mountWithIntl(<ButtonsLinksSection {...defaultProps} />);
133
- const section = wrapper.find('.creatives-webpush-buttons-section');
134
- expect(section.exists()).toBe(true);
135
- });
136
-
137
- it('should render heading for buttons and links', () => {
138
- const wrapper = mountWithIntl(<ButtonsLinksSection {...defaultProps} />);
139
- const heading = wrapper.find(CapHeading).find('.webpush-buttons-links');
140
- expect(heading.exists()).toBe(true);
141
- });
142
-
143
- it('should render heading for on-click behaviour', () => {
144
- const wrapper = mountWithIntl(<ButtonsLinksSection {...defaultProps} />);
145
- const heading = wrapper.find(CapHeading).find('.webpush-on-click-behaviour');
146
- expect(heading.exists()).toBe(true);
147
- });
148
-
149
- it('should render CapRadioGroup with correct props', () => {
150
- const wrapper = mountWithIntl(<ButtonsLinksSection {...defaultProps} />);
151
- const radioGroup = wrapper.find(CapRadioGroup);
152
- expect(radioGroup.exists()).toBe(true);
153
- expect(radioGroup.prop('options')).toEqual(defaultProps.onClickBehaviourOptions);
154
- expect(radioGroup.prop('value')).toBe(ON_CLICK_BEHAVIOUR_OPTIONS.SITE_URL);
155
- });
156
- });
157
-
158
- describe('On-Click Behaviour', () => {
159
- it('should call onClickBehaviourChange when radio group changes', () => {
160
- const wrapper = mountWithIntl(<ButtonsLinksSection {...defaultProps} />);
161
- const radioGroup = wrapper.find(CapRadioGroup);
162
- radioGroup.prop('onChange')(ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL);
163
- expect(mockOnClickBehaviourChange).toHaveBeenCalledWith(ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL);
164
- });
165
-
166
- it('should render redirect URL input when REDIRECT_TO_URL is selected', () => {
167
- const wrapper = mountWithIntl(
168
- <ButtonsLinksSection
169
- {...defaultProps}
170
- onClickBehaviour={ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL}
171
- redirectUrl="https://example.com"
172
- />
173
- );
174
- const input = wrapper.find(CapInput).find('#webpush-redirect-url-input');
175
- expect(input.exists()).toBe(true);
176
- });
177
-
178
- it('should not render redirect URL input when SITE_URL is selected', () => {
179
- const wrapper = mountWithIntl(<ButtonsLinksSection {...defaultProps} />);
180
- const input = wrapper.find(CapInput).find('#webpush-redirect-url-input');
181
- expect(input.exists()).toBe(false);
182
- });
183
-
184
- it('should show error status when redirectUrlError is provided', () => {
185
- const wrapper = mountWithIntl(
186
- <ButtonsLinksSection
187
- {...defaultProps}
188
- onClickBehaviour={ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL}
189
- redirectUrlError="Invalid URL"
190
- />
191
- );
192
- const input = wrapper.find(CapInput).find('#webpush-redirect-url-input');
193
- expect(input.exists()).toBe(true);
194
- });
195
-
196
- it('should call onRedirectUrlChange when URL input changes', () => {
197
- const onRedirectUrlChangeMock = jest.fn();
198
- const wrapper = mountWithIntl(
199
- <ButtonsLinksSection
200
- {...defaultProps}
201
- onClickBehaviour={ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL}
202
- onRedirectUrlChange={onRedirectUrlChangeMock}
203
- />
204
- );
205
- const input = wrapper.find('#webpush-redirect-url-input').hostNodes().first();
206
- expect(input.exists()).toBe(true);
207
-
208
- // Simulate change event with sample URL
209
- const sampleUrl = 'https://example.com/redirect';
210
- input.prop('onChange')({ target: { value: sampleUrl } });
211
-
212
- // Verify the handler was called with the correct value
213
- expect(onRedirectUrlChangeMock).toHaveBeenCalledWith({ target: { value: sampleUrl } });
214
- });
215
- });
216
-
217
- describe('Button List', () => {
218
- it('should render ButtonList with correct props', () => {
219
- const buttonState = createMockButtonState({
220
- buttons: [
221
- { type: WEBPUSH_BUTTON_TYPES.PRIMARY, text: 'Button 1', url: 'https://example.com/1' },
222
- ],
223
- });
224
- const wrapper = mountWithIntl(
225
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
226
- );
227
- const buttonList = wrapper.find('[data-testid="button-list"]');
228
- expect(buttonList.exists()).toBe(true);
229
- });
230
-
231
- it('should pass buttons to ButtonList', () => {
232
- const buttons = [
233
- { type: WEBPUSH_BUTTON_TYPES.PRIMARY, text: 'Button 1', url: 'https://example.com/1' },
234
- { type: WEBPUSH_BUTTON_TYPES.SECONDARY, text: 'Button 2', url: 'https://example.com/2' },
235
- ];
236
- const buttonState = createMockButtonState({ buttons });
237
- const wrapper = mountWithIntl(
238
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
239
- );
240
- const buttonList = wrapper.find('[data-testid="button-list"]');
241
- expect(buttonList.text()).toContain('Buttons: 2');
242
- });
243
-
244
- it('should disable ButtonList when isAddFlow is true', () => {
245
- const buttonState = createMockButtonState({ isAddFlow: true });
246
- const wrapper = mountWithIntl(
247
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
248
- );
249
- const buttonList = wrapper.find('[data-testid="button-list"]');
250
- expect(buttonList.text()).toContain('Disabled: true');
251
- });
252
-
253
- it('should show inline form when isEditFlow is true', () => {
254
- const buttons = [
255
- { type: WEBPUSH_BUTTON_TYPES.PRIMARY, text: 'Button 1', url: 'https://example.com/1' },
256
- ];
257
- const buttonState = createMockButtonState({
258
- buttons,
259
- isEditFlow: true,
260
- editingButtonIndex: 0,
261
- buttonBeingAdded: WEBPUSH_BUTTON_TYPES.PRIMARY,
262
- });
263
- const wrapper = mountWithIntl(
264
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
265
- );
266
- const buttonList = wrapper.find('[data-testid="button-list"]');
267
- expect(buttonList.text()).toContain('IsInlineFormVisible: true');
268
- expect(wrapper.find('[data-testid="inline-form"]').exists()).toBe(true);
269
- });
270
- });
271
-
272
- describe('Add Button Flow', () => {
273
- it('should render ButtonForm when isAddFlow is true', () => {
274
- const buttonState = createMockButtonState({
275
- isAddingButton: true,
276
- isAddFlow: true,
277
- buttonBeingAdded: WEBPUSH_BUTTON_TYPES.PRIMARY,
278
- });
279
- const wrapper = mountWithIntl(
280
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
281
- );
282
- const buttonForm = wrapper.find('[data-testid="button-form"]');
283
- expect(buttonForm.exists()).toBe(true);
284
- expect(buttonForm.text()).toContain('ButtonType: primary');
285
- expect(buttonForm.text()).toContain('IsEditMode: false');
286
- });
287
-
288
- it('should not render ButtonForm when isAddFlow is false', () => {
289
- const buttonState = createMockButtonState({ isAddFlow: false });
290
- const wrapper = mountWithIntl(
291
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
292
- );
293
- const buttonForm = wrapper.find('[data-testid="button-form"]');
294
- expect(buttonForm.length).toBe(0);
295
- });
296
-
297
- it('should call handleButtonSave when form save is clicked', () => {
298
- const handleButtonSave = jest.fn();
299
- const buttonState = createMockButtonState({
300
- isAddingButton: true,
301
- isAddFlow: true,
302
- buttonBeingAdded: WEBPUSH_BUTTON_TYPES.PRIMARY,
303
- handleButtonSave,
304
- });
305
- const wrapper = mountWithIntl(
306
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
307
- );
308
- const saveButton = wrapper.find('[data-testid="button-form-save"]');
309
- saveButton.simulate('click');
310
- expect(handleButtonSave).toHaveBeenCalled();
311
- });
312
-
313
- it('should call handleButtonCancel when form cancel is clicked', () => {
314
- const handleButtonCancel = jest.fn();
315
- const buttonState = createMockButtonState({
316
- isAddingButton: true,
317
- isAddFlow: true,
318
- buttonBeingAdded: WEBPUSH_BUTTON_TYPES.PRIMARY,
319
- handleButtonCancel,
320
- });
321
- const wrapper = mountWithIntl(
322
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
323
- );
324
- const cancelButton = wrapper.find('[data-testid="button-form-cancel"]');
325
- cancelButton.simulate('click');
326
- expect(handleButtonCancel).toHaveBeenCalled();
327
- });
328
- });
329
-
330
- describe('Add Button Controls', () => {
331
- it('should render add primary button when showAddPrimaryButton is true', () => {
332
- const handleAddPrimaryButton = jest.fn();
333
- const buttonState = createMockButtonState({
334
- showAddPrimaryButton: true,
335
- handleAddPrimaryButton,
336
- });
337
- const wrapper = mountWithIntl(
338
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
339
- );
340
- const addButton = wrapper.find(CapButton).find('.add-primary-button');
341
- expect(addButton.exists()).toBe(true);
342
- });
343
-
344
- it('should render add secondary button when showAddSecondaryButton is true', () => {
345
- const handleAddSecondaryButton = jest.fn();
346
- const buttonState = createMockButtonState({
347
- showAddSecondaryButton: true,
348
- handleAddSecondaryButton,
349
- });
350
- const wrapper = mountWithIntl(
351
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
352
- );
353
- const addButton = wrapper.find(CapButton).find('.add-secondary-button');
354
- expect(addButton.exists()).toBe(true);
355
- });
356
-
357
- it('should render disabled secondary button when showDisabledSecondaryDuringPrimary is true', () => {
358
- const buttonState = createMockButtonState({
359
- showDisabledSecondaryDuringPrimary: true,
360
- });
361
- const wrapper = mountWithIntl(
362
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
363
- );
364
- const addButton = wrapper.find(CapButton).find('.add-secondary-button');
365
- expect(addButton.exists()).toBe(true);
366
- });
367
-
368
- it('should call handleAddPrimaryButton when add primary button is clicked', () => {
369
- const handleAddPrimaryButton = jest.fn();
370
- const buttonState = createMockButtonState({
371
- showAddPrimaryButton: true,
372
- handleAddPrimaryButton,
373
- });
374
- const wrapper = mountWithIntl(
375
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
376
- );
377
- const addButton = wrapper.find('.add-primary-button').hostNodes();
378
- expect(addButton.exists()).toBe(true);
379
-
380
- // Simulate click on the add primary button
381
- addButton.simulate('click');
382
- wrapper.update();
383
-
384
- // Verify the handler was called
385
- expect(handleAddPrimaryButton).toHaveBeenCalled();
386
- });
387
-
388
- it('should call handleAddSecondaryButton when add secondary button is clicked', () => {
389
- const handleAddSecondaryButton = jest.fn();
390
- const buttonState = createMockButtonState({
391
- showAddSecondaryButton: true,
392
- handleAddSecondaryButton,
393
- });
394
- const wrapper = mountWithIntl(
395
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
396
- );
397
- const addButton = wrapper.find('.add-secondary-button').hostNodes();
398
- expect(addButton.exists()).toBe(true);
399
-
400
- // Simulate click on the add secondary button
401
- addButton.simulate('click');
402
- wrapper.update();
403
-
404
- // Verify the handler was called
405
- expect(handleAddSecondaryButton).toHaveBeenCalled();
406
- });
407
-
408
- it('should not render add button controls when all flags are false', () => {
409
- const buttonState = createMockButtonState({
410
- showAddPrimaryButton: false,
411
- showAddSecondaryButton: false,
412
- showDisabledSecondaryDuringPrimary: false,
413
- });
414
- const wrapper = mountWithIntl(
415
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
416
- );
417
- const addControls = wrapper.find('.button-add-controls');
418
- expect(addControls.exists()).toBe(false);
419
- });
420
- });
421
-
422
- describe('Edit Button Flow', () => {
423
- it('should render ButtonForm with initial data when editing', () => {
424
- const buttons = [
425
- { type: WEBPUSH_BUTTON_TYPES.PRIMARY, text: 'Button 1', url: 'https://example.com/1' },
426
- ];
427
- const buttonState = createMockButtonState({
428
- buttons,
429
- isEditFlow: true,
430
- editingButtonIndex: 0,
431
- buttonBeingAdded: WEBPUSH_BUTTON_TYPES.PRIMARY,
432
- });
433
- const wrapper = mountWithIntl(
434
- <ButtonsLinksSection {...defaultProps} buttonState={buttonState} />
435
- );
436
- const inlineForm = wrapper.find('[data-testid="inline-form"]');
437
- expect(inlineForm.exists()).toBe(true);
438
- const buttonForm = inlineForm.find('[data-testid="button-form"]');
439
- expect(buttonForm.text()).toContain('IsEditMode: true');
440
- expect(buttonForm.text()).toContain('InitialData:');
441
- });
442
- });
443
-
444
- describe('Default Props', () => {
445
- it('should use default redirectUrlError when not provided', () => {
446
- const wrapper = mountWithIntl(
447
- <ButtonsLinksSection
448
- onClickBehaviour={ON_CLICK_BEHAVIOUR_OPTIONS.REDIRECT_TO_URL}
449
- onClickBehaviourOptions={defaultProps.onClickBehaviourOptions}
450
- onClickBehaviourChange={mockOnClickBehaviourChange}
451
- redirectUrl=""
452
- onRedirectUrlChange={mockOnRedirectUrlChange}
453
- buttonState={createMockButtonState()}
454
- formatMessage={mockFormatMessage}
455
- messages={mockMessages}
456
- />
457
- );
458
- const input = wrapper.find(CapInput).find('#webpush-redirect-url-input');
459
- expect(input.exists()).toBe(true);
460
- });
461
- });
462
- });
463
-
@@ -1,54 +0,0 @@
1
- import React from 'react';
2
- import PropTypes from 'prop-types';
3
- import CapRow from '@capillarytech/cap-ui-library/CapRow';
4
- import CapButton from '@capillarytech/cap-ui-library/CapButton';
5
- import CapError from '@capillarytech/cap-ui-library/CapError';
6
-
7
- /**
8
- * FormActions component - Displays save button and error messages
9
- */
10
- export const FormActions = ({
11
- onSave,
12
- isSaveDisabled,
13
- errorText,
14
- accountErrorText,
15
- formatMessage,
16
- messages,
17
- }) => (
18
- <>
19
- <CapRow className="creatives-webpush-actions">
20
- <CapButton type="primary" onClick={onSave} disabled={isSaveDisabled}>
21
- {formatMessage(messages.saveTemplate)}
22
- </CapButton>
23
- </CapRow>
24
- {errorText && (
25
- <CapRow>
26
- <CapError className="webpush-template-error">{errorText}</CapError>
27
- </CapRow>
28
- )}
29
- {accountErrorText && (
30
- <CapRow>
31
- <CapError className="webpush-template-account-error">
32
- {accountErrorText}
33
- </CapError>
34
- </CapRow>
35
- )}
36
- </>
37
- );
38
-
39
- FormActions.propTypes = {
40
- onSave: PropTypes.func.isRequired,
41
- isSaveDisabled: PropTypes.bool.isRequired,
42
- errorText: PropTypes.string,
43
- accountErrorText: PropTypes.string,
44
- formatMessage: PropTypes.func.isRequired,
45
- messages: PropTypes.object.isRequired,
46
- };
47
-
48
- FormActions.defaultProps = {
49
- errorText: '',
50
- accountErrorText: '',
51
- };
52
-
53
- export default FormActions;
54
-