@capillarytech/creatives-library 7.12.77 → 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.
Files changed (6) hide show
  1. package/package.json +1 -1
  2. package/v2Containers/Line/Container/Image/index.js +5 -4
  3. package/v2Containers/Line/Container/ImageCarousel/index.js +5 -5
  4. package/v2Containers/Line/Container/ImageMap/index.js +1 -1
  5. package/v2Containers/Line/Container/Video/index.js +7 -1
  6. package/v2Containers/Line/Container/index.js +4 -5
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@capillarytech/creatives-library",
3
3
  "author": "meharaj",
4
- "version": "7.12.77",
4
+ "version": "7.12.78",
5
5
  "description": "Capillary creatives ui",
6
6
  "main": "./index.js",
7
7
  "module": "./index.es.js",
package/v2Containers/Line/Container/Image/index.js CHANGED
@@ -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,
package/v2Containers/Line/Container/ImageCarousel/index.js CHANGED
@@ -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,
package/v2Containers/Line/Container/ImageMap/index.js CHANGED
@@ -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,
package/v2Containers/Line/Container/Video/index.js CHANGED
@@ -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 {
package/v2Containers/Line/Container/index.js CHANGED
@@ -34,7 +34,6 @@ import * as templateActionsConfig from '../../Templates/actions';
34
34
  import withCreatives from '../../../hoc/withCreatives';
35
35
  import { gtmPush } from '../../../utils/gtmTrackers';
36
36
  import { LINE } from '../../CreativesContainer/constants';
37
- import { getCdnUrl } from '../../../utils/cdnTransformation';
38
37
 
39
38
  const { stopTimer } = GA.timeTracker;
40
39
 
@@ -402,7 +401,7 @@ export const LineContainer = ({
402
401
  messageData.previewImageUrl = previewImageUrl;
403
402
  }
404
403
  if (originalContentUrl) {
405
- messageData.originalContentUrl = getCdnUrl({url: originalContentUrl});
404
+ messageData.originalContentUrl = originalContentUrl;
406
405
  }
407
406
  if (selectedSticker) {
408
407
  messageData.stickerUrl = selectedSticker.stickerUrl;
@@ -411,7 +410,7 @@ export const LineContainer = ({
411
410
  messageData.stickerId = `${selectedSticker.stickerId}`;
412
411
  }
413
412
  if (baseUrl) {
414
- messageData.baseUrl = getCdnUrl({url: baseUrl});
413
+ messageData.baseUrl = baseUrl;
415
414
  messageData.altText = altText;
416
415
  }
417
416
  if (baseSize) {
@@ -427,7 +426,7 @@ export const LineContainer = ({
427
426
  type: 'bubble',
428
427
  hero: {
429
428
  type: 'image',
430
- url: getCdnUrl({url: item.imageUrl}),
429
+ url: item.imageUrl,
431
430
  size: 'full',
432
431
  aspectRatio: item.aspectRatio,
433
432
  aspectMode: 'cover',
@@ -474,7 +473,7 @@ export const LineContainer = ({
474
473
  height: videoHeight,
475
474
  width: videoWidth,
476
475
  },
477
- originalContentUrl: getCdnUrl({url: videoSrc, transformationEnabled: false, reduceQuality: false}),
476
+ originalContentUrl: videoSrc,
478
477
  previewImageUrl,
479
478
  };
480
479
  if (actionLabel) {