@capillarytech/creatives-library 7.16.6 → 7.16.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/v2Components/CapWhatsappCTA/index.js +10 -1
- package/v2Components/CapWhatsappCTA/messages.js +4 -0
- package/v2Containers/Email/index.js +4 -2
- package/v2Containers/Line/Container/Wrapper/tests/index.test.js +24 -0
- package/v2Containers/Line/Container/Wrapper/utils.js +8 -1
package/package.json
CHANGED
|
@@ -20,7 +20,7 @@ import globalMessages from '../../v2Containers/Cap/messages';
|
|
|
20
20
|
import whatsappMsg from '../../v2Containers/Whatsapp/messages';
|
|
21
21
|
import messages from './messages';
|
|
22
22
|
import './index.scss';
|
|
23
|
-
import { isUrl } from '../../v2Containers/Line/Container/Wrapper/utils';
|
|
23
|
+
import { isUrl,isValidText } from '../../v2Containers/Line/Container/Wrapper/utils';
|
|
24
24
|
import TagList from '../../v2Containers/TagList';
|
|
25
25
|
import {
|
|
26
26
|
CTA_OPTIONS,
|
|
@@ -55,6 +55,7 @@ export const CapWhatsappCTA = (props) => {
|
|
|
55
55
|
const invalidVarRegex = /{{(.*?)}}/g;
|
|
56
56
|
|
|
57
57
|
const [urlError, setUrlError] = useState(false);
|
|
58
|
+
const [buttonError, setButtonError] = useState(false);
|
|
58
59
|
|
|
59
60
|
const updateHelper = (type, value, index) => {
|
|
60
61
|
let clonedCta = cloneDeep(ctaData[index]);
|
|
@@ -141,6 +142,11 @@ export const CapWhatsappCTA = (props) => {
|
|
|
141
142
|
|
|
142
143
|
const onButtonTextChange = ({ target }) => {
|
|
143
144
|
const { value, id } = target;
|
|
145
|
+
let errorMessage = false;
|
|
146
|
+
if (!isValidText(value)) {
|
|
147
|
+
errorMessage = formatMessage(messages.ctaButtonErrorMessage);
|
|
148
|
+
}
|
|
149
|
+
setButtonError(errorMessage);
|
|
144
150
|
updateHelper('text', value, id);
|
|
145
151
|
};
|
|
146
152
|
|
|
@@ -179,6 +185,8 @@ export const CapWhatsappCTA = (props) => {
|
|
|
179
185
|
return true;
|
|
180
186
|
} else if (ctaType === WEBSITE && (url === '' || urlError)) {
|
|
181
187
|
return true;
|
|
188
|
+
} else if (text === '' || buttonError) {
|
|
189
|
+
return true;
|
|
182
190
|
}
|
|
183
191
|
return false;
|
|
184
192
|
};
|
|
@@ -325,6 +333,7 @@ export const CapWhatsappCTA = (props) => {
|
|
|
325
333
|
value={text}
|
|
326
334
|
size="large"
|
|
327
335
|
maxLength={BTN_MAX_LENGTH}
|
|
336
|
+
errorMessage={buttonError}
|
|
328
337
|
/>
|
|
329
338
|
{renderLength(text.length, BTN_MAX_LENGTH)}
|
|
330
339
|
</CapColumn>
|
|
@@ -53,6 +53,10 @@ export default defineMessages({
|
|
|
53
53
|
id: `${prefix}.ctaWebsiteUrlErrorMessage`,
|
|
54
54
|
defaultMessage: 'URL is not valid',
|
|
55
55
|
},
|
|
56
|
+
ctaButtonErrorMessage: {
|
|
57
|
+
id: `${prefix}.ctaButtonErrorMessage`,
|
|
58
|
+
defaultMessage: "Newlines, Emojis, or Special characters not allowed",
|
|
59
|
+
},
|
|
56
60
|
addButton: {
|
|
57
61
|
id: `${prefix}.addButton`,
|
|
58
62
|
defaultMessage: 'Add button',
|
|
@@ -36,6 +36,7 @@ import { FONT_COLOR_05 } from '@capillarytech/cap-ui-library/styled/variables';
|
|
|
36
36
|
import { gtmPush } from '../../utils/gtmTrackers';
|
|
37
37
|
const {CapCustomCardList} = CapCustomCard;
|
|
38
38
|
import {transformEmailTemplates, storeS3FileSizeDetails, CREATIVES_S3_ASSET_FILESIZES} from '../../utils/cdnTransformation';
|
|
39
|
+
import { createNewFile } from '../../utils/common';
|
|
39
40
|
|
|
40
41
|
export class Email extends React.Component { // eslint-disable-line react/prefer-stateless-function
|
|
41
42
|
constructor(props) {
|
|
@@ -1150,14 +1151,15 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
|
|
|
1150
1151
|
uploadImages(e, {files}) {
|
|
1151
1152
|
e.preventDefault();
|
|
1152
1153
|
const _URL = window.URL || window.webkitURL;
|
|
1153
|
-
const
|
|
1154
|
-
const fileSize =
|
|
1154
|
+
const tempFile = files[0];
|
|
1155
|
+
const fileSize = tempFile && (tempFile.size / ( 1024 * 1024 ));
|
|
1155
1156
|
if (fileSize > 5) {
|
|
1156
1157
|
const message = this.props.intl.formatMessage(messages.uploadSizeError);
|
|
1157
1158
|
CapNotification.error({key: 'uploadImageIssue', message});
|
|
1158
1159
|
document.getElementById("fileName").value = "";
|
|
1159
1160
|
return;
|
|
1160
1161
|
}
|
|
1162
|
+
const [file] = createNewFile(files);
|
|
1161
1163
|
const img = new Image();
|
|
1162
1164
|
const that = this;
|
|
1163
1165
|
img.src = _URL.createObjectURL(file);
|
|
@@ -5,6 +5,7 @@ import configureStore from '../../../../../store';
|
|
|
5
5
|
import { mountWithIntl } from '../../../../../helpers/intl-enzym-test-helpers';
|
|
6
6
|
import { LineWrapper } from '../index';
|
|
7
7
|
import { mockData } from './mockData';
|
|
8
|
+
import {isValidText} from '../utils';
|
|
8
9
|
|
|
9
10
|
let store;
|
|
10
11
|
beforeAll(() => {
|
|
@@ -55,4 +56,27 @@ describe('line wrapper test/>', () => {
|
|
|
55
56
|
renderHelper('template');
|
|
56
57
|
expect(renderedComponent).toMatchSnapshot();
|
|
57
58
|
});
|
|
59
|
+
|
|
60
|
+
describe('isValidText', () => {
|
|
61
|
+
it('should return true for valid text', () => {
|
|
62
|
+
const validText = 'This is a valid text 123';
|
|
63
|
+
expect(isValidText(validText)).toBe(true);
|
|
64
|
+
});
|
|
65
|
+
|
|
66
|
+
it('should return false for text with special characters', () => {
|
|
67
|
+
const textWithSpecialChars = 'Invalid text @#$';
|
|
68
|
+
expect(isValidText(textWithSpecialChars)).toBe(false);
|
|
69
|
+
});
|
|
70
|
+
|
|
71
|
+
it('should return false for text with emojis', () => {
|
|
72
|
+
const textWithEmojis = 'Invalid text 😊';
|
|
73
|
+
expect(isValidText(textWithEmojis)).toBe(false);
|
|
74
|
+
});
|
|
75
|
+
|
|
76
|
+
it('should return true for an empty string', () => {
|
|
77
|
+
const emptyString = '';
|
|
78
|
+
expect(isValidText(emptyString)).toBe(true);
|
|
79
|
+
});
|
|
80
|
+
});
|
|
81
|
+
|
|
58
82
|
});
|
|
@@ -70,4 +70,11 @@ export const getTabPanes = (props) => {
|
|
|
70
70
|
export const isUrl = (url) => {
|
|
71
71
|
const res = url.match(/(http(s)?:\/\/.)(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g);
|
|
72
72
|
return res;
|
|
73
|
-
}
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
//Checks if the given text is valid, allowing only alphanumeric characters and whitespace
|
|
76
|
+
export const isValidText = (text) => {
|
|
77
|
+
const regex = /^(?:[a-zA-Z0-9\s]*)$/;
|
|
78
|
+
return regex.test(text);
|
|
79
|
+
};
|
|
80
|
+
|