@capillarytech/creatives-library 3.9.21 → 3.10.0

package/translations/en.json

@@ -1,7 +1,6 @@
 {
   "app.components.TemplatePreview.includesOptoutTag": "Includes optout tag",
   "app.components.TemplatePreview.optoutCharactersTotal": "Includes optout tag ({optoutUrlLength} characters)",
-  "creatives.components.TemplatePreview.unicodeIconTooltip": "This message has unicode characters. This may affect the cost per message.",
   "creatives.components.BreadCrumbs.header": "This is the BreadCrumbs component !",
   "creatives.components.CapTagList.Cancel": "Cancel",
   "creatives.components.CapTagList.Ok": "Ok",
@@ -113,8 +112,6 @@
   "creatives.componentsV2.FormBuilder.contentNotValidLanguage": "Content is not valid for language:",
   "creatives.componentsV2.FormBuilder.dragAndDrop": "Drag and drop image here",
   "creatives.componentsV2.FormBuilder.header": "This is the FormBuilder component !",
-  "creatives.componentsV2.FormBuilder.imageDimenstionDescription": "Dimensions: 300px x 400px  Size: 30mb",
-  "creatives.componentsV2.FormBuilder.imageReUpload": "Re upload",
   "creatives.componentsV2.FormBuilder.layoutSelection": "Layout Selection",
   "creatives.componentsV2.FormBuilder.loadingEDMTemplates": "Loading EDM Templates",
   "creatives.componentsV2.FormBuilder.missingTags": "Missing tags are:",
@@ -123,8 +120,6 @@
   "creatives.componentsV2.FormBuilder.selectAFile": "Select a file from your computer",
   "creatives.componentsV2.FormBuilder.unsupportedTags": "Unsupported tags are:",
   "creatives.componentsV2.FormBuilder.upload": "Upload",
-  "creatives.componentsV2.FormBuilder.uploadComputer": "Your computer",
-  "creatives.componentsV2.FormBuilder.uploadGallery": "Gallery",
   "creatives.componentsV2.FormBuilder.yes": "Yes",
   "creatives.componentsV2.Header.cancel": "Cancel",
   "creatives.componentsV2.Header.header": "This is the Header component !",
@@ -234,7 +229,6 @@
   "creatives.containers.Create.graphic_details_page": "Whether to display the graphic cover on the graphic details page",
   "creatives.containers.Create.header": "This is Create container !",
   "creatives.containers.Create.http_example": "Example: http://example.com",
-  "creatives.containers.Create.imageGallery": "Gallery",
   "creatives.containers.Create.markFinalVersionLabel": "Mark as final",
   "creatives.containers.Create.maxContentCount": "You have reached the maximum template size",
   "creatives.containers.Create.messageLabel": "Message",
@@ -252,17 +246,9 @@
   "creatives.containers.Create.sourceLinkEmpty": "Cannot leave source link field empty",
   "creatives.containers.Create.tagsErrorMessage": "\"Optout\" label is mandatory. Please add \"Optout\" label to this message",
   "creatives.containers.Create.tagsLabel": "Tags",
-  "creatives.containers.Create.templateAddTag": "Add tag",
   "creatives.containers.Create.templateDataNotValid": "Template data is not valid",
   "creatives.containers.Create.templateMarkedFinal": "Template Marked as Final Successfully",
-  "creatives.containers.Create.templateMessageError": "Template content cannot be empty!",
-  "creatives.containers.Create.templateMessagePlaceholder": "Please input line template content.",
-  "creatives.containers.Create.templateMessagePreviewPropsError": "Please upload image",
-  "creatives.containers.Create.templateMessagePreviewPropsInductiveText": "The relevant image that complements the message context.",
-  "creatives.containers.Create.templateMessagePreviewPropsLabel": "Upload image content",
-  "creatives.containers.Create.templateNameErrorPlaceholder": "Template name cannot be empty.",
   "creatives.containers.Create.templateNamePlaceHolder": "Enter template name",
-  "creatives.containers.Create.templatePlaceholder": "Enter template name",
   "creatives.containers.Create.titleCharacterCount": "Title exceeds character count limit by",
   "creatives.containers.Create.titleEmpty": "Cannot leave title field empty",
   "creatives.containers.Create.titleNameRepeated": "Title name cannot be repeated",
@@ -1065,7 +1051,6 @@
   "creatives.containersV2.Line.Create.image": "Please upload an image to proceed",
   "creatives.containersV2.Line.Create.inputLineTemplateContent": "Please enter the message content",
   "creatives.containersV2.Line.Create.line": "Line",
-  "creatives.containersV2.Line.Create.lineTemplateCreatedSuccessfully": "Line template created successfully",
   "creatives.containersV2.Line.Create.maxUploadFileSize": "Max file size acceptable is 5mb",
   "creatives.containersV2.Line.Create.maximumCharacterLengthExceeds": "Maximum characters length exceeds",
   "creatives.containersV2.Line.Create.message": "Message",
@@ -1080,6 +1065,7 @@
   "creatives.containersV2.Line.Create.somethingWentWrong": "Something went wrong!!",
   "creatives.containersV2.Line.Create.template": "Template",
   "creatives.containersV2.Line.Create.templateCantEmpty": "Template name cannot be empty",
+  "creatives.containersV2.Line.Create.templateCreatedSuccessfully": "Line template created successfully",
   "creatives.containersV2.Line.Create.templateEditedSuccessfully": "Line template edited successfully",
   "creatives.containersV2.Line.Create.templateNameNotEmpty": "Please provide a template name",
   "creatives.containersV2.Line.Create.templateNotConfigured": "template not configured,",
@@ -1092,17 +1078,6 @@
   "creatives.containersV2.Line.Create.uploadSuccess": "Photo uploaded successfully",
   "creatives.containersV2.Line.Create.uploadingImage": "Uploading image...",
   "creatives.containersV2.Line.Create.valueCantEmpty": "value cannot be empty.",
-  "creatives.containersV2.Line.CreateWrapper.accountLineListDescription": "Choose the account to send content",
-  "creatives.containersV2.Line.CreateWrapper.accountLineListTitle": "Line accounts",
-  "creatives.containersV2.Line.CreateWrapper.accountLineNoListTitle": "No line accounts present",
-  "creatives.containersV2.Line.CreateWrapper.continue": "Continue",
-  "creatives.containersV2.Line.CreateWrapper.hybridTemplateDescription": "Used to create combined text & image or video content",
-  "creatives.containersV2.Line.CreateWrapper.hybridTemplateTitle": "Hybrid",
-  "creatives.containersV2.Line.CreateWrapper.imageTemplateDescription": "Used for creating image or video content",
-  "creatives.containersV2.Line.CreateWrapper.imageTemplateTitle": "Image/video template",
-  "creatives.containersV2.Line.CreateWrapper.templateType": "Select the type of content",
-  "creatives.containersV2.Line.CreateWrapper.textTemplateDescription": "Used for announcing offers and transaction related information",
-  "creatives.containersV2.Line.CreateWrapper.textTemplateTitle": "Text template",
   "creatives.containersV2.Line.Edit.Campaigns": "Campaigns",
   "creatives.containersV2.Line.Edit.Creatives": "Creatives",
   "creatives.containersV2.Line.Edit.Image": "Image",
@@ -1330,7 +1305,6 @@
   "creatives.containersV2.Templates.imageTemplate": "Image",
   "creatives.containersV2.Templates.invalidUploadFileError": "File cannot be uploaded. Please select another file with valid file format.",
   "creatives.containersV2.Templates.layoutSelection": "Select layout",
-  "creatives.containersV2.Templates.lineAccount": "Line account",
   "creatives.containersV2.Templates.lineHeader": "Line",
   "creatives.containersV2.Templates.mapTemplate": "Map template",
   "creatives.containersV2.Templates.mapTemplates": "Map templates",
@@ -1343,7 +1317,6 @@
   "creatives.containersV2.Templates.newTemplate": "New template",
   "creatives.containersV2.Templates.noAccountMessage": "Please select an account to proceed",
   "creatives.containersV2.Templates.noAccountsPresent": "Push notifications are not setup for your brand",
-  "creatives.containersV2.Templates.noAccountsPresentLine": "Line accounts are not setup for your brand",
   "creatives.containersV2.Templates.noAccountsPresentWeChat": "Wechat accounts are not setup for your brand",
   "creatives.containersV2.Templates.noTemplatesFound": "No templates found",
   "creatives.containersV2.Templates.noTemplatesMessage": "No templates available",
@@ -1390,7 +1363,6 @@
   "creatives.containersV2.TemplatesV2.facebook": "Facebook",
   "creatives.containersV2.TemplatesV2.gallery": "Gallery",
   "creatives.containersV2.TemplatesV2.header": "This is TemplatesV2 container !",
-  "creatives.containersV2.TemplatesV2.line": "Line",
   "creatives.containersV2.TemplatesV2.pushNotification": "Push notification",
   "creatives.containersV2.TemplatesV2.select": "Select",
   "creatives.containersV2.TemplatesV2.sms": "SMS",

package/translations/zh.json

@@ -1,7 +1,6 @@
 {
   "app.components.TemplatePreview.includesOptoutTag": "",
   "app.components.TemplatePreview.optoutCharactersTotal": "",
-  "creatives.components.TemplatePreview.unicodeIconTooltip": "",
   "creatives.components.BreadCrumbs.header": "",
   "creatives.components.CapTagList.Cancel": "",
   "creatives.components.CapTagList.Ok": "",
@@ -113,8 +112,6 @@
   "creatives.componentsV2.FormBuilder.contentNotValidLanguage": "",
   "creatives.componentsV2.FormBuilder.dragAndDrop": "",
   "creatives.componentsV2.FormBuilder.header": "",
-  "creatives.componentsV2.FormBuilder.imageDimenstionDescription": "",
-  "creatives.componentsV2.FormBuilder.imageReUpload": "",
   "creatives.componentsV2.FormBuilder.layoutSelection": "",
   "creatives.componentsV2.FormBuilder.loadingEDMTemplates": "",
   "creatives.componentsV2.FormBuilder.missingTags": "",
@@ -123,8 +120,6 @@
   "creatives.componentsV2.FormBuilder.selectAFile": "",
   "creatives.componentsV2.FormBuilder.unsupportedTags": "",
   "creatives.componentsV2.FormBuilder.upload": "",
-  "creatives.componentsV2.FormBuilder.uploadComputer": "",
-  "creatives.componentsV2.FormBuilder.uploadGallery": "",
   "creatives.componentsV2.FormBuilder.yes": "",
   "creatives.componentsV2.Header.cancel": "",
   "creatives.componentsV2.Header.header": "",
@@ -234,7 +229,6 @@
   "creatives.containers.Create.graphic_details_page": "",
   "creatives.containers.Create.header": "",
   "creatives.containers.Create.http_example": "",
-  "creatives.containers.Create.imageGallery": "",
   "creatives.containers.Create.markFinalVersionLabel": "",
   "creatives.containers.Create.maxContentCount": "",
   "creatives.containers.Create.messageLabel": "",
@@ -252,17 +246,9 @@
   "creatives.containers.Create.sourceLinkEmpty": "",
   "creatives.containers.Create.tagsErrorMessage": "",
   "creatives.containers.Create.tagsLabel": "",
-  "creatives.containers.Create.templateAddTag": "",
   "creatives.containers.Create.templateDataNotValid": "",
   "creatives.containers.Create.templateMarkedFinal": "",
-  "creatives.containers.Create.templateMessageError": "",
-  "creatives.containers.Create.templateMessagePlaceholder": "",
-  "creatives.containers.Create.templateMessagePreviewPropsError": "",
-  "creatives.containers.Create.templateMessagePreviewPropsInductiveText": "",
-  "creatives.containers.Create.templateMessagePreviewPropsLabel": "",
-  "creatives.containers.Create.templateNameErrorPlaceholder": "",
   "creatives.containers.Create.templateNamePlaceHolder": "",
-  "creatives.containers.Create.templatePlaceholder": "",
   "creatives.containers.Create.titleCharacterCount": "",
   "creatives.containers.Create.titleEmpty": "",
   "creatives.containers.Create.titleNameRepeated": "",
@@ -1065,7 +1051,6 @@
   "creatives.containersV2.Line.Create.image": "",
   "creatives.containersV2.Line.Create.inputLineTemplateContent": "",
   "creatives.containersV2.Line.Create.line": "",
-  "creatives.containersV2.Line.Create.lineTemplateCreatedSuccessfully": "",
   "creatives.containersV2.Line.Create.maxUploadFileSize": "",
   "creatives.containersV2.Line.Create.maximumCharacterLengthExceeds": "",
   "creatives.containersV2.Line.Create.message": "",
@@ -1080,6 +1065,7 @@
   "creatives.containersV2.Line.Create.somethingWentWrong": "",
   "creatives.containersV2.Line.Create.template": "",
   "creatives.containersV2.Line.Create.templateCantEmpty": "",
+  "creatives.containersV2.Line.Create.templateCreatedSuccessfully": "",
   "creatives.containersV2.Line.Create.templateEditedSuccessfully": "",
   "creatives.containersV2.Line.Create.templateNameNotEmpty": "",
   "creatives.containersV2.Line.Create.templateNotConfigured": "",
@@ -1092,17 +1078,6 @@
   "creatives.containersV2.Line.Create.uploadSuccess": "",
   "creatives.containersV2.Line.Create.uploadingImage": "",
   "creatives.containersV2.Line.Create.valueCantEmpty": "",
-  "creatives.containersV2.Line.CreateWrapper.accountLineListDescription": "",
-  "creatives.containersV2.Line.CreateWrapper.accountLineListTitle": "",
-  "creatives.containersV2.Line.CreateWrapper.accountLineNoListTitle": "",
-  "creatives.containersV2.Line.CreateWrapper.continue": "",
-  "creatives.containersV2.Line.CreateWrapper.hybridTemplateDescription": "",
-  "creatives.containersV2.Line.CreateWrapper.hybridTemplateTitle": "",
-  "creatives.containersV2.Line.CreateWrapper.imageTemplateDescription": "",
-  "creatives.containersV2.Line.CreateWrapper.imageTemplateTitle": "",
-  "creatives.containersV2.Line.CreateWrapper.templateType": "",
-  "creatives.containersV2.Line.CreateWrapper.textTemplateDescription": "",
-  "creatives.containersV2.Line.CreateWrapper.textTemplateTitle": "",
   "creatives.containersV2.Line.Edit.Campaigns": "",
   "creatives.containersV2.Line.Edit.Creatives": "",
   "creatives.containersV2.Line.Edit.Image": "",
@@ -1330,7 +1305,6 @@
   "creatives.containersV2.Templates.imageTemplate": "",
   "creatives.containersV2.Templates.invalidUploadFileError": "",
   "creatives.containersV2.Templates.layoutSelection": "",
-  "creatives.containersV2.Templates.lineAccount": "",
   "creatives.containersV2.Templates.lineHeader": "",
   "creatives.containersV2.Templates.mapTemplate": "",
   "creatives.containersV2.Templates.mapTemplates": "",
@@ -1343,7 +1317,6 @@
   "creatives.containersV2.Templates.newTemplate": "",
   "creatives.containersV2.Templates.noAccountMessage": "",
   "creatives.containersV2.Templates.noAccountsPresent": "",
-  "creatives.containersV2.Templates.noAccountsPresentLine": "",
   "creatives.containersV2.Templates.noAccountsPresentWeChat": "",
   "creatives.containersV2.Templates.noTemplatesFound": "",
   "creatives.containersV2.Templates.noTemplatesMessage": "",
@@ -1390,7 +1363,6 @@
   "creatives.containersV2.TemplatesV2.facebook": "",
   "creatives.containersV2.TemplatesV2.gallery": "",
   "creatives.containersV2.TemplatesV2.header": "",
-  "creatives.containersV2.TemplatesV2.line": "",
   "creatives.containersV2.TemplatesV2.pushNotification": "",
   "creatives.containersV2.TemplatesV2.select": "",
   "creatives.containersV2.TemplatesV2.sms": "",

package/v2Components/FormBuilder/index.js

@@ -11,10 +11,9 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import _ from 'lodash';
 import { Tabs, Table, Modal} from 'antd';
-import { CapDrawer, CapButton, CapInput, CapPopover, CapImage, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon} from '@capillarytech/cap-ui-library';
+import { CapButton, CapInput, CapPopover, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon} from '@capillarytech/cap-ui-library';
 import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
 import LabelHOC from '@capillarytech/cap-ui-library/assets/HOCs/ComponentWithLabelHOC';
-import { CAP_SPACE_12, CAP_SPACE_08, FONT_COLOR_05, FONT_COLOR_04 } from '@capillarytech/cap-ui-library/styled/variables';
 import TemplatePreview from '../TemplatePreview';
 import TagList from '../../v2Containers/TagList';
 import SlideBox from '../SlideBox';
@@ -25,7 +24,7 @@ import CustomPopOver from '../CustomPopOver';
 import messages from './messages';
 import './_formBuilder.scss';
 import {updateCharCount, checkUnicode} from "../../utils/smsCharCountV2";
-import { SMS, LINE } from '../../v2Containers/CreativesContainer/constants';
+import {SMS} from '../../v2Containers/CreativesContainer/constants';
 const TabPane = Tabs.TabPane;
 const {Column} = Table;
 const {TextArea} = CapInput;
@@ -56,7 +55,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       currentEventData: {},
       popoverVisible: false,
       customPopoverVisible: false,
-      isDrawerVisible: false,
     };
     this.renderForm = this.renderForm.bind(this);
     this.updateFormData = this.updateFormData.bind(this);
@@ -209,7 +207,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
         if (nextProps.isNewVersionFlow && !this.state.formData[this.state.currentTab - 1][this.state.formData[this.state.currentTab - 1].activeTab].tabKey) {
           this.resetTabKeys(nextProps.formData, nextProps.tabCount, false, true);
         }
-        if (type === 'embedded' || ( this.props.schema.channel && this.props.schema.channel.toUpperCase() === 'EMAIL')) {
+        if (type === 'embedded' || this.props.schema.channel.toUpperCase() === 'EMAIL') {
           this.validateForm();
         }
         if ((this.props.schema && this.props.schema.channel && this.props.schema.channel.toUpperCase() === 'MOBILEPUSH')) {
@@ -255,11 +253,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     if (nextProps.modal && (!_.isEqual(nextProps.modal, this.props.modal) || _.isEmpty(this.state.modal))) {
       this.setState({modal: nextProps.modal});
     }
-    if (nextProps.isDrawerRequired !== this.props.isDrawerRequired) {
-      this.setState({
-        isDrawerVisible: nextProps.isDrawerRequired,
-      });
-    }
   }
 
   onEdit() {
@@ -491,74 +484,38 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     }
 
     //validation for LINE
-    if (channel === LINE) {
+    if (this.props.schema.channel === 'LINE') {
       
-      if (this.state.formData['message-editor'] !== undefined ) {
-        const content = this.state.formData['0']['message-editor'] || '';
+      if (this.state.formData['0']['message-editor'] !== undefined ) {
+        const content = this.state.formData['0']['message-editor'];
         
-        const tagValidationResponse = this.validateTags((content), tags, injectedTags);
+        const tagValidationResponse = this.validateTags(content, tags, injectedTags);
         
         if (tagValidationResponse.valid) {
-          errorData = {
-            ...errorData,
-            0: {
-              ...errorData[0],
-              'message-editor': false,
-            }
-          };
+          errorData['0']['message-editor'] = false;
         } else {
-          errorData = {
-            ...errorData,
-            0: {
-              ...errorData[0],
-              'message-editor': true,
-            }
-          };
+          
+          errorData['0']['message-editor'] = true;
           isValid = false;
         }
         if (content.trim() === '') {
-          errorData = {
-            ...errorData,
-            0: {
-              ...errorData[0],
-              'message-editor': true,
-            }
-          };
+          
+          errorData['0']['message-editor'] = true;
           isValid = false;
         }
       }
 
-      if (this.state.formData['image-upload-line'] !== undefined) {
-        const {
-          formData: {
-            0: {
-              image,
-              imagePreview,
-            }
-          }
-        } = this.state;
-        const imgContentLength = image ? image.length : 0;
-        const imgContentLengthPreview = imagePreview ? imagePreview.length : 0;
+      if ( (this.state.formData['0'].image !== undefined) && (this.state.formData['0'].imagePreview !== undefined)){
+        const imgContentLength = this.state.formData['0'].image.length;
+        const imgContentLengthPreview = this.state.formData['0'].imagePreview.length;
         if ( (imgContentLength < 1) && (imgContentLengthPreview < 1) ) {
           
-          errorData = {
-            ...errorData,
-            0: {
-              ...errorData[0],
-              image: true,
-              imagePreview: true,
-            }
-          };
+          errorData['0'].image = true;
+          errorData['0'].imagePreview = true;
           isValid = false;
         }else{
-          errorData = {
-            ...errorData,
-            0: {
-              ...errorData[0],
-              image: false,
-              imagePreview: false,
-            }
-          };
+          errorData['0'].image = false;
+          errorData['0'].imagePreview = false;
         }
       }
       if(type !== 'embedded' && (!this.state.formData['template-name'] || this.state.formData['template-name'] === '')) {
@@ -1192,7 +1149,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
         //   this.formElements.push(col.id);
         // }
         if (!col.onlyDisplay && !ifError) {
-          if (col.id && col.id.indexOf('tagList-') === -1) {
+          if (col.id.indexOf('tagList-') === -1) {
             this.formElements.push(col.id);
           }
 
@@ -1392,7 +1349,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
           delete tempFormData[key];
         } else if (typeof element === "object") {
           _.forEach(element, (innerElement, innerKey) => {
-            if (innerKey !== "tabKey" && innerKey !== "base" && innerKey !== 'name' && innerKey !== 'imagePreview' && innerKey !== 'image' && this.formElements.indexOf(innerKey) === -1) {
+            if (innerKey !== "tabKey" && innerKey !== "base" && innerKey !== 'name' && innerKey !== 'imagePreview' && this.formElements.indexOf(innerKey) === -1) {
               delete tempFormData[key][innerKey];
             }
           });
@@ -1964,7 +1921,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
       return;
     } else if (event === 'markFinalVersion' || event === 'duplicateVersion' || event === 'deleteVersion' || event === 'renameVersion') {
       this.setState({ popoverVisible: false });
-      if ((event !== 'deleteVersion' && !this.props.isNewVersionFlow) || ((event === 'deleteVersion') && this.props.schema.channel && this.props.schema.channel.toUpperCase() === 'EMAIL')) {
+      if ((event !== 'deleteVersion' && !this.props.isNewVersionFlow) || ((event === 'deleteVersion') && this.props.schema.channel.toUpperCase() === 'EMAIL')) {
         val.injectedEvents[event].call(this.props.parent, data, this.state.currentTab);
       } else {
         this.setState({currentEvent: val.injectedEvents[event], currentEventData: data});
@@ -2143,8 +2100,8 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     img.src = _URL.createObjectURL(file);
     img.onload = () => {
       const fileParams = {
-        width: this.width || img.width,
-        height: this.height || img.height,
+        width: this.width,
+        height: this.height,
         error: file.size / (1e+6) > 3,
       };
       this.callChildEvent({file, type: 'image', fileParams}, val, val.submitAction);
@@ -2197,7 +2154,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
         //
         const imgSrc = template && template.versions && template.versions.base ? template.versions.base.preview_http_url : '';
         // const ifPreviewGenerated = template && template.versions && template.versions.base ? template.versions.base.isPreviewGenerated : 0;
-        const content = <CapImage src={imgSrc || ''} alt="" />;
+        const content = <img src={imgSrc || ''} alt="" />;
 
         temp.content = (
           <div
@@ -2382,10 +2339,8 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 content={content}
                 charCounterEnabled={val.charCounterEnabled}
                 unicodeEnabled={unicodeEnabled}
-                showTestAndPreviewIcon
-                onPreviewContentClicked={this.props.onPreviewContentClicked}
-                onTestContentClicked={this.props.onTestContentClicked}
-              />
+              >
+              </TemplatePreview>
             </CapColumn>
           );
           break;
@@ -2577,81 +2532,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     }
   }
 
-  onGalleryClick = (event) => {
-    event.stopPropagation();
-    this.props.setDrawerVisibility(true);
-  }
-
-  onReUpload = () => {
-    const { formData } = this.state;
-    this.props.onChange({
-      ...formData,
-      0: {
-        ...formData[0],
-        image: undefined,
-        imagePreview: undefined,
-      },
-      base: {
-        ...formData.base,
-        image: undefined,
-        imagePreview: undefined,
-      },
-      reUpload: true,
-    });
-  }
-
-  getUploadVariants = (isImage, val) => {
-    if (this.props.schema && this.props.schema.channel === 'LINE') {
-      if (!isImage) {
-        return (
-          <>
-            <CapUploader.CapDragger
-              customRequest={(data) => this.capUploaderCustomRequest(data, val)}
-              {...val.componentProps}
-              className="form-builder-dragger"
-            >
-              <CapHeading className="dragger-title" type="h7">
-                <FormattedMessage {...messages.dragAndDrop} />
-              </CapHeading>
-              <CapHeading className="dragger-or" type="label6">
-                <FormattedMessage {...messages.or} />
-              </CapHeading>
-              <CapButton className="dragger-button" type="secondary" style={{marginRight: CAP_SPACE_08}}>
-                <FormattedMessage {...messages.uploadComputer} />
-              </CapButton>
-              <CapButton
-                className="dragger-button"
-                type="secondary"
-                style={{marginLeft: CAP_SPACE_08}}
-                onClick={this.onGalleryClick}
-              >
-                <FormattedMessage {...messages.uploadGallery} />
-              </CapButton>
-            </CapUploader.CapDragger>
-            <CapHeading type="h6" style={{marginTop: CAP_SPACE_12 }}>
-              <FormattedMessage {...messages.imageDimenstionDescription} />
-            </CapHeading>
-          </>
-        );
-      }
-      return (
-        <CapButton
-          className="dragger-button"
-          type="flat"
-          style={{top: 0, position: 'absolute', right: 0, color: FONT_COLOR_05 }}
-          onClick={this.onReUpload}
-        >
-          <FormattedMessage {...messages.imageReUpload} />
-        </CapButton>
-      );
-    }
-    return (
-      <CapButton disabled={val.disabled ? val.disabled : false} type="flat" prefix={<CapIcon size="s" type="add-photo" />} onClick={(e) => this.openFileDialog(e, val.id)} style={{float: 'right', color: `${val.disabled ? FONT_COLOR_04 : FONT_COLOR_05}`}}>
-        {val.label}
-      </CapButton>
-    );
-  }
-
   renderMultiColSection(section, childIndex) {
     const fields = [];
     let contentSections = [];
@@ -2698,6 +2578,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
           );
           return true;
         }
+
         switch (type) {
           case "input":
             ifError = this.state.checkValidation && (isVersionEnable ? this.state.errorData[`${this.state.currentTab - 1}`][val.id] : this.state.errorData[val.id]);
@@ -2825,7 +2706,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 <div>
                   <div className={`image-container ${ifError ? 'error' : ''}`}>
                     {self.state && !!self.state.formData[`${self.state.currentTab - 1}`].image ?
-                      <CapImage src={self.state.formData[`${self.state.currentTab - 1}`].image} alt={val.alt} style={val.style}/>
+                      <img src={self.state.formData[`${self.state.currentTab - 1}`].image} alt={val.alt} style={val.style}/>
                       :
                       <div style={{width: "100%", textAlign: "center"}}><span className="image-placeholder">{val.placeholder}</span></div>
                     }
@@ -2836,22 +2717,13 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             );
             break;
           case 'upload':
-            const {
-              formData: {
-                [`${self.state.currentTab - 1}`]: {
-                  image,
-                } = {},
-              } = {},
-            } = self.state;
-            const isImage = !!image;
             ifError = (this.state.checkValidation || this.props.startValidation) && (isVersionEnable ? this.state.errorData[`${this.state.currentTab - 1}`][val.id] : this.state.errorData[val.id]);
             const ImageComponent = (props) => (
               <div key={`${val.id}-${this.state.currentTab}`}>
                 <div className={`image-container ${props.ifError ? 'error' : ''}`}>
-
-                  {isImage ?
-                    <CapImage src={self.state.formData[`${self.state.currentTab - 1}`].image} alt={props.alt} style={props.style}/>                    
-                     :
+                  {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>
@@ -2864,7 +2736,9 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                 {val.showPreview && <WithLabel key={`${val.id}-with-label`} {...rest} errorMessage={ifError && errorMessage} ifError={ifError}/>}
                 <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={val.supportedExtensions ? val.supportedExtensions : "image/*"} />
-                  {this.getUploadVariants(isImage, val)}
+                  <CapButton disabled={val.disabled ? val.disabled : false} type="flat" prefix={<CapIcon size="s" type="add-photo" />} onClick={(e) => this.openFileDialog(e, val.id)} style={{float: 'right', color: `${val.disabled ? '#b3bac5' : '#2466ea'}`}}>
+                    {val.label}
+                  </CapButton>
                 </form>
               </CapColumn>
               );
@@ -2909,16 +2783,11 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             );
             break;
           case "tag-list":
-            let moduleFilterEnabled = this.props.location && this.props.location.query && this.props.location.query.type !== 'embedded';
-            const channel = _.get(this.props, 'schema.channel', "");
-            if (channel === 'EMAIL') {
-              moduleFilterEnabled = this.props.isFullMode;
-            }
             columns.push(
               <CapColumn key={`input-${val.id}`} offset={val.offset} span={val.width ? val.width : ''} style={val.style ? val.style : {marginBottom: '16px'}}>
                 <TagList
                   key={`input-${val.id}`}
-                  moduleFilterEnabled={moduleFilterEnabled}
+                  moduleFilterEnabled={this.props.location && this.props.location.query && this.props.location.query.type !== 'embedded'}
                   label={val.label ? val.label : ''}
                   onTagSelect={(data) => this.callChildEvent(data, val, 'onTagSelect')}
                   onContextChange={this.props.onContextChange}
@@ -2941,7 +2810,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                     type={val.buttonType}
                     icon={val.icon}
                     disabled={val.disabled ? val.disabled : false}
-                    onClick={(data) => val.id === 'save-button' ? this.saveForm() : this.callChildEvent(data, val, val.submitAction)}>
+                    onClick={(data) => this.callChildEvent(data, val, val.submitAction)}>
                     {val.value}
                   </CapButton>
                 </CapColumn>
@@ -2965,9 +2834,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                   content={content}
                   charCounterEnabled={val.charCounterEnabled}
                   unicodeEnabled={unicodeEnabled}
-                  showTestAndPreviewIcon
-                  onPreviewContentClicked={this.props.onPreviewContentClicked}
-                  onTestContentClicked={this.props.onTestContentClicked}
                 >
                 </TemplatePreview>
               </CapColumn>
@@ -3017,10 +2883,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                     ],
                     appName: val.content.appName,
                   }}
-                  showTestAndPreviewIcon
-                  onPreviewContentClicked={this.props.onPreviewContentClicked}
-                  onTestContentClicked={this.props.onTestContentClicked}
-                  templateDataRaw={this.props.templateData}
                 >
                 </TemplatePreview>
               </CapColumn>
@@ -3434,16 +3296,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
           loadingText={this.props.intl.formatMessage(messages.loadingEDMTemplates)}
           isLoading={this.props.getCmsTemplatesInProgress}
         />
-        {
-          this.props.capDrawerContent && (
-            <CapDrawer
-              content={this.props.capDrawerContent}
-              visible={this.state.isDrawerVisible}
-              width={380}
-              onClose={() => this.props.setDrawerVisibility(false)}
-            />
-          )
-        }
       </CapRow>
     );
   }
@@ -3494,9 +3346,6 @@ FormBuilder.propTypes = {
   handleDelete: PropTypes.func,
   intl: intlShape.isRequired,
   selectedOfferDetails: PropTypes.array,
-  setDrawerVisibility: PropTypes.bool,
-  capDrawerContent: PropTypes.array,
-  isFullMode: PropTypes.bool,
 };
 
 export default injectIntl(FormBuilder);

package/v2Components/FormBuilder/messages.js

@@ -58,20 +58,4 @@ export default defineMessages({
     id: 'creatives.componentsV2.FormBuilder.loadingEDMTemplates',
     defaultMessage: 'Loading EDM Templates',
   },
-  uploadComputer: {
-    id: 'creatives.componentsV2.FormBuilder.uploadComputer',
-    defaultMessage: 'Your computer',
-  },
-  uploadGallery: {
-    id: 'creatives.componentsV2.FormBuilder.uploadGallery',
-    defaultMessage: 'Gallery',
-  },
-  imageDimenstionDescription: {
-    id: 'creatives.componentsV2.FormBuilder.imageDimenstionDescription',
-    defaultMessage: 'Dimensions: 300px x 400px  Size: 30mb',
-  },
-  imageReUpload: {
-    id: 'creatives.componentsV2.FormBuilder.imageReUpload',
-    defaultMessage: 'Re upload',
-  },
 });