@capillarytech/creatives-library 7.12.76 → 7.12.78

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 CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@capillarytech/creatives-library",
3
3
  "author": "meharaj",
4
- "version": "7.12.76",
4
+ "version": "7.12.78",
5
5
  "description": "Capillary creatives ui",
6
6
  "main": "./index.js",
7
7
  "module": "./index.es.js",
@@ -7,7 +7,8 @@ import { parse } from 'node-html-parser';
7
7
  const CDN_BASE_URL = `https://storage.crm.n.content-cdn.io`;
8
8
  const CDN_TRANSFORMATION_URL_SUFFIX = `/cdn-cgi/image/`;
9
9
  const QUALITY = 75;
10
- const regex = /https:\/\/.*intouch_creative_assets.*(?:jpg|png|jpeg|gif)$/;
10
+ // const regex = /https:\/\/.*intouch_creative_assets.*(?:jpg|png|jpeg|gif)$/;
11
+ const regex = /https:\/\/.*intouch_creative_assets.*$/;
11
12
  const INTOUCH_CREATIVE_ASSETS = 'intouch_creative_assets';
12
13
 
13
14
  /**
@@ -15,6 +15,7 @@ import Gallery from '../../../Assets/Gallery';
15
15
  import style from './style';
16
16
  import { CAP_G06, CAP_G09 } from '@capillarytech/cap-ui-library/styled/variables';
17
17
  import withStyles from '../../../../hoc/withStyles';
18
+ import { getCdnUrl } from '../../../../utils/cdnTransformation';
18
19
 
19
20
  import messages from './messages';
20
21
  import {
@@ -73,7 +74,7 @@ export const LineImage = ({
73
74
  if (imageSrc && (isFullMode ? messageTitle: true) && imagePreview) {
74
75
  updateMessageState({
75
76
  isError: !imageSrc || !(isFullMode ? messageTitle : true) || isImageError || errorMessageTitle,
76
- originalContentUrl: imageSrc,
77
+ originalContentUrl: getCdnUrl({url: imageSrc}),
77
78
  previewImageUrl: imagePreview,
78
79
  messageTitle,
79
80
  index,
@@ -112,7 +113,7 @@ export const LineImage = ({
112
113
 
113
114
  updateMessageState({
114
115
  isError: !imgSrc || !(isFullMode ? messageTitle : true) || errorMessageTitle,
115
- originalContentUrl: imgSrc,
116
+ originalContentUrl: getCdnUrl({url: imgSrc}),
116
117
  previewImageUrl: imgPreview,
117
118
  messageTitle,
118
119
  index,
@@ -155,7 +156,7 @@ export const LineImage = ({
155
156
  }
156
157
  updateMessageState({
157
158
  isError: !imageSrc || !(isFullMode ? value : true) || isImageError || !value,
158
- originalContentUrl: imageSrc,
159
+ originalContentUrl: getCdnUrl({url: imageSrc}),
159
160
  previewImageUrl: imagePreview,
160
161
  messageTitle: value,
161
162
  index,
@@ -412,7 +413,7 @@ export const LineImage = ({
412
413
  updateImagePreview(imagePreview);
413
414
  updateMessageState({
414
415
  isError: !image || !(isFullMode ? messageTitle : true) || isImageError || errorMessageTitle,
415
- originalContentUrl: image,
416
+ originalContentUrl: getCdnUrl({url: image}),
416
417
  previewImageUrl: imagePreview,
417
418
  messageTitle,
418
419
  index,
@@ -103,7 +103,7 @@ export const LineImageCarousel = (props) => {
103
103
  } = content || {};
104
104
  validCarouselImages.push({
105
105
  activeIndex: index,
106
- originalContentUrl: url,
106
+ originalContentUrl: getCdnUrl({url: url}),
107
107
  aspectRatio,
108
108
  selectedActionType: buttonType ? (buttonType === MESSAGE_ACTION_TYPE ? TEXT_ACTION_TYPE : URL_ACTION_TYPE) : '',
109
109
  actionContent: text || uri,
@@ -127,7 +127,7 @@ export const LineImageCarousel = (props) => {
127
127
 
128
128
  validCarouselImages.push({
129
129
  activeIndex: index,
130
- originalContentUrl: imageUrl,
130
+ originalContentUrl: getCdnUrl({url: imageUrl}),
131
131
  selectedActionType: type ? (type === MESSAGE_ACTION_TYPE ? TEXT_ACTION_TYPE : URL_ACTION_TYPE) : '',
132
132
  actionContent: text || uri,
133
133
  actionLabel: label,
@@ -160,7 +160,7 @@ export const LineImageCarousel = (props) => {
160
160
  ? isErrorIndex
161
161
  : ((!originalContentUrl || !selectedActionType || actionContentErrorMessage || actionLabelErrorMessage || !actionContent) && activeIndex);
162
162
  columns.push({
163
- imageUrl: originalContentUrl,
163
+ imageUrl: getCdnUrl({url: originalContentUrl}),
164
164
  aspectRatio,
165
165
  action: {
166
166
  type: selectedActionType ? (selectedActionType === TEXT_ACTION_TYPE ? MESSAGE_ACTION_TYPE : URL_ACTION_TYPE) : '',
@@ -455,7 +455,7 @@ export const LineImageCarousel = (props) => {
455
455
  } = content || {};
456
456
  validCarouselImages.push({
457
457
  activeIndex: index,
458
- originalContentUrl: url,
458
+ originalContentUrl: getCdnUrl({url: url}),
459
459
  aspectRatio,
460
460
  selectedActionType: buttonType ? (buttonType === MESSAGE_ACTION_TYPE ? TEXT_ACTION_TYPE : URL_ACTION_TYPE) : '',
461
461
  actionContent: text || uri,
@@ -480,7 +480,7 @@ export const LineImageCarousel = (props) => {
480
480
 
481
481
  validCarouselImages.push({
482
482
  activeIndex: index,
483
- originalContentUrl: imageUrl,
483
+ originalContentUrl: getCdnUrl({url: imageUrl}),
484
484
  selectedActionType: type ? (type === MESSAGE_ACTION_TYPE ? TEXT_ACTION_TYPE : URL_ACTION_TYPE) : '',
485
485
  actionContent: text || uri,
486
486
  actionLabel: label,
@@ -114,7 +114,7 @@ export const LineImageMap = ({
114
114
  if (imageSrc && (isFullMode ? messageTitle: true) && imageMapTemplate && actionLinks) {
115
115
  updateMessageState({
116
116
  isError: !imageSrc || !(isFullMode ? messageTitle : true) || !imageMapTemplate || (isImageError && errorMessageTitle) || errorTitle || !altText,
117
- baseUrl: imageSrc,
117
+ baseUrl: getCdnUrl({url: imageSrc}),
118
118
  messageTitle,
119
119
  index,
120
120
  type: IMAGE_MAP,
@@ -27,6 +27,8 @@ import {
27
27
  MAX_ACTION_LABEL_LENGTH,
28
28
  } from './constants';
29
29
 
30
+ import {getCdnUrl} from '../../../../utils/cdnTransformation';
31
+
30
32
  export const LineVideo = ({
31
33
  className,
32
34
  id,
@@ -58,7 +60,7 @@ export const LineVideo = ({
58
60
  const [isTemplateDrawerRequired, updateTemplateDrawerRequirement] = useState(false);
59
61
  const [selectedTemplate, updateSelectedTemplate] = useState();
60
62
 
61
- const [videoSrc, updateVideoSrc] = useState('');
63
+ const [videoSrc, setVideoSrc] = useState('');
62
64
  const [videoName, updateVideoName] = useState('');
63
65
  const [isVideo, updateVideoStatus] = useState(false);
64
66
  const [isVideoError, updateVideoErrorMessage] = useState(false);
@@ -75,6 +77,10 @@ export const LineVideo = ({
75
77
  const [videoWidth, updateVideoWidth] = useState();
76
78
  const [isPlaying, updateIsPlaying] = useState(false);
77
79
 
80
+ const updateVideoSrc = React.useCallback((url)=>{
81
+ const newUrl = getCdnUrl({url, transformationEnabled: false, reduceQuality: false});
82
+ setVideoSrc(newUrl)
83
+ },[]);
78
84
 
79
85
  useEffect(() => {
80
86
  const {