@capillarytech/creatives-library 2.0.64 → 2.0.66

package/components/FormBuilder/index.js

@@ -2673,21 +2673,21 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             ifError = this.state.checkValidation && (isVersionEnable ? this.state.errorData[`${this.state.currentTab - 1}`][val.id] : this.state.errorData[val.id]);
             const ImageComponent = (props) => (
               <div>
-                <div className={`image-container ${ifError ? 'error' : ''}`}>
+                <div className={`image-container ${props.ifError ? 'error' : ''}`}>
                   {self.state && !!self.state.formData[`${self.state.currentTab - 1}`].image ?
                     <img src={self.state.formData[`${self.state.currentTab - 1}`].image} alt={props.alt} style={props.style}/>
                     :
                     <div style={{width: "100%", textAlign: "center"}}><span className="image-placeholder">{props.placeholder}</span></div>
                   }
                 </div>
-                {ifError && <div><span className="error">{props.errorMessage}</span></div>}
 
               </div>
              );
             const WithLabel = LabelHOC(ImageComponent);
+            const {errorMessage, ...rest} = val.previewProps;
             columns.push(
               <CapColumn span={val.width} offset={val.offset} style={val.style}>
-                {val.showPreview && <WithLabel {...val.previewProps}/>}
+                {val.showPreview && <WithLabel key={`${val.id}-with-label`} {...rest} errorMessage={ifError && errorMessage}/>}
                 <form encType="multipart/form-data" id={val.id}>
                   <input key={val.id} style={{ display: 'none'}} id="fileName" type="file" onChange={(e) => this.uploadImages(e, {files: e.target.files}, val)} accept="image/*" />
                   <CapButton disabled={val.disabled ? val.disabled : false} type="secondary" onClick={(e) => this.openFileDialog(e)} style={{float: 'right', marginTop: '-68px'}}>

package/containers/CreativesContainer/SlideBoxContent.js

@@ -9,6 +9,7 @@ import Email from '../Email';
 import EmailWrapper from '../EmailWrapper';
 import MobilepusWrapper from '../MobilepushWrapper';
 import EmailPreviewV2 from '../../components/EmailPreviewV2';
+import MobilePushPreview from '../../components/MobilePushPreviewV2';
 import CallTask from '../CallTask';
 import MobliPushEdit from '../MobilePush/Edit';
 import * as constants from './constants';
@@ -60,6 +61,7 @@ function SlideBoxContent(props) {
   let isEmailEditWithContent = false;
   let isPreview = false;
   let isEmailPreview = false;
+  let isMpushPreview = false;
   let isEditCallTask = false;
   let isEditMPush = false;
   const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL;
@@ -70,8 +72,9 @@ function SlideBoxContent(props) {
     isEditMPush = slidBoxContent === 'editTemplate' && channel === constants.MOBILE_PUSH;
     isEditEmailWithId = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && templateData._id;
     isEmailEditWithContent = slidBoxContent === 'editTemplate' && channel === constants.EMAIL && !templateData._id;
-    isPreview = slidBoxContent === 'preview' && channel !== constants.EMAIL;
+    isPreview = slidBoxContent === 'preview' && channel === constants.SMS;
     isEmailPreview = slidBoxContent === 'preview' && channel === constants.EMAIL;
+    isMpushPreview = slidBoxContent === 'preview' && channel === constants.MOBILE_PUSH;
   }
 
   return (
@@ -103,6 +106,9 @@ function SlideBoxContent(props) {
          />
       )
       }
+      {isMpushPreview &&
+        <MobilePushPreview templateData={templateData} channel={channel}/>
+      }
       {isEditSms && (
       <SmsEdit
         setIsLoadingContent={setIsLoadingContent}

package/containers/MobilePush/Create/index.js

@@ -420,6 +420,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
           return undefined;
         }).filter((custom) => custom),
       };
+      obj.name = isEmpty(obj.name) ? android['message-title'] : obj.name;
     }
     if (android['cta-deeplink'] && android['cta-deeplink'] !== "") {
       obj.versions.base.ANDROID.cta = {
@@ -452,6 +453,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
           return undefined;
         }).filter((custom) => custom),
       };
