@capillarytech/creatives-library 7.10.41 → 7.10.42

package/package.json

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

package/v2Components/TemplatePreview/index.js

@@ -195,8 +195,8 @@ class TemplatePreview extends React.Component { // eslint-disable-line react/pre
     };
     const whatsappSectionStyle = {
       "padding": '3.5px 0 0',
-      'border-radius': '6px',
-      'background-color': CAP_G15,
+      'borderRadius': '6px',
+      'backgroundColor': CAP_G15,
       'width': '88%',
       'left': '10%',
     };

package/v2Containers/Whatsapp/index.js

@@ -134,8 +134,10 @@ export const Whatsapp = (props) => {
     }
     //cleanup code
     return () => {
-      actions.resetEditTemplate();
-      varMap = {};
+      if (isEditFlow) {
+        actions.resetEditTemplate();
+        varMap = {};
+      }
     };
   }, [paramObj.id]);
 
@@ -214,28 +216,32 @@ export const Whatsapp = (props) => {
   // tag Code start from here
   useEffect(() => {
     //fetching tags
-    const { type, module } = location.query || {};
-    const isEmbedded = type === EMBEDDED;
-    const query = {
-      layout: 'SMS',
-      type: TAG,
-      context: isEmbedded ? module : DEFAULT,
-      embedded: isEmbedded ? type : FULL,
-    };
-    if (getDefaultTags) {
-      query.context = getDefaultTags;
+    if (isEditFlow) {
+      const { type, module } = location.query || {};
+      const isEmbedded = type === EMBEDDED;
+      const query = {
+        layout: 'SMS',
+        type: TAG,
+        context: isEmbedded ? module : DEFAULT,
+        embedded: isEmbedded ? type : FULL,
+      };
+      if (getDefaultTags) {
+        query.context = getDefaultTags;
+      }
+      globalActions.fetchSchemaForEntity(query);
     }
-    globalActions.fetchSchemaForEntity(query);
   }, []);
 
   useEffect(() => {
-    let tag =
-      metaEntities && metaEntities.tags ? metaEntities.tags.standard : [];
-    const { type, module } = location.query || {};
-    if (type === EMBEDDED && module === LIBRARY && !getDefaultTags) {
-      tag = supportedTags;
+    if (isEditFlow) {
+      let tag =
+        metaEntities && metaEntities.tags ? metaEntities.tags.standard : [];
+      const { type, module } = location.query || {};
+      if (type === EMBEDDED && module === LIBRARY && !getDefaultTags) {
+        tag = supportedTags;
+      }
+      updateTags(tag);
     }
-    updateTags(tag);
   }, [metaEntities]);
 
   const handleOnTagsContextChange = (data) => {
@@ -351,10 +357,13 @@ export const Whatsapp = (props) => {
     </>
   );
 
+  //used by create and edit
   const renderMessageLength = () => (
     <CapHeading type="h6" className="whatsapp-render-message-length">
       {formatMessage(messages.templateMessageLength, {
-        currentLength: UNSUBSCRIBE_TEXT_LENGTH + templateMessage?.length,
+        currentLength: isEditFlow
+          ? updatedSmsEditor?.join('')?.length + UNSUBSCRIBE_TEXT_LENGTH
+          : templateMessage?.length + UNSUBSCRIBE_TEXT_LENGTH,
         maxLength: TEMPLATE_MESSAGE_MAX_LENGTH,
       })}
     </CapHeading>
@@ -733,6 +742,7 @@ export const Whatsapp = (props) => {
         />
       </CapRow>
       <CapTooltip
+        placement="bottom"
         title={
           templateStatus === WHATSAPP_STATUSES.approved
             ? ''
@@ -760,10 +770,18 @@ export const Whatsapp = (props) => {
   );
   //edit methods end
 
+  //used by create and edit
   const getPreviewSection = () => {
-    const templateMsg = `${
-      isEditFlow ? updatedSmsEditor.join('') : templateMessage
-    }\n${formatMessage(messages.templateMessageUnsubscribeText)}`;
+    const templateMsg = (
+      <>
+        <CapLabel type="label5">
+          {isEditFlow ? updatedSmsEditor.join('') : templateMessage}
+        </CapLabel>
+        <CapLabel type="label11">
+          {formatMessage(messages.templateMessageUnsubscribeText)}
+        </CapLabel>
+      </>
+    );
     return (
       <TemplatePreview
         channel={WHATSAPP}