@capillarytech/creatives-library 7.12.109 → 7.12.110

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "7.12.109",
+  "version": "7.12.110",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/utils/cdnTransformation.js

@@ -5,9 +5,13 @@ import isNumber from "lodash/isNumber";
 /* eslint-disable no-unused-expressions */
 import { parse } from "node-html-parser";
 
-// https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=100,height=100,quality=75,fit=cover,g=top,format=auto/intouch_creative_assets/005710a7-6412-44fe-a19f-e72456b1.jpg
+// example cdn url
+// https://storage.crm.n.content-cdn.io/cdn-cgi/image/width=100,height=100,quality=75,format=auto/intouch_creative_assets/005710a7-6412-44fe-a19f-e72456b1.jpg
 
-// const regex = /https:\/\/.*intouch_creative_assets.*(?:jpg|png|jpeg|gif)$/;
+/**
+ * regex tests presence of intouch_creative_assets in the url.
+ * We are not testing for extensions such as jpg/png because some channels like LINE - IMAGEMAP url doesn't contain extension.
+ */
 const regex = /https:\/\/.*intouch_creative_assets.*$/;
 const INTOUCH_CREATIVE_ASSETS = "intouch_creative_assets";
 const SPECIFIED = "specified";
@@ -16,7 +20,15 @@ const QUALITY_TYPE = {
   DECREASE: "decrease",
   PRESERVE: "preserve",
 };
+const CREATIVES_CDN_BASE_URL_KEY = 'CREATIVES_CDN_BASE_URL';
+const CREATIVES_CDN_QUALITY_CONFIG_KEY = 'CREATIVES_CDN_QUALITY_CONFIG';
+const CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX_KEY = 'CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX';
 
+
+/**
+ * CHANNEL_CONFIGS maintains the transformation details for each channel (and optionally subchannel ex. FACEBOOK/LINE)
+ * In case of SUBCHANNELS, they are nested inside CHANNEL.
+ */
 const CHANNEL_CONFIGS = {
   EMAIL: {
     transformations: {
@@ -85,19 +97,35 @@ const CHANNEL_CONFIGS = {
   },
   WECHAT: {
     transformations: {
-      width: 360,
-      height: 200,
       quality: QUALITY_TYPE.DECREASE,
-      
     }
   }
 };
 
-const CREATIVES_CDN_BASE_URL_KEY = 'CREATIVES_CDN_BASE_URL';
-const CREATIVES_CDN_QUALITY_CONFIG_KEY = 'CREATIVES_CDN_QUALITY_CONFIG';
-const CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX_KEY = 'CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX';
 /**
+ * 
+ * @param {string} url : required 
+ * @param {number} height : optional | required when height needs to be manually specified for channels such as email.
+ * @param {number} width : optional | required when width needs to be manually specified for channels such as email.
+ * @param {string} channelName : required 
+ * @param {string} channelSubType : optional | required when channel has multiple subtypes
+ * 
+ * @returns 
  * getCdnUrl : utility function to replace and return s3/cdn url with cdn url.
+ * Step 1. Basic validations:
+ *  a) If data type of cdn items stored in local storage is incorrect(maybe as a result of manual modification), the received url in param is returned.
+ *  b) If cdn local storage items are emtpy then received url in param is returned.
+ *  c) If url doesn't match with regex.
+ *  d) Channel/Subchannel not present in CHANNEL_CONFIGS
+ *  e) No quality and default quality mentioned in CHANNEL_CONFIGS for given channel.
+ *  f) If channels quality is non numeric(maybe as a result of manual modification) then quality=100 is returned.
+ * 
+ * Step 2. The CHANNEL_CONFIGS determine the applicableTransformations.
+ * Step 3. If applicable transformations are present `CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX` is appended to cdn url and transformation properties are added.
+ * Step 4. The original s3 file name is appened at the end of the url to get complete cdn url and value is returned.
+ * 
+ * Error handling:
+ * In case of any unknown exception, url received in param is returned.
  */
 export const getCdnUrl = ({
   url,
@@ -202,7 +230,7 @@ export const getCdnUrl = ({
 
 /**
  *
- * @param {*} htmlContents
+ * @param {string} htmlContents accepts htmlContents - strigified.
  * @returns htmlContents with updated urls in image tag
  */
 export const updateImagesInHtml = (htmlContents) => {
@@ -235,6 +263,7 @@ export const updateImagesInHtml = (htmlContents) => {
  *
  * @param {*} contents
  * @returns
+ * Transforms the email template's html by images replacing the s3 url / cdn url with cdn url.
  */
 export const transformEmailTemplates = (contents) => {
   const contentsCopy = cloneDeep(contents);
@@ -254,7 +283,12 @@ export const transformEmailTemplates = (contents) => {
 };
 
 
-
+/**
+ * 
+ * @param {*} key 
+ * @param {*} parse 
+ * @returns Localstorage item with mentioned key. Parses the value if second param `parse` is true.
+ */
 export function getLocalStorageItem(key, parse = false){
   const val = localStorage.getItem(key);
   if(parse){
@@ -263,11 +297,17 @@ export function getLocalStorageItem(key, parse = false){
   return val;
 }
 
+/**
+ * Removes specified key from local storage.
+ */
 export function removeLocalStorageItem(key) {
   localStorage.removeItem(key);
   return;
 }
 
+/**
+ * Util function. Removes all cdn related local storage items.
+ */
 export function removeAllCdnLocalStorageItems() {
   try{
     removeLocalStorageItem(CREATIVES_CDN_BASE_URL_KEY);
@@ -278,6 +318,19 @@ export function removeAllCdnLocalStorageItems() {
   }
 }
 
+/**
+ * 
+ * @param {*} configsResponse 
+ * This util function saves the getCdnConfigs response into the local storage.
+ * The following response items are mapped into the following keys in local storage:
+ * hostname -> CREATIVES_CDN_BASE_URL
+ * qualityCfg ->CREATIVES_CDN_QUALITY_CONFIG
+ * transformationUrlSuffix -> CREATIVES_CDN_TRANSFORMATION_URL_SUFFIX
+ * 
+ * 1. If configsReponse is empty. All above mentioned keys are deleted from localstorage.
+ * 2. If any one of the above keys is missing. The respective keys are deleted from localstorage.
+ * 3. Else it is saved into the localstorage.
+ */
 export function saveCdnConfigs(configsResponse) {
   try {
     //If no response from api, then remove localStorage items if they were set previously