@capillarytech/creatives-library 7.17.136 → 7.17.137

package/package.json

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

package/v2Components/Ckeditor/index.js

@@ -15,10 +15,10 @@ import CapSpin from '@capillarytech/cap-ui-library/CapSpin';
 import './style.scss';
 // import messages from './messages';
 const loadScript = require('load-script');
-const defaultScriptUrl = `${window.location.origin}/arya/ui/library/ckeditor/ckeditor.js`;
-/*const defaultScriptUrl = 'https://nightly.intouch.capillarytech.com/arya/ui/library/ckeditor/ckeditor.js';
-**Uncomment the above line to use CKEDITOR in local
-*/
+// const defaultScriptUrl = `${window.location.origin}/arya/ui/library/ckeditor/ckeditor.js`;
+const defaultScriptUrl = 'https://nightly.intouch.capillarytech.com/arya/ui/library/ckeditor/ckeditor.js';
+// **Uncomment the above line to use CKEDITOR in local
+// */
 const user = localStorage.getItem('user');
 let locale = 'en';
 if (user && JSON.parse(user).lang) {
@@ -173,7 +173,7 @@ class Ckeditor extends React.Component { // eslint-disable-line react/prefer-sta
       // setTimeout(() => {
       //   this.editorInstance.name = this.id;
       // }, 5000);
-      
+
     }
   }
 
@@ -219,7 +219,7 @@ class Ckeditor extends React.Component { // eslint-disable-line react/prefer-sta
 
     let html = this.props.content;
     html = html.replace(/&amp;/g, "&").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&quot;/g, "\"");
