@capillarytech/creatives-library 3.1.2 → 3.1.4

package/containers/MobilePush/Edit/index.js

@@ -157,7 +157,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
       injectedTags: {},
       showModal: false,
       eventsMap: map,
-      modalContent: {title: "Alert", body: this.props.intl.formatMessage(messages['template not configured,']), type: 'confirm'},
+      modalContent: {title: this.props.intl.formatMessage(messages.alertMessage), body: this.props.intl.formatMessage(messages['template not configured,']), type: 'confirm'},
     };
   }
   componentWillMount() {
@@ -368,10 +368,10 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                               },
                               {
                                 id: inputId,
-                                placeholder: "Select DeepLink",
+                                placeholder: this.props.intl.formatMessage(messages.selectDeeplink),
                                 type: "select",  //Resembles component to be used
                                 options: deepLinkOptions,
-                                errorMessage: "Select a deeplink",
+                                errorMessage: this.props.intl.formatMessage(messages.selectADeeplink),
                                 metaType: "text",
                                 datatype: "string",
                                 required: true,
@@ -421,7 +421,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                                 type: "input",  //Resembles component to be used
                                 metaType: "text",
                                 datatype: "string",
-                                errorMessage: "External Link cannot be empty.",
+                                errorMessage: this.props.intl.formatMessage(messages.externalLinkCantEmpty),
                                 required: true,
                                 fluid: true,
                                 width: 19,
@@ -1001,16 +1001,16 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   setModalContent = (type) => {
     if (type === 'ios') {
       const modalContent = {
-        title: "Alert",
-        body: "Android template is not configured. Save without Android template",
+        title: this.props.intl.formatMessage(messages.alertMessage),
+        body: this.props.intl.formatMessage(messages.androidTemplateNotConfigured),
         type: 'confirm',
         id: 'ios',
       };
       this.setState({modalContent, showModal: true});
     } else if (type === 'android') {
       const modalContent = {
-        title: "Alert",
-        body: "IOS template is not configured, Save without IOS template",
+        title: this.props.intl.formatMessage(messages.alertMessage),
+        body: this.props.intl.formatMessage(messages.iosTemplateNotConfigured),
         type: 'confirm',
         id: 'android',
       };
@@ -1064,8 +1064,8 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
       this.props.globalActions.addMessageToQueue(message);
     } else {
       const name = data.file.name.split('.');
-      const blob = data.file.slice(0, -1, 'image');
-      const newFile = new File([blob], `${name[0]}${Date.now()}.${name[1]}`, {type: 'image'});
+      // const blob = data.file.slice(0, -1, 'image');
+      const newFile = new File([data.file], `${name[0]}${Date.now()}.${name[1]}`, {type: 'image'});
       this.props.actions.uploadAsset(newFile, data.type, data.fileParams);
     }
   };
@@ -1077,7 +1077,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
       formData[0]['message-editor'] = formData[1]['message-editor2'];
       this.setState({formData});
     } else {
-      this.openNotificationWithIcon('warning', "Cannot copy empty field values.");
+      this.openNotificationWithIcon('warning', this.props.intl.formatMessage(messages.cantCopyEmptyField));
     }
   };
   copyAndroidContent = () => {
@@ -1087,7 +1087,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
       formData[1]['message-editor2'] = formData[0]['message-editor'];
       this.setState({formData});
     } else {
-      this.openNotificationWithIcon('warning', "Cannot copy empty field values.");
+      this.openNotificationWithIcon('warning', this.props.intl.formatMessage(messages.cantCopyEmptyField));
     }
   };
 