+      obj.name = isEmpty(obj.name) ? ios['message-title2'] : obj.name;
     }
     if (ios['cta-deeplink2'] && ios['cta-deeplink2'] !== "") {
       obj.versions.base.IOS.cta = {
@@ -560,6 +562,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
       }
       if (secondaryCtaIos) {
         obj.versions.base.IOS.expandableDetails.ctas = [];
+        const templateCtaId = get(this.state, "templateCta.ctaTemplateDetails[0].id");
         const cta = {
           actionText: ios['secondary-cta-1-label'],
           actionLabel: ios['secondary-cta-1-action'],
@@ -567,7 +570,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
           type: ios['cta-deeplink-secondary-cta-1'] && (ios['cta-deeplink-secondary-cta-1'].toLowerCase() === "deeplink" ? "DEEP_LINK" : "EXTERNAL_URL"),
           actionLink: ios['cta-deeplink-secondary-cta-1'] && (ios['cta-deeplink-secondary-cta-1'].toLowerCase() === "deeplink" ? (ios['cta-deeplink-secondary-cta-1-select2'] || ios['cta-deeplink-secondary-cta-1-select']) : ios['cta-deeplink-secondary-cta-1-text']),
           ioscdeepLinkName: this.getLinkName(ios['cta-deeplink-secondary-cta-1-select']),
-          templateCtaId: get(this.state, "templateCta.ctaTemplateDetails[0].id"),
+          templateCtaId,
         };
         if (this.props.location.query.type === 'embedded') {
           delete cta.ioscdeepLinkName;

package/containers/MobilePush/Edit/index.js

@@ -547,6 +547,8 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
 
     if (secondaryCtaIos) {
       obj.versions.base.IOS.expandableDetails.ctas = [];
+      const templateCtaId = get(this.state, "templateCta.ctaTemplateDetails[0].id");
+
       const cta = {
         actionText: ios['secondary-cta-1-label'],
         actionLabel: ios['secondary-cta-1-action'],
@@ -554,7 +556,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
         type: ios['cta-deeplink-secondary-cta-1'] && (ios['cta-deeplink-secondary-cta-1'].toLowerCase() === "deeplink" ? "DEEP_LINK" : "EXTERNAL_URL"),
         actionLink: ios['cta-deeplink-secondary-cta-1'] && (ios['cta-deeplink-secondary-cta-1'].toLowerCase() === "deeplink" ? ios['cta-deeplink-secondary-cta-1-select2'] : ios['cta-deeplink-secondary-cta-1-text2']),
         ioscdeepLinkName: this.getLinkName(ios['cta-deeplink-secondary-cta-1-select']),
-        templateCtaId: get(this.state, "templateCta.ctaTemplateDetails[0].id"),
+        templateCtaId,
       };
       if (this.props.location.query.type === 'embedded') {
         delete cta.ioscdeepLinkName;

package/containers/MobilePush/initialSchema.js

@@ -1216,12 +1216,12 @@ export const response = {
                                       showPreview: true,
                                       previewProps: {
                                         label: "Cover Image",
-                                        inductiveText: "Maximum file size acceptable is 5 mb",
+                                        inductiveText: "Maximum file size acceptable is 5 MB",
                                             // placeholder: "Max file size acceptable is 5mb",
                                         errorMessage: "Please upload Image",
 
                                       },
-                                      width: 20,
+                                      width: 22,
                                       metaType: "text",
                                       datatype: "string",
                                       required: true,
@@ -1594,13 +1594,13 @@ export const response = {
                                       showPreview: true,
                                       previewProps: {
                                         label: "Cover Image",
-                                        inductiveText: "Maximum file size acceptable is 5 mb",
+                                        inductiveText: "Maximum file size acceptable is 5 MB",
                                             // placeholder: "Max file size acceptable is 5mb",
                                         errorMessage: "Please upload Image",
 
                                       },
                                       type: "upload",
-                                      width: 20,
+                                      width: 22,
                                       metaType: "text",
                                       datatype: "string",
                                       required: true,

package/containers/MobilepushWrapper/index.js

@@ -18,6 +18,12 @@ export class MobilepushWrapper extends React.Component { // eslint-disable-line
   constructor(props) {
     super(props);
     this.modes = [
+
+      {
+        title: <FormattedMessage {...messages.image}/>,
+        content: <WithImage height="248px" width={"248px"}/>,
+        value: 'image',
+      },
       {
         title: <FormattedMessage {...messages.text}/>,
         content: <WithNoImage height="124px" width={"248px"}/>,
@@ -26,11 +32,6 @@ export class MobilepushWrapper extends React.Component { // eslint-disable-line
         //   this.emailUploader.current.click();
         // },
       },
-      {
-        title: <FormattedMessage {...messages.image}/>,
-        content: <WithImage height="248px" width={"248px"}/>,
-        value: 'image',
-      },
     ];
   }
   onChange = (e) => {

package/containers/Templates/index.js

@@ -470,6 +470,8 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
         templateData.content = template.versions.base['sms-editor'];
       } else if (currentChannel === "EMAIL") {
         templateData.url = template.versions.base.preview_http_url;
+      } else if (currentChannel === "MOBILEPUSH" && template.type === "MOBILEPUSH") {
+        templateData.content = template;
       }
       return templateData;
     });

package/package.json

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