@capillarytech/creatives-library 6.8.4 → 6.8.5

package/app.js

@@ -76,6 +76,7 @@ Bugsnag.start({
   // eslint-disable-next-line no-undef
   apiKey: BUGSNAG_API_KEY,
   releaseStage: window.location.hostname,
+  enabledReleaseStages: ['production', 'staging'],
   plugins: [new BugsnagPluginReact()],
   onError: bugSnagErrorCallback,
 });

package/package.json

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

package/utils/tagValidations.js

@@ -0,0 +1,137 @@
+/*
+ * This file is to maintain the tag validations
+ * across the forms used in creatives, very
+ * similar to the FormBuilder component.
+ * The motive is to chizzling out the dependency from
+ * FormBuilder component into meaningful blocks
+*/
+
+import lodashForEach from 'lodash/forEach';
+import lodashCloneDeep from 'lodash/cloneDeep';
+
+const DEFAULT = 'default';
+const SUBTAGS = 'subtags';
+
+export const validateTags = ({
+  content,
+  tagsParam,
+  injectedTagsParams,
+  location,
+  tagModule,
+}) => {
+  const tags = tagsParam;
+  const injectedTags = transformInjectedTags(injectedTagsParams);
+  let currentModule = location.query.module ? location.query.module : DEFAULT;
+  if (tagModule) {
+    currentModule = tagModule;
+  }
+  const response = {
+    valid: true,
+    missingTags: [],
+    unsupportedTags: [],
+  };
+  if(tags && tags.length) {
+    lodashForEach(tags, ({
+      definition: {
+        supportedModules,
+        value,
+      },
+    }) => {
+      lodashForEach(supportedModules, (module) => {
+        if (module.mandatory && (currentModule === module.context)) {
+          if (content.indexOf(`{{${value}}}`) === -1) {
+            response.valid = false;
+            response.missingTags.push(value);
+          }
+        }
+      });
+    });
+    const regex = /{{[(A-Z\w+(\s\w+)*$\(\)@!#$%^&*~.,/\\]+}}/g;
+    let match = regex.exec(content);
+    while (match !== null) {
+      const tagValue = match[0].substring(indexOfEnd(match[0], '{{'), match[0].indexOf('}}'));
+      match = regex.exec(content);
+      let ifSupported = false;
+      lodashForEach(tags, (tag) => {
+        if (tag.definition.value === tagValue) {
+          ifSupported = true;
+        }
+      });
+      const ifSkipped = skipTags(tagValue);
+      if (ifSkipped) {
+        ifSupported = true;
+        let isUnsubscribeSkipped = tagValue.indexOf("unsubscribe") != -1 ;
+        if (isUnsubscribeSkipped) {
+          const missingTagIndex = response.missingTags.indexOf("unsubscribe");
+          if(missingTagIndex != -1) { //skip regex tags for mandatory tags also
+            response.missingTags.splice(missingTagIndex, 1);
+          }
+        }
+      }
+      ifSupported = ifSupported || checkIfSupportedTag(tagValue, injectedTags);
+      if (!ifSupported) {
+        response.unsupportedTags.push(tagValue);
+        response.valid = false;
+      }
+      if (response.unsupportedTags.length == 0 && response.missingTags.length == 0 ) {
+        response.valid = true;
+      }
+    }
+  }
+  return response;
+}
+
+const checkIfSupportedTag = (checkingTag, injectedTags) => {
+  let result = false;
+  lodashForEach(injectedTags, (tag, key) => {
+    if (tag.subtags && checkIfSupportedTag(checkingTag, tag.subtags)) {
+      result = true;
+    } else if (checkingTag === key) {
+      result = true;
+    }
+  });
+  
+  return result;
+}
+
+const indexOfEnd = (targetString, string) => {
+  let io = targetString.indexOf(string);
+  return io == -1 ? -1 : io + string.length;
+}
+
+const skipTags = (tag) => {
+  const regexGroups = ["dynamic_expiry_date_after_\\d+_days.FORMAT_\\d", "unsubscribe\\(#[a-zA-Z\\d]{6}\\)","Link_to_[a-zA-z]","SURVEY.*.TOKEN","^[A-Za-z].*\\([\\d]*\\)"];
+  let skipped = false;
+  lodashForEach(regexGroups, (group) => {
+    const groupRegex = new RegExp(group, "g");
+    let match = groupRegex.exec(tag);
+    if (match !== null ) {
+      skipped = true;
+      return true;
+    }
+    return true;
+  });
+  return skipped;
+}
+
+const transformInjectedTags = (tags) => {
+  lodashForEach(tags, (tag) => {
+    const temp = tag;
+    let subKey = '';
+    Object.keys(tag).map( (k) => {
+      if (k.indexOf(SUBTAGS) !== -1) {
+        subKey = k;
+      }
+      return true;
+    });
+    if (subKey !== '') {
+      temp['tag-header'] = true;
+      if (subKey !== SUBTAGS) {
+        temp.subtags =lodashCloneDeep(temp[subKey]);
+        delete temp[subKey];
+      }
+      temp.subtags = transformInjectedTags(temp.subtags);
+    }
+  });
+  return tags;
+}

package/v2Components/TemplatePreview/WechatRichmediaTemplatePreview/_wechatRichmediaTemplatePrev.scss

@@ -1,152 +1,152 @@
-@import '~@capillarytech/cap-ui-library/styles/_variables.scss';
-
-.shell-lock-screen-android .main-screen-preview .wechatMsgContainer{
-  position: absolute;
-  left: 53.5%;
-  top:28%;
-  background: white;
-  width: 19.5%;
-  text-align: left;
-  height: fit-content;
-  border-radius: 0.285rem;
-}
-
-.shell-lock-screen-android .lock-screen-preview{
-  .wechat-android-sender-id{
-    position: absolute;
-    top: 46%;
-    font-size: 10px;
-    left: 28%;
-  }
-  .wechat-android-title{
-    position: absolute;
-    top: 49%;
-    font-size: 10px;
-    left: 28%;
-    color: #5e6c84;
-  }
-  .wechat-android-action-buttons{
-    position: absolute;
-    left: 28%;
-    top: 53%;
-    font-size: 10px;
-    color: #3861ca;
-    font-weight: 500;
-  }
-  .wechat-ios-sender-id{
-    position: absolute;
-    top: 44%;
-    font-size: 10px;
-    left: 28.5%;
-  }
-  .wechat-ios-title{
-    position: absolute;
-    top: 47%;
-    font-size: 10px;
-    left: 28.5%;
-    color: #5e6c84;
-  }
-  .wechat-ios-action-reply{
-    position: absolute;
-    left: 35%;
-    top: 59%;
-    font-size: 12px;
-    color: #3861ca;
-    font-weight: 500;
-  }
-  .wechat-ios-action-cancel{
-    position: absolute;
-    left: 34.5%;
-    top: 66%;
-    font-size: 12px;
-    color: #3861ca;
-    font-weight: 500;
-  }
-}
-
-.wechatMsgContainer{
-    position: absolute;
-    left: 30%;
-    top: 20%;
-    background: white;
-    width: 40%;
-    text-align: left;
-    height: fit-content;
-    border-radius: $CAP_SPACE_04;
-    .richmedia-template {
-        .richmedia-image-container {
-          width: 100%;
-          height: 102px;
-          position: relative;
-          img {
-            border-top-left-radius: 4px;
-            border-top-right-radius: 4px;
-          }
-        }
-        .name-container-with-abstract {
-          padding: $CAP_SPACE_12;
-          height: 68px;
-        }
-        .name-container {
-          position: absolute;
-          bottom: 0px;
-          height: 44px;
-          padding-top: 16px;
-          padding-left: 12px;
-          color: $CAP_WHITE;
-          opacity: 0.7;
-          width: 100%;
-          background-image: linear-gradient(to top,black 0% ,transparent 100%);
-        }
-        .additional-richmedia-container {
-          display: flex;
-          justify-content: space-between;
-          margin: 8px;
-          padding-bottom: 8px;
-          img {
-            border-radius: 4px;
-          }
-        }
-        .additional-richmedia-container:not(:last-child) {
-            border-bottom: 1px solid #dfe2e7;
-          }
-        div {
-          text-overflow: ellipsis;
-          overflow: hidden;
-          white-space: nowrap;
-        }
-      }
-}
-.wechatMsgContainerOutbound{
-    position: absolute;
-    left: 35%;
-    top: 20%;
-    background: white;
-    width: 30%;
-    text-align: left;
-}
-.wechatMsgContainerCardLayout {
-    position: absolute;
-    left: 20%;
-    top: 20%;
-    background: white;
-    width: 60%;
-    text-align: left;
-}
-.overflow-handle-preview {
-    overflow-y: auto;
-}
-.overflow-handle-preview-outbound {
-    height: 330px;
-    overflow-y: auto;
-}
-.preview-overflow-wrap-fields {
-    text-overflow: ellipsis;
-    overflow: hidden;
-    overflow-wrap: break-word;
-    display: -webkit-box !important;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
-    text-align: left;
-    width: 200px;
+@import '~@capillarytech/cap-ui-library/styles/_variables.scss';
+
+.shell-lock-screen-android .main-screen-preview .wechatMsgContainer{
+  position: absolute;
+  left: 53.5%;
+  top:28%;
+  background: white;
+  width: 19.5%;
+  text-align: left;
+  height: fit-content;
+  border-radius: 0.285rem;
+}
+
+.shell-lock-screen-android .lock-screen-preview{
+  .wechat-android-sender-id{
+    position: absolute;
+    top: 46%;
+    font-size: 10px;
+    left: 28%;
+  }
+  .wechat-android-title{
+    position: absolute;
+    top: 49%;
+    font-size: 10px;
+    left: 28%;
+    color: #5e6c84;
+  }
+  .wechat-android-action-buttons{
+    position: absolute;
+    left: 28%;
+    top: 53%;
+    font-size: 10px;
+    color: #3861ca;
+    font-weight: 500;
+  }
+  .wechat-ios-sender-id{
+    position: absolute;
+    top: 44%;
+    font-size: 10px;
+    left: 28.5%;
+  }
+  .wechat-ios-title{
+    position: absolute;
+    top: 47%;
+    font-size: 10px;
+    left: 28.5%;
+    color: #5e6c84;
+  }
+  .wechat-ios-action-reply{
+    position: absolute;
+    left: 35%;
+    top: 59%;
+    font-size: 12px;
+    color: #3861ca;
+    font-weight: 500;
+  }
+  .wechat-ios-action-cancel{
+    position: absolute;
+    left: 34.5%;
+    top: 66%;
+    font-size: 12px;
+    color: #3861ca;
+    font-weight: 500;
+  }
+}
+
+.wechatMsgContainer{
+    position: absolute;
+    left: 30%;
+    top: 20%;
+    background: white;
+    width: 40%;
+    text-align: left;
+    height: fit-content;
+    border-radius: $CAP_SPACE_04;
+    .richmedia-template {
+        .richmedia-image-container {
+          width: 100%;
+          height: 102px;
+          position: relative;
+          img {
+            border-top-left-radius: 4px;
+            border-top-right-radius: 4px;
+          }
+        }
+        .name-container-with-abstract {
+          padding: $CAP_SPACE_12;
+          height: 68px;
+        }
+        .name-container {
+          position: absolute;
+          bottom: 0px;
+          height: 44px;
+          padding-top: 16px;
+          padding-left: 12px;
+          color: $CAP_WHITE;
+          opacity: 0.7;
+          width: 100%;
+          background-image: linear-gradient(to top,black 0% ,transparent 100%);
+        }
+        .additional-richmedia-container {
+          display: flex;
+          justify-content: space-between;
+          margin: 8px;
+          padding-bottom: 8px;
+          img {
+            border-radius: 4px;
+          }
+        }
+        .additional-richmedia-container:not(:last-child) {
+            border-bottom: 1px solid #dfe2e7;
+          }
+        div {
+          text-overflow: ellipsis;
+          overflow: hidden;
+          white-space: nowrap;
+        }
+      }
+}
+.wechatMsgContainerOutbound{
+    position: absolute;
+    left: 35%;
+    top: 20%;
+    background: white;
+    width: 30%;
+    text-align: left;
+}
+.wechatMsgContainerCardLayout {
+    position: absolute;
+    left: 20%;
+    top: 20%;
+    background: white;
+    width: 60%;
+    text-align: left;
+}
+.overflow-handle-preview {
+    overflow-y: auto;
+}
+.overflow-handle-preview-outbound {
+    height: 330px;
+    overflow-y: auto;
+}
+.preview-overflow-wrap-fields {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    overflow-wrap: break-word;
+    display: -webkit-box !important;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    text-align: left;
+    width: 200px;
   }

package/v2Components/TemplatePreview/WechatRichmediaTemplatePreview/messages.js

@@ -1,33 +1,33 @@
-/*
- * WechatRichmediaTemplatePreview Messages
- *
- * This contains all the text for the WechatRichmediaTemplatePreview component.
- */
-import { defineMessages } from 'react-intl';
-
-export default defineMessages({
-  header: {
-    id: 'creatives.components.WechatRichmediaTemplatePreview.header',
-    defaultMessage: 'This is the WechatRichmediaTemplatePreview component !',
-  },
-  select: {
-    id: 'creatives.components.WechatRichmediaTemplatePreview.select',
-    defaultMessage: 'Select',
-  },
-  edit: {
-    id: 'creatives.components.WechatRichmediaTemplatePreview.edit',
-    defaultMessage: 'Edit',
-  },
-  MarkAsRead: {
-    id: 'creatives.components.WechatRichmediaTemplatePreview.MarkAsRead',
-    defaultMessage: 'Mark as read',
-  },
-  reply: {
-    id: 'creatives.components.WechatRichmediaTemplatePreview.reply',
-    defaultMessage: 'Reply',
-  },
-  cancel: {
-    id: 'creatives.components.WechatRichmediaTemplatePreview.cancel',
-    defaultMessage: 'Cancel',
-  },
-});
+/*
+ * WechatRichmediaTemplatePreview Messages
+ *
+ * This contains all the text for the WechatRichmediaTemplatePreview component.
+ */
+import { defineMessages } from 'react-intl';
+
+export default defineMessages({
+  header: {
+    id: 'creatives.components.WechatRichmediaTemplatePreview.header',
+    defaultMessage: 'This is the WechatRichmediaTemplatePreview component !',
+  },
+  select: {
+    id: 'creatives.components.WechatRichmediaTemplatePreview.select',
+    defaultMessage: 'Select',
+  },
+  edit: {
+    id: 'creatives.components.WechatRichmediaTemplatePreview.edit',
+    defaultMessage: 'Edit',
+  },
+  MarkAsRead: {
+    id: 'creatives.components.WechatRichmediaTemplatePreview.MarkAsRead',
+    defaultMessage: 'Mark as read',
+  },
+  reply: {
+    id: 'creatives.components.WechatRichmediaTemplatePreview.reply',
+    defaultMessage: 'Reply',
+  },
+  cancel: {
+    id: 'creatives.components.WechatRichmediaTemplatePreview.cancel',
+    defaultMessage: 'Cancel',
+  },
+});

package/v2Components/TemplatePreview/WechatRichmediaTemplatePreview/tests/index.test.js

@@ -1,10 +1,10 @@
-// import React from 'react';
-// import { shallow } from 'enzyme';
-
-// import WechatRichmediaTemplatePreview from '../index';
-
-describe('<WechatRichmediaTemplatePreview />', () => {
-  it('Expect to have unit tests specified', () => {
-    expect(true).toEqual(false);
-  });
-});
+// import React from 'react';
+// import { shallow } from 'enzyme';
+
+// import WechatRichmediaTemplatePreview from '../index';
+
+describe('<WechatRichmediaTemplatePreview />', () => {
+  it('Expect to have unit tests specified', () => {
+    expect(true).toEqual(false);
+  });
+});