@capillarytech/creatives-library 7.18.0-beta.0 → 8.0.0

package/v2Containers/Email/index.js

@@ -25,6 +25,7 @@ import messages from './messages';
 import './_email.scss';
 import {getMessageObject} from '../../utils/messageUtils';
 import EmailPreview from '../../v2Components/EmailPreview';
+import { getDecodedFileName } from '../../utils/common';
 
 import Pagination from '../../v2Components/Pagination';
 import * as creativesContainerActions from '../CreativesContainer/actions';
@@ -36,6 +37,7 @@ import { FONT_COLOR_05 } from '@capillarytech/cap-ui-library/styled/variables';
 import { gtmPush } from '../../utils/gtmTrackers';
 const {CapCustomCardList} = CapCustomCard;
 import {transformEmailTemplates, storeS3FileSizeDetails, CREATIVES_S3_ASSET_FILESIZES} from '../../utils/cdnTransformation';
+import { CUSTOMER_BARCODE_TAG } from '../../containers/App/constants';
 
 export class Email extends React.Component { // eslint-disable-line react/prefer-stateless-function
   constructor(props) {
@@ -218,6 +220,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     }
   }
 
+
   checkBeeEditorAllowedForLibrary = () => {
     const { isFullMode = false, editor } = this.props || {};
     if ((editor === "BEE" && !isFullMode) || isFullMode) {
@@ -544,18 +547,27 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     window.removeEventListener("message", this.handleFrameTasks);
     this.props.actions.clearStoreValues();
     this.props.actions.clearCRUDResponse();
-    delete window?.[CREATIVES_S3_ASSET_FILESIZES]
+    delete window?.[CREATIVES_S3_ASSET_FILESIZES];
   }
 
   onFormDataChange = (updatedFormData, tabCount, currentTab) => {
     // this.transformFormData(formData);
     const formData = {...updatedFormData};
-    if (this.props.defaultData && _.isEmpty(formData['template-name']) && this.props.isFullMode) {
-      formData['template-name'] = _.get(this.props, "defaultData['template-name']");
+    const {defaultData = {}, isFullMode, showTemplateName} = this.props;
+    const templateName = formData['template-name'];
+    const defaultTemplateName = _.get(defaultData, 'template-name', "");
+
+
+    if (defaultData && _.isEmpty(templateName) && isFullMode && !updatedFormData?.isTemplateNameEdited) {
+      formData['template-name'] = defaultTemplateName;
+    } else {
+      formData['template-name'] = templateName;
     }
+
+
     this.setState({formData, tabCount, isSchemaChanged: false}, () => {
-      if (this.props.isFullMode) {
-        this.props.showTemplateName({formData, onFormDataChange: this.onFormDataChange});
+      if (this.props.isFullMode && showTemplateName) {
+        showTemplateName({formData, onFormDataChange: this.onFormDataChange});
       }
     });
     if (currentTab) {
@@ -643,6 +655,8 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     } else if (data === "unsubscribe" && this.state.editorInstanse) {
       const anchor = `<a href='{{${data}}}'>${data}</a>`;
       this.state.editorInstanse.insertHtml(`${anchor}`);
+    } else if (data === CUSTOMER_BARCODE_TAG && this.state.editorInstanse) {
+      this.state.editorInstanse.insertHtml(`<img src="https://crm-nightly-new-fileservice.s3.amazonaws.com/intouch_creative_assets/8ebc8301-e262-45a6-bdab-ff0de91a.png?code={{${data}}}" />`);
     } else if (this.state.editorInstanse) {
       this.state.editorInstanse.insertHtml(`{{${data}}}`);
     }
@@ -2066,7 +2080,8 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       formData[0].selectedLanguages = [];
       let tabKey;
       if ((this.props.location.query.isLanguageSupport === undefined || this.props.location.query.isLanguageSupport === 'false')) {
-        formData['template-subject'] = data.base.subject ? data.base.subject : '';
+        // If formData['template-subject'] is empty, assign an empty string; otherwise, retain its current value or use data.base.subject.
+        formData['template-subject'] = formData?.['template-subject'] === '' ? '' : (data?.base?.subject || '');
         const baseLanguage = this.props.currentOrgDetails.basic_details.base_language;
         let languageIndex = _.findIndex(this.supportedLanguages, {iso_code: baseLanguage});
 
@@ -2131,16 +2146,17 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         this.addLanguage(false, formData, false, additionalLanguages);
       }
       formData.base = _.cloneDeep(formData[0]);
-
-      this.setState({formData, loading: false, injectedTags: data.tags, tabKey, isDragDrop: (data.base.is_drag_drop !== 0 )}, () => {
-        // this.setState({tabKey: ''});
-        const isBEEEnable = this.checkBeeEditorAllowedForLibrary();
-        _.forEach(formData[0].selectedLanguages, (language) => {
-          if (formData[0][language].is_drag_drop && isBEEEnable) {
-            this.props.actions.getCmsSetting(BEE_PLUGIN, formData[0][language].drag_drop_id, 'open', language, isEdmSupport, isBEEEnable);
-          }
+      if (formData?.['template-subject'] !== '') {
+        this.setState({formData, loading: false, injectedTags: data.tags, tabKey, isDragDrop: (data.base.is_drag_drop !== 0 )}, () => {
+          // this.setState({tabKey: ''});
+          const isBEEEnable = this.checkBeeEditorAllowedForLibrary();
+          _.forEach(formData[0].selectedLanguages, (language) => {
+            if (formData[0][language].is_drag_drop && isBEEEnable) {
+              this.props.actions.getCmsSetting(BEE_PLUGIN, formData[0][language].drag_drop_id, 'open', language, isEdmSupport, isBEEEnable);
+            }
+          });
         });
-      });
+      }
     } else {
       this.setState({injectedTags: data.tags});
     }
@@ -2359,7 +2375,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       history: [],
     };
     if (this.state.isEdit) {
-      obj._id = this.props.Email.templateDetails._id;
+      obj._id = this.props.Email.templateDetails?._id || '';
     }
     obj.type = 'EMAIL';
     const baseLanguage = this.props.currentOrgDetails.basic_details.base_language;
@@ -2403,7 +2419,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
 
     // if (saveCount === 0) {
 
-    this.props.actions.transformEmailTemplate(obj, (newEmail)=>{
+    this.props.actions.transformEmailTemplate(obj, (newEmail) => {
       this.props.actions.createTemplate(newEmail, this.onUpdateTemplateComplete);
     });
     // } else {
@@ -2443,6 +2459,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
   getTemplateDataForGrid = ({templates, handlers, isLoading, loadingTip}) => {
     const currentChannel = 'gallery';
     const cardDataList = templates.length ? _.map(templates, (template) => {
+      template.name = getDecodedFileName(template?.name);
       const templateData =
         {
           key: `${currentChannel}-card-${template.name}`,
@@ -2551,7 +2568,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
         <CapInput
           className="search-text"
           style={{width: '210px'}}
-          placeholder="Search"
+          placeholder={`${this.props.intl.formatMessage(messages.searchText)}`}
           prefix={<i className="material-icons" style={{color: '#707070', fontSize: '16px'}}>search</i>}
           value={this.state.searchText}
           onChange={(e) => this.searchAsset(e.target.value)}
@@ -2646,7 +2663,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
     const previewHeader = (<h3>{this.props.intl.formatMessage(messages.h3emailPreview)}</h3>);
     const imagePreviewHeader = (<h3>{this.props.intl.formatMessage(messages.h3imageSelection)}</h3>);
     const imagePreviewContent = this.getImagePreviewContent();
-    const { selectedOfferDetails, getDefaultTags, Email: { CmsSettings = {} } = {} } = this.props;
+    const { selectedOfferDetails, getDefaultTags, Email: { CmsSettings = {} } = {}, moduleType = '' } = this.props;
     if (!this.props.currentOrgDetails || !this.props.currentOrgDetails.basic_details) {
       return (<div>Loading...</div>);
     }
@@ -2714,6 +2731,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
                   uuid={CmsSettings.uuid}
                   type={CmsSettings.type}
                   isEmailLoading={isLoading}
+                  moduleType={moduleType}
               /> : ''}
             </Col>
           </Row>
@@ -2769,6 +2787,7 @@ Email.propTypes = {
   selectedOfferDetails: PropTypes.array,
   onPreviewContentClicked: PropTypes.func,
   onTestContentClicked: PropTypes.func,
+  moduleType: PropTypes.string,
 };
 
 const mapStateToProps = (state, props) => createStructuredSelector({

package/v2Containers/Email/initialSchema.js

@@ -351,7 +351,7 @@ export const response = {
                             fontFamily: "open-sans, sans-serif",
                             fontStyle: "normal",
                             fontWeight: "600",
-                            justifyContent: "flex-end",
+                            marginLeft: "0.313rem",
                           },
                           customComponent: true,
                           width: 2,

package/v2Containers/Email/sagas.js

@@ -1,5 +1,4 @@
-import { take, cancel, call, put, takeLatest, takeEvery } from 'redux-saga/effects';
-import { LOCATION_CHANGE } from 'react-router-redux';
+import { take, cancel, call, put, takeLatest, takeEvery, all } from 'redux-saga/effects';
 import * as Api from '../../services/api';
 import * as types from './constants';
 import { transformEmailTemplates, storeS3FileSizeDetails } from '../../utils/cdnTransformation';
@@ -93,52 +92,36 @@ export function* uploadAsset(file, assetType, fileParams) {
 }
 
 function* watchCreateTemplate() {
-  const watcher = yield takeLatest(types.CREATE_TEMPLATE_REQUEST, createTemplate);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(types.CREATE_TEMPLATE_REQUEST, createTemplate);
 }
 
 export function* watchTransformEmailTemplate() {
-  const watcher = yield takeLatest(types.TRANSFORM_EMAIL_TEMPLATE_REQUEST, transformEmailTemplate);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(types.TRANSFORM_EMAIL_TEMPLATE_REQUEST, transformEmailTemplate);
 }
 
 
 function* watchGetTemplateDetails() {
-  const watcher = yield takeLatest(types.GET_TEMPLATE_DETAILS_REQUEST, getTemplateDetails);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(types.GET_TEMPLATE_DETAILS_REQUEST, getTemplateDetails);
 }
 
 function* watchGetAllAssets() {
-  const watcher = yield takeLatest(types.GET_ALL_ASSETS_REQUEST, getAllAssets);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(types.GET_ALL_ASSETS_REQUEST, getAllAssets);
 }
 
 function* watchGetCmsSetting() {
-  const watcher = yield takeEvery(types.GET_CMS_EDITOR_DETAILS_REQUEST, getCmsSetting);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeEvery(types.GET_CMS_EDITOR_DETAILS_REQUEST, getCmsSetting);
 }
 
 function* watchGetCmsData() {
-  const watcher = yield takeEvery(types.GET_CMS_EDITOR_DATA_REQUEST, getCmsData);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeEvery(types.GET_CMS_EDITOR_DATA_REQUEST, getCmsData);
 }
 
 function* watchUploadAsset() {
-  const watcher = yield takeLatest(types.UPLOAD_ASSET_REQUEST, uploadAsset);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(types.UPLOAD_ASSET_REQUEST, uploadAsset);
 }
 
 function* watchDuplicateTemplate() {
-  const watcher = yield takeLatest(types.DUPLICATE_TEMPLATE_REQUEST, duplicateTemplate);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(types.DUPLICATE_TEMPLATE_REQUEST, duplicateTemplate);
 }
 
 // All sagas to be loaded
@@ -152,3 +135,16 @@ export default [
   watchUploadAsset,
   watchDuplicateTemplate,
 ];
+
+export function* v2EmailSagas() {
+  yield all([
+    watchCreateTemplate(),
+    watchTransformEmailTemplate(),
+    watchGetTemplateDetails(),
+    watchGetAllAssets(),
+    watchGetCmsSetting(),
+    watchGetCmsData(),
+    watchUploadAsset(),
+    watchDuplicateTemplate(),
+  ]);
+}

package/v2Containers/EmailWrapper/index.js

@@ -101,10 +101,15 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
     this.props.onResetStep();
     this.props.templatesActions.resetTemplateData();
   }
-  onTemplateNameChange = ({target:{value}}) => {
-    this.setState({ templateName: value });
-    const isEmptyTemplateName = value.trim() ? false : true;
-    this.setState({isTemplateNameEmpty : isEmptyTemplateName});
+  onTemplateNameChange = ({target: {value}}) => {
+    const {onEnterTemplateName, onRemoveTemplateName} = this.props;
+    const isEmptyTemplateName = !value?.trim();
+    this.setState({templateName: value, isTemplateNameEmpty: isEmptyTemplateName});
+    if (value && onEnterTemplateName) {
+      onEnterTemplateName();
+    } else if (onRemoveTemplateName) {
+      onRemoveTemplateName();
+    }
   }
   onChange = (e) => {
     this.props.onEmailModeChange(e.target.value);
@@ -131,8 +136,8 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
     gtmPush('creativeDetails', {
       channel: EMAIL,
       timeTaken,
-      mode: 'uploadZip'
-    });    
+      mode: 'uploadZip',
+    });
   }
   handleFileUpload = (file = {}) => {
     const { templatesActions, intl, showNextStep, isUploading } = this.props;
@@ -208,6 +213,7 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
       cmsTemplatesLoader,
       editor,
       currentOrgDetails,
+      moduleType,
     } = this.props;
     const {
       templateName,
@@ -242,10 +248,10 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
                 {emailCreateMode === "upload" &&
                   <div style={{ marginLeft: '8px' }}>
                     <CapUploader onChange={this.useFileUpload} accept=".zip, .html, .htm" showUploadList={false}>
-                      { (isFullMode && isTemplateNameEmpty) && 
+                      { (isFullMode && isTemplateNameEmpty) &&
                         <CapError type="error">
                           < FormattedMessage {...messages.emptyTemplateName} />
-                        </CapError> 
+                        </CapError>
                       }
                       <CapButton disabled={isFullMode && isTemplateNameEmpty}>{this.props.intl.formatMessage(messages.upload)}</CapButton>
                     </CapUploader>
@@ -278,6 +284,7 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
                 onPreviewContentClicked={onPreviewContentClicked}
                 onTestContentClicked={onTestContentClicked}
                 editor={editor}
+                moduleType={moduleType}
               />}
               {!isShowEmailCreate && (
                 <CmsTemplatesComponent
@@ -319,6 +326,9 @@ EmailWrapper.propTypes = {
   selectedOfferDetails: PropTypes.array,
   getCmsTemplatesInProgress: PropTypes.bool,
   currentOrgDetails: PropTypes.object,
+  moduleType: PropTypes.string,
+  onEnterTemplateName: PropTypes.func,
+  onRemoveTemplateName: PropTypes.func,
 };
 
 const mapStateToProps = createStructuredSelector({

package/v2Containers/FTP/index.js

@@ -33,7 +33,7 @@ import * as globalActions from '../../containers/Cap/actions';
 import { TagList } from '../TagList';
 import { NO_COMMUNICATION, CREATE, EDIT, PREVIEW } from '../App/constants';
 import { getTreeStructuredTags } from '../../utils/common';
-import { transformInjectedTags, checkIfSupportedTag } from '../../utils/tagValidations';
+import { transformInjectedTags, checkIfSupportedTag, skipTags } from '../../utils/tagValidations';
 
 const UIView = {
   serverSelection: 'serverSelection',
@@ -257,7 +257,7 @@ export class FTP extends React.Component {
       matchedTags.forEach((tag) => {
         let ifSupported = !!flatTags.find((t) => t === tag[0]);
         const tagValue = tag[0].substring(this.indexOfEnd(tag[0], '{{'), tag[0].indexOf('}}'));
-        ifSupported = ifSupported || checkIfSupportedTag(tagValue, injectedTags);
+        ifSupported = ifSupported || checkIfSupportedTag(tagValue, injectedTags) || skipTags(tagValue);
         if (!ifSupported) {
           response.unsupportedTags.push(tagValue);
           response.valid = false;

package/v2Containers/FTP/sagas.js

@@ -1,5 +1,4 @@
 import { take, cancel, call, put, takeLatest } from 'redux-saga/effects';
-import { LOCATION_CHANGE } from 'react-router-redux';
 import * as Api from '../../services/api';
 import * as types from './constants';
 
@@ -15,9 +14,9 @@ export function* getFTPServers() {
 
 
 function* watchGetFTPServers() {
-  const watcher = yield takeLatest(types.GET_FTP_SERVERS_REQUEST, getFTPServers);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(types.GET_FTP_SERVERS_REQUEST, getFTPServers);
+  
+  
 }
 
 // All sagas to be loaded

package/v2Containers/Facebook/sagas.js

@@ -1,5 +1,4 @@
-import { take, call, put, takeLatest, cancel } from 'redux-saga/effects';
-import { LOCATION_CHANGE } from 'react-router-redux';
+import { take, call, put, takeLatest, cancel, all } from 'redux-saga/effects';
 import * as Api from '../../services/api';
 import {
   GET_MARKETING_OBJECTIVES,
@@ -145,33 +144,33 @@ export function* getTemplateDetails({id, callback}) {
 
 
 function* watchCreateTemplate() {
-  const watcher = yield takeLatest(CREATE_FACEBOOK_AD_TEMPLATE_REQUEST, createFacebookADTemplate);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(CREATE_FACEBOOK_AD_TEMPLATE_REQUEST, createFacebookADTemplate);
+  
+  
 }
 
 function* watchGetTemplateDetails() {
-  const watcher = yield takeLatest(GET_FACEBOOK_AD_TEMPLATE_DETAILS_REQUEST, getTemplateDetails);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(GET_FACEBOOK_AD_TEMPLATE_DETAILS_REQUEST, getTemplateDetails);
+  
+  
 }
 
 function* watchEditTemplate() {
-  const watcher = yield takeLatest(EDIT_FACEBOOK_AD_TEMPLATE_REQUEST, editTemplate);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(EDIT_FACEBOOK_AD_TEMPLATE_REQUEST, editTemplate);
+  
+  
 }
 
 
 function* watchFetchMarketingObjective() {
-  const watcher = yield takeLatest(GET_MARKETING_OBJECTIVES, fetchMarketingObjectives);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(GET_MARKETING_OBJECTIVES, fetchMarketingObjectives);
+  
+  
 }
 function* watchUploadFbADAsset() {
-  const watcher = yield takeLatest(UPLOAD_FB_AD_ASSET_REQUEST, uploadFbAdAsset);
-  yield take(LOCATION_CHANGE);
-  yield cancel(watcher);
+  yield takeLatest(UPLOAD_FB_AD_ASSET_REQUEST, uploadFbAdAsset);
+  
+  
 }
 export function* watchGetOrgOUs() {
   yield takeLatest(GET_ORG_OU_LIST_REQUEST, getOrgOUs);
@@ -186,3 +185,13 @@ export default [
   watchGetOrgOUs,
 ];
 
+export function* v2FacebookSagas() {
+  yield all([
+    watchFetchMarketingObjective(),
+    watchUploadFbADAsset(),
+    watchEditTemplate(),
+    watchGetTemplateDetails(),
+    watchCreateTemplate(),
+    watchGetOrgOUs(),
+  ]);
+}

package/v2Containers/InApp/actions.js

@@ -0,0 +1,64 @@
+import { INAPP } from "../CreativesContainer/constants";
+import {
+  INAPP_TEMPLATE_CREATE_REQUEST,
+  CLEAR_CREATE_RESPONSE_REQUEST,
+  GET_INAPP_TEMPLATE_DETAILS_REQUEST,
+  RESET_EDIT_TEMPLATE,
+  UPLOAD_INAPP_ASSET_REQUEST,
+  CLEAR_INAPP_ASSET,
+  INAPP_EDIT_TEMPLATE_REQUEST,
+} from "./constants";
+
+export function createInAppTemplate(payload, callback) {
+  return {
+    type: INAPP_TEMPLATE_CREATE_REQUEST,
+    payload,
+    callback,
+  };
+}
+export function clearCreateResponse() {
+  return {
+    type: CLEAR_CREATE_RESPONSE_REQUEST,
+  };
+}
+// FOR EDIT
+export function getTemplateDetails(id, callback) {
+  return {
+    type: GET_INAPP_TEMPLATE_DETAILS_REQUEST,
+    id,
+    channel: INAPP,
+    callback,
+  };
+}
+
+export function editTemplate(template, callback) {
+  return {
+    type: INAPP_EDIT_TEMPLATE_REQUEST,
+    payload: template,
+    callback,
+  };
+}
+
+export function resetEditTemplate() {
+  return {
+    type: RESET_EDIT_TEMPLATE,
+  };
+}
+
+export const uploadInAppAsset = (
+  file,
+  assetType,
+  fileParams,
+  templateType,
+) => ({
+  type: UPLOAD_INAPP_ASSET_REQUEST,
+  file,
+  assetType,
+  fileParams,
+  templateType,
+});
+
+export const clearInAppAsset = (templateType) => ({
+  type: CLEAR_INAPP_ASSET,
+  templateType,
+});

package/v2Containers/InApp/constants.js

@@ -0,0 +1,160 @@
+import React from "react";
+import { FormattedMessage } from "react-intl";
+import {
+  CAP_ORANGE,
+  CAP_PURPLE02,
+  CAP_PURPLE03,
+  CAP_ORANGE01,
+  CAP_GREEN01,
+  CAP_GREEN02,
+  CAP_PALE_GREY,
+  FONT_COLOR_05,
+} from '@capillarytech/cap-ui-library/styled/variables';
+import CapHeading from "@capillarytech/cap-ui-library/CapHeading";
+import CapLabel from "@capillarytech/cap-ui-library/CapLabel";
+import { WEBSITE } from "../../v2Components/CapInAppCTA/constants";
+import messages from "./messages";
+
+const prefix = "app/v2Containers/InApp";
+export const INAPP_TEMPLATE_CREATE_REQUEST = `${prefix}/INAPP_TEMPLATE_CREATE_REQUEST`;
+export const INAPP_TEMPLATE_CREATE_SUCCESS = `${prefix}/INAPP_TEMPLATE_CREATE_SUCCESS`;
+export const INAPP_TEMPLATE_CREATE_FAILURE = `${prefix}/INAPP_TEMPLATE_CREATE_FAILURE`;
+export const INAPP_EDIT_TEMPLATE_REQUEST = `${prefix}/INAPP_EDIT_TEMPLATE_REQUEST`;
+export const INAPP_EDIT_TEMPLATE_SUCCESS = `${prefix}/INAPP_EDIT_TEMPLATE_SUCCESS`;
+export const INAPP_EDIT_TEMPLATE_FAILURE = `${prefix}/INAPP_EDIT_TEMPLATE_FAILURE`;
+export const CLEAR_CREATE_RESPONSE_REQUEST = `${prefix}/CLEAR_CREATE_RESPONSE_REQUEST`;
+// FOR EDIT
+export const GET_INAPP_TEMPLATE_DETAILS_REQUEST = `${prefix}/Edit/GET_INAPP_TEMPLATE_DETAILS_REQUEST`;
+export const GET_INAPP_TEMPLATE_DETAILS_SUCCESS = `${prefix}/Edit/GET_INAPP_TEMPLATE_DETAILS_SUCCESS`;
+export const GET_INAPP_TEMPLATE_DETAILS_FAILURE = `${prefix}/Edit/GET_INAPP_TEMPLATE_DETAILS_FAILURE`;
+export const RESET_EDIT_TEMPLATE = `${prefix}/Edit/RESET_EDIT_TEMPLATE`;
+
+export const UPLOAD_INAPP_ASSET_REQUEST = `${prefix}/UPLOAD_INAPP_ASSET_REQUEST`;
+export const UPLOAD_INAPP_ASSET_SUCCESS = `${prefix}/UPLOAD_INAPP_ASSET_SUCCESS`;
+export const UPLOAD_INAPP_ASSET_FAILURE = `${prefix}/UPLOAD_INAPP_ASSET_FAILURE`;
+export const CLEAR_INAPP_ASSET = `${prefix}/CLEAR_INAPP_ASSET`;
+
+export const INAPP_MEDIA_TYPES = {
+  TEXT: "TEXT",
+  IMAGE: "IMAGE",
+};
+export const BIG_TEXT = 'BIG_TEXT';
+export const BIG_PICTURE = 'BIG_PICTURE';
+export const NONE = "NONE";
+export const CTA = "CTA";
+export const MAPP_SDK = "MAPP_SDK";
+export const INAPP_BUTTON_TYPES = {
+  NONE,
+  CTA,
+};
+
+export const DEEP_LINK = 'DEEP_LINK';
+
+export const INITIAL_CTA_DATA = [
+  {
+    index: 0,
+    ctaType: WEBSITE,
+    text: "",
+    urlType: DEEP_LINK,
+    url: "",
+    isSaved: false,
+  },
+];
+
+export const URL_MAX_LENGTH = 2000;
+
+export const ALLOWED_IMAGE_EXTENSIONS_REGEX = /\.(jpe?g|png)$/i;
+export const INAPP_IMG_SIZE = 5000000; // 5MB
+
+export const TEMPLATE_MESSAGE_MAX_LENGTH = 1024;
+
+export const INAPP_MESSAGE_LAYOUT_TYPES = {
+  MODAL: "POPUP",
+  TOPBANNER: "HEADER",
+  BOTTOMBANNER: "FOOTER",
+  FULLSCREEN: "FULLSCREEN",
+};
+
+export const ANDROID = "ANDROID";
+export const IOS = "iOS";
+export const LAYOUT_RADIO_OPTIONS = [
+  {
+    value: INAPP_MESSAGE_LAYOUT_TYPES.MODAL,
+    label: <FormattedMessage {...messages.layoutModal} />,
+  },
+  {
+    value: INAPP_MESSAGE_LAYOUT_TYPES.TOPBANNER,
+    label: <FormattedMessage {...messages.layoutTopBanner} />,
+  },
+  {
+    value: INAPP_MESSAGE_LAYOUT_TYPES.BOTTOMBANNER,
+    label: <FormattedMessage {...messages.layoutBottomBanner} />,
+  },
+  {
+    value: INAPP_MESSAGE_LAYOUT_TYPES.FULLSCREEN,
+    label: <FormattedMessage {...messages.layoutFullScreen} />,
+  },
+];
+export const MEDIA_RADIO_OPTIONS = [
+  {
+    value: INAPP_MEDIA_TYPES.TEXT,
+    label: <FormattedMessage {...messages.mediaText} />,
+  },
+  {
+    value: INAPP_MEDIA_TYPES.IMAGE,
+    label: <FormattedMessage {...messages.mediaImage} />,
+  },
+];
+export const BUTTON_RADIO_OPTIONS = [
+  {
+    value: INAPP_BUTTON_TYPES.NONE,
+    label: (
+      <CapHeading
+        type="h4"
+        className="inapp-button-none"
+      >
+        <FormattedMessage {...messages.btnTypeNone} />
+      </CapHeading>
+    ),
+  },
+  {
+    value: INAPP_BUTTON_TYPES.CTA,
+    label: (
+      <>
+        <div
+          className="inapp-button-cta"
+        >
+          <CapHeading type="h4">
+            <FormattedMessage {...messages.btnTypeCTA} />
+          </CapHeading>
+          <CapLabel><FormattedMessage {...messages.ctaDescription} /></CapLabel>
+        </div>
+      </>
+    ),
+  },
+];
+
+export const INAPP_LAYOUT_DETAILS = {
+  POPUP: {
+    tagColor: CAP_ORANGE01,
+    tagTextColor: CAP_ORANGE,
+    text: <FormattedMessage {...messages.popup} />,
+  },
+  HEADER: {
+    tagColor: CAP_PURPLE03,
+    tagTextColor: CAP_PURPLE02,
+    text: <FormattedMessage {...messages.header} />,
+  },
+  FOOTER: {
+    tagColor: CAP_PALE_GREY,
+    tagTextColor: FONT_COLOR_05,
+    text: <FormattedMessage {...messages.footer} />,
+  },
+  FULLSCREEN: {
+    tagColor: CAP_GREEN02,
+    tagTextColor: CAP_GREEN01,
+    text: <FormattedMessage {...messages.layoutFullScreen} />,
+  },
+};
+
+export const DEVICE_SUPPORTED = '1';