@@ -1117,7 +1117,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                           {
                             id: `${inputId}-action-label`,
                             metaType: "label",
-                            value: "Secondary CTA",
+                            value: this.props.intl.formatMessage(messages.secondaryCTA),
                             primitive: true,
                             dynamicTab: false,
                             type: "div",
@@ -1270,10 +1270,10 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                             },
                             {
                               id: `cta-deeplink-${inputId}-select2`,
-                              placeholder: "Select DeepLink",
+                              placeholder: this.props.intl.formatMessage(messages.selectDeeplink),
                               type: "select",  //Resembles component to be used
                               options: deepLinkOptions,
-                              errorMessage: "Select a deeplink",
+                              errorMessage: this.props.intl.formatMessage(messages.selectADeeplink),
                               metaType: "text",
                               datatype: "string",
                               required: true,
@@ -1357,7 +1357,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                             {
                               id: `${this.state.currentTab === 1 ? "add-pri-cta" : "add-pri-cta-ios"}`,
                               metaType: "label",
-                              value: "Add Primary CTA",
+                              value: this.props.intl.formatMessage(messages.addPrimaryCTA),
                               primitive: true,
                               dynamicTab: false,
                               type: "div",
@@ -1449,7 +1449,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                               {
                                 id: "add-sec-cta-ios",
                                 metaType: "label",
-                                value: "Add Secondary CTA",
+                                value: this.props.intl.formatMessage(messages.addSecondaryCTA),
                                 primitive: true,
                                 dynamicTab: false,
                                 type: "div",
@@ -1497,7 +1497,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
     if (id === "secondary-cta-0-delete") {
       const secCta2 = document.getElementById("secondary-cta-1-delete");
       if (secCta2) {
-        const modalContent = {title: "Alert", body: "Please delete second Secondary cta First", type: 'info', show: true, onCancel: this.onModalCancel};
+        const modalContent = {title: this.props.intl.formatMessage(messages.alertMessage), body: this.props.intl.formatMessage(messages.deleteSecondCTAFirst), type: 'info', show: true, onCancel: this.onModalCancel};
         this.setState({modalContent, showModal: true});
         return;
       }
@@ -1551,7 +1551,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                               {
                                 id: "add-sec-cta-ios",
                                 metaType: "label",
-                                value: "Add Secondary CTA",
+                                value: this.props.intl.formatMessage(messages.addSecondaryCTA),
                                 primitive: true,
                                 dynamicTab: false,
                                 type: "div",
@@ -1584,7 +1584,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                                 {
                                   id: "add-sec-cta",
                                   metaType: "label",
-                                  value: "Add Secondary CTA",
+                                  value: this.props.intl.formatMessage(messages.addSecondaryCTA),
                                   primitive: true,
                                   dynamicTab: false,
                                   type: "div",
@@ -1623,7 +1623,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                                 {
                                   id: "add-sec-cta",
                                   metaType: "label",
-                                  value: "Add Another CTA",
+                                  value: this.props.intl.formatMessage(messages.addAnotherCTA),
                                   primitive: true,
                                   dynamicTab: false,
                                   type: "div",
@@ -1712,8 +1712,8 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
   moveToTemplates = () => {
     console.log('in move to Templates');
     const modalContent = {
-      title: "Alert",
-      body: "Do you really want to go back? All your temporary changes will be lost!",
+      title: this.props.intl.formatMessage(messages.alertMessage),
+      body: this.props.intl.formatMessage(messages.goBackConfirmation),
       type: 'confirm',
       id: 'template-back-confirm-modal',
       show: true,
@@ -1916,13 +1916,13 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                               datatype: "string",
                               required: true,
                               width: 14,
-                              placeholder: `Please input ${key.replace('_', " ")}.`,
+                              placeholder: `${this.props.intl.formatMessage(messages.pleaseInput)} ${key.replace('_', " ")}.`,
                               fluid: true,
                               styling: "semantic",
                               order: 1,
                               disabled: this.props.location.query.type === 'embedded' && this.props.location.query.module !== "dvs",
                               customComponent: false,
-                              errorMessage: "value cannot be empty.",
+                              errorMessage: this.props.intl.formatMessage(messages.valueCantEmpty),
                             },
                           ],
                         };
@@ -1988,7 +1988,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                           {
                             id: "cta-label",
                             metaType: "label",
-                            value: "Primary CTA",
+                            value: this.props.intl.formatMessage(messages.primaryCTA),
                             primitive: true,
                             dynamicTab: false,
                             type: "div",
@@ -2017,7 +2017,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                             value: "Deeplink",
                             required: true,
                             width: 18,
-                            errorMessage: "Please select link type",
+                            errorMessage: this.props.intl.formatMessage(messages.selectLinkType),
                             fluid: true,
                             styling: "semantic",
                             order: 1,
@@ -2054,10 +2054,10 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                           },
                           {
                             id: `cta-deeplink${id === 'add-pri-cta' ? '' : 2}-select`,
-                            placeholder: "Select DeepLink",
+                            placeholder: this.props.intl.formatMessage(messages.selectDeeplink),
                             type: "select",  //Resembles component to be used
                             options: deepLinkOptions,
-                            errorMessage: "Select a deeplink",
+                            errorMessage: this.props.intl.formatMessage(messages.selectADeeplink),
                             metaType: "text",
                             datatype: "string",
                             required: true,
@@ -2123,7 +2123,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                             {
                               id: `${inputId}-space`,
                               metaType: "label",
-                              value: "Secondary CTA",
+                              value: this.props.intl.formatMessage(messages.secondaryCTA),
                               primitive: true,
                               dynamicTab: false,
                               type: "div",
@@ -2153,12 +2153,12 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                               required: true,
                               width: 18,
                               offset: 4,
-                              placeholder: "Enter CTA Label here",
+                              placeholder: this.props.intl.formatMessage(messages.enterCTALabel),
                               fluid: true,
                               styling: "semantic",
                               order: 1,
                               customComponent: false,
-                              errorMessage: "CTA label cannot be empty.",
+                              errorMessage: this.props.intl.formatMessage(messages.ctaLabelCantEmpty),
                             },
                             {
                               id: `${inputId}-delete`,
@@ -2238,10 +2238,10 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                             },
                             {
                               id: `cta-deeplink-${inputId}-select`,
-                              placeholder: "Select DeepLink",
+                              placeholder: this.props.intl.formatMessage(messages.selectDeeplink),
                               type: "select",  //Resembles component to be used
                               options: deepLinkOptions,
-                              errorMessage: "Select a deeplink",
+                              errorMessage: this.props.intl.formatMessage(messages.selectADeeplink),
                               metaType: "text",
                               datatype: "string",
                               required: true,
@@ -2266,7 +2266,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                         });
 
                         const colField = col;
-                        colField.value = "Add Another CTA";
+                        colField.value = this.props.intl.formatMessage(messages.addAnotherCTA);
                         colField.fieldsCount += 1;
                         if (col.fieldsCount === col.fieldsLimit) {
                           child.inputFields.pop();
@@ -2312,7 +2312,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                           {
                             id: `${inputId}-label`,
                             metaType: "label",
-                            value: "Secondary CTA",
+                            value: this.props.intl.formatMessage(messages.secondaryCTA),
                             primitive: true,
                             dynamicTab: false,
                             type: "div",
@@ -2341,7 +2341,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                             pagination: false,
                             columns: [
                               {
-                                title: "Name and Description",
+                                title: this.props.intl.formatMessage(messages.nameAndDescription),
                                 dataIndex: "name",
                                 key: "name",
                                 width: 200,
@@ -2352,7 +2352,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                                   </div>),
                               },
                               {
-                                title: "Button 1",
+                                title: this.props.intl.formatMessage(messages.button1),
                                 dataIndex: "description",
                                 key: "button1",
                                 width: 100,
@@ -2362,7 +2362,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                                   </div>),
                               },
                               {
-                                title: "Button 2",
+                                title: this.props.intl.formatMessage(messages.button2),
                                 dataIndex: "description",
                                 key: "button2",
                                 width: 100,
@@ -2385,7 +2385,7 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
                       });
 
                       const colField = col;
-                      colField.value = "Add Another CTA";
+                      colField.value = this.props.intl.formatMessage(messages.addAnotherCTA);
                       colField.fieldsCount += 1;
                       if (col.fieldsCount === col.fieldsLimit) {
                         child.inputFields.pop();
@@ -2462,8 +2462,8 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
 
   render() {
     const schema = this.state.schema;
-    let tipText = this.props.Edit && ("getTemplateDetailsInProgress" in this.props.Edit && this.props.Edit.getTemplateDetailsInProgress) ? 'Getting template details...' : '';
-    tipText = this.props.Edit && ("editTemplateInProgress" in this.props.Edit && this.props.Edit.editTemplateInProgress) ? 'Saving Template...' : '';
+    let tipText = this.props.Edit && ("getTemplateDetailsInProgress" in this.props.Edit && this.props.Edit.getTemplateDetailsInProgress) ? this.props.intl.formatMessage(messages.gettingTemplate) : '';
+    tipText = this.props.Edit && ("editTemplateInProgress" in this.props.Edit && this.props.Edit.editTemplateInProgress) ? this.props.intl.formatMessage(messages.savingTemplate) : '';
     const loadingContentEdit = this.state.loadingContentEdit || (this.props.location.query.module === 'dvs' && _.isEmpty(this.state.schema));
     const spinning = loadingContentEdit || this.props.Edit.fetchingDefaultTemplates || this.props.Edit.assetUploading || this.state.loading || (this.props.Edit && (("getTemplateDetailsInProgress" in this.props.Edit && this.props.Edit.getTemplateDetailsInProgress) || ("editTemplateInProgress" in this.props.Edit && this.props.Edit.editTemplateInProgress)));
     let tags = this.props.metaEntities && this.props.metaEntities.tags ? this.props.metaEntities.tags.standard : [];
@@ -2477,9 +2477,9 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
             <Col offset={1}>
               { this.props.location.query.type !== "embedded" &&
                 <Breadcrumb>
-                  <BreadcrumbItem>Campaigns</BreadcrumbItem>
-                  <BreadcrumbItem>Creatives</BreadcrumbItem>
-                  <BreadcrumbItem>Mobile Push</BreadcrumbItem>
+                  <BreadcrumbItem>{this.props.intl.formatMessage(messages.Campaigns)}</BreadcrumbItem>
+                  <BreadcrumbItem>{this.props.intl.formatMessage(messages.Creatives)}</BreadcrumbItem>
+                  <BreadcrumbItem>{this.props.intl.formatMessage(messages.mobilePush)}</BreadcrumbItem>
                 </Breadcrumb>
               }
             </Col>