-    
+
     this.editorInstance = window.CKEDITOR.appendTo(
       this.node,
       this.state.config,

package/v2Components/NavigationBar/index.js

@@ -22,7 +22,7 @@ import {
 import CapNavigation from '@capillarytech/cap-ui-library/CapNavigation';
 import configPath from '../../config/path';
 import * as Api from '../../services/api';
-import {CapLeftNavigatioOpenCss, CapLeftNavigationCss} from './style';
+import { CapLeftNavigatioOpenCss, CapLeftNavigationCss } from './style';
 import { EMBEDDED } from './constants';
 
 const CapWrapper = styled.div`
@@ -48,7 +48,7 @@ export class NavigationBar extends React.Component {
   }
 
   initializeSelectedProduct = () => {
-    const {location, intl: {formatMessage}} = this.props;
+    const { location, intl: { formatMessage } } = this.props;
     const { pathname } = location;
     const parentModule = pathname.substring(pathname.lastIndexOf('/') + 1);
     switch (parentModule) {
@@ -95,14 +95,14 @@ export class NavigationBar extends React.Component {
   };
 
   onHelpIconClick = () => {
-    const {helpUrl} = this.state;
+    const { helpUrl } = this.state;
     if (helpUrl) {
       window.open(helpUrl, '_blank');
     }
   };
 
   getTopbarIcons = (showDocumentationBot = false, isLatestLeftNavigationEnabled = false) => {
-    const {settingsIcon} = this.state;
+    const { settingsIcon } = this.state;
     const ICONS = [
       {
         iconType: 'help',
@@ -112,7 +112,7 @@ export class NavigationBar extends React.Component {
     ];
     if (!isLatestLeftNavigationEnabled) {
       ICONS.push(settingsIcon);
-     }
+    }
     return showDocumentationBot ? ICONS.slice(1) : ICONS; // If showDocumentationBot is true, help icon will be replaced by Aira icon on UI
 
   };
@@ -149,8 +149,10 @@ export class NavigationBar extends React.Component {
       handleLeftNavBarExpanded,
       leftNavbarExpandedProp,
     } = this.props;
+
     const accessibleDocFeatures = get(userData, 'currentOrgDetails.accessibleFeatures', []);
     const showDocumentationBot = !accessibleDocFeatures.includes(AI_DOCUMENTATION_BOT_DISABLED);
+
     const dropdownMenuProps = this.getDropdownMenu();
     const {
       currentOrgDetails: {
@@ -160,7 +162,7 @@ export class NavigationBar extends React.Component {
     const isLatestLeftNavigationEnabled = accessibleFeatures?.includes(
       ENABLE_NEW_LEFT_NAVIGATION,
     );
-    const topbarIcons = this.getTopbarIcons(showDocumentationBot,isLatestLeftNavigationEnabled);
+    const topbarIcons = this.getTopbarIcons(showDocumentationBot, isLatestLeftNavigationEnabled);
     const topbarMenuDataModified = isLatestLeftNavigationEnabled ? [] : topbarMenuData;
     const headerOverideCss = isLatestLeftNavigationEnabled && (leftNavbarExpandedProp ? CapLeftNavigatioOpenCss : CapLeftNavigationCss);
     return (

package/v2Containers/CreativesContainer/SlideBoxContent.js

@@ -592,6 +592,8 @@ export function SlideBoxContent(props) {
         cap={cap}
         onResetStep={onResetStep}
         showTemplateName={showTemplateName}
+        onEnterTemplateName={onEnterTemplateName}
+        onRemoveTemplateName={onRemoveTemplateName}
         onValidationFail={onValidationFail}
         forwardedTags={forwardedTags}
         selectedOfferDetails={selectedOfferDetails}

package/v2Containers/CreativesContainer/SlideBoxFooter.js

@@ -14,14 +14,15 @@ function SlideBoxFooter(props) {
   return (
     <div>
       <div>
+
         {props.shouldShowDoneFooter() && (
           <div>
-            { isFullMode && isTemplateNameEmpty && 
+            { isFullMode && isTemplateNameEmpty &&
               <CapError type="error">
                 <FormattedMessage {...messages.templateNameEmpty} />
-              </CapError> 
+              </CapError>
             }
-            <CapButton onClick={onSave} disabled={isTemplateNameEmpty ||fetchingCmsData || false}>
+            <CapButton onClick={onSave} disabled={isTemplateNameEmpty || fetchingCmsData || false}>
               {isFullMode ?
                 getFullModeSaveBtn(slidBoxContent)
               :
@@ -31,7 +32,7 @@ function SlideBoxFooter(props) {
             {/* {isFullMode && <CapButton type="secondary" onClick={onDiscard}><FormattedMessage {...messages.creativesTemplatesDiscard}/></CapButton>} */}
           </div>)}
         {props.shouldShowContinueFooter() &&
-          <CapButton onClick={onCreateNextStep}>
+          <CapButton onClick={onCreateNextStep} >
             <FormattedMessage {...messages.continue} />
           </CapButton>
           }
@@ -52,5 +53,6 @@ SlideBoxFooter.propTypes = {
   shouldShowContinueFooter: PropTypes.func,
   shouldShowDoneFooter: PropTypes.func,
   isFullMode: PropTypes.bool,
+  isTemplateNameEmpty: PropTypes.bool,
 };
 export default SlideBoxFooter;

package/v2Containers/CreativesContainer/index.js

@@ -84,7 +84,7 @@ export class Creatives extends React.Component {
 
   componentDidMount() {
     GA.timeTracker.startTimer(CREATIVES_CONTAINER);
-    if(!this.props?.isFullMode){
+    if (!this.props?.isFullMode) {
       this.props?.templateActions.getCdnTransformationConfig();
     }
   }
@@ -598,7 +598,7 @@ export class Creatives extends React.Component {
           const type = (get(this.props, "messageDetails.type") || '').toLowerCase();
           const sourceType = get(channelTemplate, 'definition.sourceType');
           if (type === LOYALTY) {
-            if(sourceType === 'MAPP_SDK') {
+            if (sourceType === 'MAPP_SDK') {
               templateData.templateId = get(channelTemplate, '_id');
               templateData.licenseCode = get(channelTemplate, 'definition.licenseCode');
               templateData.gatewayId = get(channelTemplate, 'definition.gatewayId');
@@ -741,10 +741,10 @@ export class Creatives extends React.Component {
             header,
             footer,
             headerVarMapped,
-            headerTemplate
+            headerTemplate,
           };
           const {
-            whatsappDocName = '', whatsappDocSize, whatsappDocPages, whatsappDocImg = ''
+            whatsappDocName = '', whatsappDocSize, whatsappDocPages, whatsappDocImg = '',
           } = whatsappDocParams;
           switch (mediaType) {
             case (WHATSAPP_MEDIA_TYPES.IMAGE):
@@ -970,10 +970,10 @@ export class Creatives extends React.Component {
           const templateData = this.state.templateData ? this.state.templateData : template; //select existing or create new content
           const channel = templateData.type;
           const creativesData = this.getCreativesData(channel, template, templateData );// convers data to consumer understandable format
-          creativesData.then(data=>{
+          creativesData.then((data) => {
             this.logGTMEvent(channel, data);
             this.props.getCreativesData(data);// send data to consumer
-          })
+          });
         },
       );
     }
@@ -1031,7 +1031,7 @@ export class Creatives extends React.Component {
       }
     } else if (channel === constants.EMAIL && isFullMode) {
       const isEmailCreate = slidBoxContent === 'createTemplate' && channel === constants.EMAIL && currentStep !== 'createTemplateContent';
-      showFooter = isEmailCreate && emailCreateMode;
+      showFooter = isEmailCreate && emailCreateMode && templateNameExists;
     }
     if (channel === constants.EMAIL && emailCreateMode === "upload") {
       showFooter = showFooter && !this.props.isUploading;
@@ -1105,7 +1105,7 @@ export class Creatives extends React.Component {
     onChange={(ev) => {
       const value = ev.currentTarget.value;
       const isEmptyTemplateName = value.trim() ? false : true;
-      this.setState({isTemplateNameEmpty : isEmptyTemplateName});
+      this.setState({isTemplateNameEmpty: isEmptyTemplateName});
       const newFormData = {...formData, 'template-name': value};
       onFormDataChange(newFormData);
     }}
@@ -1116,7 +1116,7 @@ export class Creatives extends React.Component {
     if ([constants.EMAIL, constants.MOBILE_PUSH, constants.INAPP].includes(channel) && (slidBoxContent === 'editTemplate' || slidBoxContent === 'createTemplate')) {
       const name = get(formData, 'template-name');
       if (channel === constants.EMAIL && !name && slidBoxContent === 'createTemplate') {
-        this.setState({isTemplateNameEmpty:true});
+        this.setState({isTemplateNameEmpty: true});
       }
       this.templateContainerDetails = {formData, onFormDataChange};
       if (name && !isEditName) {

package/v2Containers/Email/index.js

@@ -546,18 +546,29 @@ 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, syncTemplateName} = this.props;
+    const templateName = formData['template-name'];
+    const defaultTemplateName = _.get(defaultData, 'template-name', "");
+
+    //sync back template name from from editing in create flow to wrapper when  edited
+
+    if (_.isEmpty(templateName) && defaultTemplateName) {
+      syncTemplateName(defaultTemplateName);
+    } else {
+      syncTemplateName(templateName);
+    }
+    if (defaultData && _.isEmpty(templateName) && defaultTemplateName?.length >1 && isFullMode) {
+      formData['template-name'] = defaultTemplateName;
     }
     this.setState({formData, tabCount, isSchemaChanged: false}, () => {
-      if (this.props.isFullMode) {
-        this.props.showTemplateName({formData, onFormDataChange: this.onFormDataChange});
+      if (isFullMode) {
+        showTemplateName({formData, onFormDataChange: this.onFormDataChange});
       }
     });
     if (currentTab) {
@@ -647,7 +658,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
       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){
+    } else if (this.state.editorInstanse) {
       this.state.editorInstanse.insertHtml(`{{${data}}}`);
     }
       //this.resetCkEditorInstance(currentTab, formData, true, data);
@@ -2409,7 +2420,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 {
@@ -2772,6 +2783,7 @@ Email.propTypes = {
   setIsLoadingContent: PropTypes.func,
   injectedTags: PropTypes.object,
   defaultData: PropTypes.object,
+  syncTemplateName: PropTypes.func,
   showTemplateName: PropTypes.func,
   onValidationFail: PropTypes.func,
   selectedOfferDetails: PropTypes.array,

package/v2Containers/EmailWrapper/index.js

@@ -101,10 +101,16 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
     this.props.onResetStep();
     this.props.templatesActions.resetTemplateData();
   }
-  onTemplateNameChange = ({target:{value}}) => {
+  onTemplateNameChange = ({target: {value}}) => {
+    const {onEnterTemplateName, onRemoveTemplateName} = this.props;
     this.setState({ templateName: value });
-    const isEmptyTemplateName = value.trim() ? false : true;
-    this.setState({isTemplateNameEmpty : isEmptyTemplateName});
+    const isEmptyTemplateName = value?.trim()?.length === 0;
+    this.setState({isTemplateNameEmpty: isEmptyTemplateName});
+    if (value && onEnterTemplateName) {
+      onEnterTemplateName();
+    } else if (onRemoveTemplateName) {
+      onRemoveTemplateName();
+    }
   }
   onChange = (e) => {
     this.props.onEmailModeChange(e.target.value);
@@ -131,8 +137,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;
@@ -185,7 +191,9 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
   useEditor = (id) => {
     this.setState({ modeContent: { id } }, this.props.showNextStep);
   }
-
+  onSyncTemplateName=(tempName) => {
+    this.setState({templateName: tempName});
+  }
   isShowEmailCreate = () => !_.isEmpty(this.state.selectedCreateMode) && (!_.isEmpty(this.props.EmailLayout) || this.props.SelectedEdmDefaultTemplate)
   render() {
     const {
@@ -243,10 +251,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>
@@ -271,6 +279,7 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
                 getDefaultTags={type}
                 isFullMode={isFullMode}
                 defaultData={{ 'template-name': templateName }}
+                syncTemplateName={this.onSyncTemplateName}
                 cap={cap}
                 showTemplateName={showTemplateName}
                 onValidationFail={onValidationFail}
@@ -281,6 +290,7 @@ export class EmailWrapper extends React.Component { // eslint-disable-line react
                 editor={editor}
                 moduleType={moduleType}
               />}
+
               {!isShowEmailCreate && (
                 <CmsTemplatesComponent
                   cmsTemplates={CmsTemplates}
@@ -322,6 +332,8 @@ EmailWrapper.propTypes = {
   getCmsTemplatesInProgress: PropTypes.bool,
   currentOrgDetails: PropTypes.object,
   moduleType: PropTypes.string,
+  onEnterTemplateName: PropTypes.func,
+  onRemoveTemplateName: PropTypes.func,
 };
 
 const mapStateToProps = createStructuredSelector({

package/v2Containers/MobilePush/Create/index.js

@@ -31,7 +31,7 @@ import { GA } from '@capillarytech/cap-ui-utils';
 import { CREATE, TRACK_CREATE_MPUSH } from '../../App/constants';
 import { MOBILE_PUSH } from '../../CreativesContainer/constants';
 import { getContent } from '../commonMethods';
-import { getCdnUrl } from '../../../utils/cdnTransformation'
+import { getCdnUrl } from '../../../utils/cdnTransformation';
 
 const PrefixWrapper = styled.div`
   margin-right: 16px;
@@ -149,6 +149,8 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
   onFormDataChange = (formData, tabCount, currentTab, inputField) => {
     const newFormData = cloneDeep(formData);
     const {templateCta} = this.state;
+    const {syncTemplateName, defaultData = {}, isFullMode, showTemplateName} = this.props;
+
     if (!isEmpty(templateCta)) {
       newFormData[this.state.currentTab - 1][`secondary-cta-${this.state.currentTab - 1}-label`] = get(templateCta, 'name');
       newFormData[this.state.currentTab - 1][`secondary-cta-${this.state.currentTab - 1}-action`] = get(templateCta, 'ctaTemplateDetails[0].buttonText');
@@ -157,6 +159,15 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
         newFormData[this.state.currentTab - 1][`secondary-cta-${this.state.currentTab - 1}-action2`] = get(templateCta, 'ctaTemplateDetails[1].buttonText');
       }
     }
+  const templateName = formData['template-name'];
+  const defaultTemplateName= get(defaultData, 'template-name') ?? ""
+    //sync back template name from from editing in create flow to wrapper when  edited
+    if (isEmpty(templateName) && defaultTemplateName) {
+      syncTemplateName(defaultTemplateName);
+    } else {
+      syncTemplateName(templateName);
+    }
+
 
     // copy content code
     // if (newFormData[0]['copy-iphone-content'] === "") {
@@ -179,8 +190,12 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
     //     newFormData[1]['copy-android-content'] = "";
     //   }
     // }
-    if (this.props.isFullMode && this.props.defaultData && isEmpty(formData['template-name'])) {
-      newFormData['template-name'] = get(this.props, "defaultData['template-name']");
+
+    //assign newFormData['template-name'] to default name only once in inital render, if edited use latest form data
+    if (isFullMode && defaultData && isEmpty(templateName) && defaultTemplateName?.length>1) {
+      newFormData['template-name'] = defaultTemplateName;
+    } else {
+      newFormData['template-name'] = templateName;
     }
     if (inputField && inputField.id === "add-sec-cta") {
       if (!newFormData[0]["add-sec-cta"]) {
@@ -188,8 +203,8 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
       }
     }
     this.setState({formData: newFormData, tabCount, isSchemaChanged: !this.state.isSchemaChanged}, () => {
-      if (this.props.isFullMode) {
-        this.props.showTemplateName({formData: this.state.formData, onFormDataChange: this.onFormDataChange});
+      if (isFullMode) {
+        showTemplateName({formData: this.state.formData, onFormDataChange: this.onFormDataChange});
       }
     });
   };
@@ -204,7 +219,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
     this.setState({currentTab: data});
   };
   onTemplateNameChange = () => {
-    // 
+    //
   };
 
 
@@ -368,7 +383,7 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
     };
     obj.type = 'MOBILEPUSH';
     obj.name = formData['template-name'];
-    if(this.props?.Templates?.selectedWeChatAccount?.sourceTypeName === 'MAPP_SDK') {
+    if (this.props?.Templates?.selectedWeChatAccount?.sourceTypeName === 'MAPP_SDK') {
       obj.definition = {
         accountId: this.props.Templates.selectedWeChatAccount.id,
         licenseCode: this.props.Templates.selectedWeChatAccount.sourceAccountIdentifier,
@@ -1450,10 +1465,10 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
     //this function gets called from form bulder only when the form data is valid
     const obj = this.getTransformedData(formData);
     const content = getContent(obj);
-    const  { 
+    const {
       definition: {
-        mode: definitionMode
-      } 
+        mode: definitionMode,
+      },
     } = obj || {};
     const label = this.props.location.pathname.indexOf('image') >= 0 ? 'image' : 'text';
     this.props.actions.createTemplate(obj, (response) => {
@@ -1469,9 +1484,9 @@ export class Create extends React.Component { // eslint-disable-line react/prefe
         timeTaken,
         content,
         mode: CREATE,
-        imageAdded: definitionMode === 'image'
+        imageAdded: definitionMode === 'image',
       });
-      
+
       this.discardValues();
       const message = this.props.intl.formatMessage(messages.messageCreateSuccess);
       CapNotification.success({message, key: 'createMpushSuccess'});
@@ -1865,6 +1880,7 @@ Create.propTypes = {
   iosCtasData: PropTypes.array,
   injectedTags: PropTypes.object,
   defaultData: PropTypes.object,
+  syncTemplateName: PropTypes.func,
   showTemplateName: PropTypes.func,
   isGetFormData: PropTypes.bool,
   onValidationFail: PropTypes.func,
@@ -1893,4 +1909,4 @@ export default withCreatives({
   mapStateToProps,
   mapDispatchToProps,
   userAuth: false,
-});
+});

package/v2Containers/MobilepushWrapper/index.js

@@ -56,6 +56,9 @@ export class MobilepushWrapper extends React.Component { // eslint-disable-line
       templateName: "",
     };
   }
+
+ 
+
   onChange = (e) => {
     this.props.onMobilepushModeChange( e.target.value );
   };
@@ -68,6 +71,10 @@ export class MobilepushWrapper extends React.Component { // eslint-disable-line
       onRemoveTemplateName();
     }
   }
+
+  onSyncTemplateName=(tempName)=>{
+    this.setState({templateName: tempName});
+  }
   render() {
     const {mobilePushCreateMode, step, getFormData, setIsLoadingContent, isGetFormData, query, isFullMode, showTemplateName, type, onValidationFail, onPreviewContentClicked, onTestContentClicked, templateData} = this.props;
     const {templateName} = this.state;
@@ -101,6 +108,8 @@ export class MobilepushWrapper extends React.Component { // eslint-disable-line
               getFormLibraryData={getFormData}
               setIsLoadingContent={setIsLoadingContent}
               defaultData={{"template-name": templateName}}
+              syncTemplateName={this.onSyncTemplateName}
+
               location={{
                 pathname: `/mobilepush/create/${mobilePushCreateMode}`,
                 query,

package/v2Containers/Whatsapp/index.js

@@ -1368,7 +1368,7 @@ export const Whatsapp = (props) => {
       return true;
     }
     //if media type is image, video or document and the mediaType file is not uploaded
-    if (!isMediaTypeText && host === HOST_KARIX && karixFileHandle === '') {
+    if (!isMediaTypeText && [HOST_KARIX, HOST_GUPSHUP].includes(host) && karixFileHandle === '') {
       return true;
     }
     if (templateHeaderError || templateFooterError) {