@capillarytech/creatives-library 7.7.26 → 7.8.0

package/utils/gtmTrackers/index.js

@@ -5,17 +5,13 @@ const gtmEvents = require.context('./gtmEvents', true, /\.js$/, 'lazy');
 export const gtmPush = (eventType, eventObject) => {
   try {
     gtmEvents(`./${eventType}.js`)
-      .then((event) => {
+      .then(event => {
         event.default(eventObject);
       })
-      .catch((err) => {
-        if (err) {
-          Bugsnag.notify(err);
-        }
+      .catch(err => {
+        Bugsnag.notify(err);
       });
   } catch (e) {
-    if (e) {
-      Bugsnag.notify(e);
-    }
+    Bugsnag.notify(e);
   }
 };

package/v2Components/CapImageUpload/index.js

@@ -85,12 +85,6 @@ function CapImageUpload(props) {
       };
       submitAction({file, type: 'image', fileParams}, incorrectFile);
     };
-    img.onerror = () => {
-      const fileParams = {
-        error: true,
-      };
-      submitAction({fileParams}, incorrectFile);
-    }
     if (e) {
       const event = e;
       event.target.value = null;
@@ -99,12 +93,13 @@ function CapImageUpload(props) {
 
   const submitAction = useCallback((data, incorrectFile) => {
     const {
-      file,
-      fileParams
-    } = data || {};
-    const { size } = file || {};
-    const { height, width, error } = fileParams || {}; 
-    if (incorrectFile || size > imgSize || height > imgHeight || width > imgWidth || error) {
+      file: {size},
+      fileParams: {
+          height,
+          width,
+      },
+    } = data;
+    if (incorrectFile || size > imgSize || height > imgHeight || width > imgWidth) {
       updateImageErrorMessage(formatMessage(messages.imageIncorrectSize));
     } else {
       updateImageErrorMessage('');
@@ -171,7 +166,6 @@ function CapImageUpload(props) {
         <CapUploader.CapDragger
           customRequest={capUploaderCustomRequest}
           className="form-builder-dragger"
-          showUploadList={!isImageError}
         >
           <CapHeading className="dragger-title" type="h7">
             <FormattedMessage {...messages.dragAndDrop} />
@@ -204,7 +198,7 @@ function CapImageUpload(props) {
         <FormattedMessage {...messages.imageReUpload} />
       </CapButton>
     );
-  }, [isImageError]);
+  }, []);
 
   return (
     <div style={style} className="cap-custom-image-upload">

package/v2Components/FormBuilder/index.js

@@ -2854,16 +2854,7 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
                     name={val.name ? val.name : `${val.id}-name`}
                     disabled={val.disabled}
                   >
-                    {val.options.map((option, index) => {
-                      const isMappedTemplateWechat = val.id === "template-redirect-options-radio";
-                      return (
-                        <CapRadio
-                          value={ isMappedTemplateWechat ? option.value : option } 
-                          inductiveText={val.inductiveText && val.inductiveText[index]}>{ isMappedTemplateWechat ? option.label : option } 
-                        </CapRadio>
-                      )
-                    }
-                    )}
+                    {val.options.map((option, index) => <CapRadio value={option} inductiveText={val.inductiveText && val.inductiveText[index]}>{option}</CapRadio>) }
 
                   </CapRadioGroup>
                   {/*{ifError ?*/}

package/v2Components/NavigationBar/index.js

@@ -10,23 +10,11 @@ import styled from 'styled-components';
 import { isEmpty, forEach } from 'lodash';
 import { loadItem } from 'services/localStorageApi';
 import { intlShape, injectIntl } from 'react-intl';
-import { FONT_COLOR_04 } from '@capillarytech/cap-ui-library/styled/variables';
 import TopBar from '../TopBar';
 import messages from './messages';
-import { LOYALTY } from '../../v2Containers/App/constants';
-import {
-  HELP_URL,
-  LOYALTY_HELP_URL,
-} from '../../v2Containers/Cap/constants';
 const PRODUCT_MASTERS = 'masters';
 const EMBEDDED = 'embedded';
 
-const AppWrapper = styled.div`
-  .navigation-setting-icon {
-    color: ${FONT_COLOR_04};
-  }
-`;
-
 const CapWrapper = styled.div`
   position: absolute;
   padding: 0;
@@ -46,37 +34,9 @@ const ComponentWrapper = styled.div`
 class NavigationBar extends React.Component {
   constructor(props) {
     super(props);
-    this.state = this.initializeSelectedProduct();
-  }
-
-  initializeSelectedProduct = () => {
-    const {location, intl: {formatMessage}} = this.props;
-    const { pathname } = location;
-    const parentModule = pathname.substring(pathname.lastIndexOf('/') + 1);
-    switch (parentModule) {
-      case LOYALTY:
-        return {
-          selectedProduct: formatMessage(messages.loyaltyProgram),
-          helpUrl: LOYALTY_HELP_URL,
-          settingsIcon: {
-            iconType: 'settings',
-            key: 'settings',
-            placement: 'bottomRight',
-            className: 'navigation-setting-icon',
-            toolTip: formatMessage(messages.noProductSetting),
-          },
-        };
-      default:
-        return {
-          selectedProduct: formatMessage(messages.selectedProductDefault),
-          helpUrl: HELP_URL,
-          settingsIcon: {
-            iconType: 'settings',
-            key: 'settings',
-            onClickHandler: this.onSettingsIconClick,
-          },
-        };
-    }
+    this.state = {
+      selectedProduct: '',
+    };
   }
 
   onOrgSettingsClick = () => {
@@ -97,7 +57,7 @@ class NavigationBar extends React.Component {
   };
 
   onHelpIconClick = () => {
-    const {helpUrl} = this.state;
+    const { helpUrl } = this.props;
     if (helpUrl) {
       window.open(helpUrl, '_blank');
     }
@@ -153,17 +113,18 @@ class NavigationBar extends React.Component {
     return productsList;
   };
 
-  getTopbarIcons = () => {
-    const {settingsIcon} = this.state;
-    return [
-      {
-        iconType: 'help',
-        key: 'help',
-        onClickHandler: this.onHelpIconClick,
-      },
-      settingsIcon,
-    ];
-  }
+  getTopbarIcons = () => [
+    {
+      iconType: 'help',
+      key: 'help',
+      onClickHandler: this.onHelpIconClick,
+    },
+    {
+      iconType: 'settings',
+      key: 'settings',
+      onClickHandler: this.onSettingsIconClick,
+    },
+  ];
 
   getDropdownMenu = () => {
     const { formatMessage } = this.props.intl;
@@ -207,6 +168,7 @@ class NavigationBar extends React.Component {
       topbarMenuData,
       loggedIn,
       type,
+      intl,
     } = this.props;
     const productsList = this.getProductsList();
     const proxyOrgList = this.getProxyOrgList();
@@ -216,11 +178,14 @@ class NavigationBar extends React.Component {
     const { selectedProduct } = this.state;
     const customTopBarProps = {};
     return (
-      <AppWrapper>
+      <div>
         {loggedIn && type !== EMBEDDED &&
           <TopBar
             productsList={productsList}
-            selectedProduct={selectedProduct}
+            selectedProduct={
+              selectedProduct ||
+              intl.formatMessage(messages.selectedProductDefault)
+            }
             handleProductChange={this.handleProductChange}
             proxyOrgList={proxyOrgList}
             selectedOrg={selectedOrg}
@@ -232,12 +197,12 @@ class NavigationBar extends React.Component {
             {...customTopBarProps}
           />
         }
-        <CapWrapper isEmbedded={type === EMBEDDED}>
-          <ComponentWrapper>
-            {React.Children.toArray(this.props.children)}
-          </ComponentWrapper>
-        </CapWrapper>
-      </AppWrapper>
+          <CapWrapper isEmbedded={type === EMBEDDED}>
+            <ComponentWrapper>
+              {React.Children.toArray(this.props.children)}
+            </ComponentWrapper>
+          </CapWrapper>
+      </div>
     );
   }
 }
@@ -249,6 +214,7 @@ NavigationBar.propTypes = {
   changeOrg: PropTypes.func,
   settingsUrl: PropTypes.string,
   children: PropTypes.node,
+  helpUrl: PropTypes.string,
   orgSettingsUrl: PropTypes.string,
   loggedIn: PropTypes.bool,
   intl: intlShape.isRequired,

package/v2Components/NavigationBar/messages.js

@@ -57,9 +57,4 @@ export default defineMessages({
     id: `${scope}.storeCare`,
     defaultMessage: 'Store Care',
   },
-  "noProductSetting": {
-    id: `${scope}.noProductSetting`,
-    defaultMessage:
-      'There are no product settings. Organisation settings are available under profile on the right.',
-  },
 });

package/v2Containers/App/constants.js

@@ -13,25 +13,6 @@ export const getTopbarMenuDataValue = () => ([
       { label: <FormattedMessage {...globalMessages.creatives} />, link: '/creatives/ui/v2', key: 'creatives' },
 ]);
 
-export const getLoyaltyTopbarMenuDataValue = () => [
-  {
-    label: <FormattedMessage {...globalMessages.programs} />,
-    link: 'loyalty/ui/',
-    key: 'programs',
-  },
-  //commented as promotions are not supported in loyalty v2 flow
-  // {
-  //   label: <FormattedMessage {...globalMessages.promotions} />,
-  //   link: 'loyalty/ui/promotions/',
-  //   key: 'promotions',
-  // },
-  {
-    label: <FormattedMessage {...globalMessages.creatives} />,
-    link: '/creatives/ui/v2/loyalty',
-    key: 'creatives',
-  },
-];
-
 export const TRACK_CREATE_SMS = 'createSms';
 export const TRACK_CREATE_EMAIL = 'createEmail';
 export const TRACK_CREATE_MPUSH = 'createMpush';
@@ -65,7 +46,7 @@ export const CHANNEL_CREATE_TRACK_MAPPING = {
   gallery: TRACK_CREATE_IMAGE,
   line: TRACK_CREATE_LINE,
   viber: TRACK_CREATE_VIBER,
-  facebook: TRACK_CREATE_FACEBOOK,
+  facebook: TRACK_CREATE_FACEBOOK
 };
 
 export const CHANNEL_EDIT_TRACK_MAPPING = {
@@ -76,7 +57,7 @@ export const CHANNEL_EDIT_TRACK_MAPPING = {
   gallery: TRACK_EDIT_IMAGE,
   line: TRACK_EDIT_LINE,
   viber: TRACK_EDIT_VIBER,
-  facebook: TRACK_EDIT_FACEBOOK,
+  facebook: TRACK_EDIT_FACEBOOK
 };
 export const GTM_TRACKING_ID = 'UA-110024621-2';
 export const BEE_PLUGIN = 'BEE_PLUGIN';
@@ -104,5 +85,4 @@ export const FB_AD_CALL_TO_ACTION = {
 };
 
 
-export const CREATIVES = 'creatives';
-export const LOYALTY = 'loyalty';
+export const CREATIVES = 'creatives';

package/v2Containers/Cap/actions.js

@@ -45,6 +45,7 @@ export function getUserData(callback) {
 }
 
 export function fetchSchemaForEntity(queryParams) {
+  
   return {
     type: types.GET_SCHEMA_FOR_ENTITY_REQUEST, queryParams,
   };
@@ -61,9 +62,8 @@ export function setInjectedTags(injectedTags) {
   };
 }
 
-export function getTopbarMenuData(parentModule) {
+export function getTopbarMenuData() {
   return {
-    parentModule,
     type: types.GET_TOPBAR_MENU_DATA_REQUEST,
   };
 }

package/v2Containers/Cap/constants.js

@@ -31,8 +31,7 @@ export const CLEAR_TOPBAR_MENU_DATA = 'creatives/cap/CLEAR_TOPBAR_MENU_DATA';
 export const CAMPAIGN_SETTINGS_URL = '/creatives/settings/message';
 export const ORG_SETTINGS_URL = '/org/index';
 export const HELP_URL = 'https://support.capillarytech.com/en/support/solutions/4000007853';
-export const LOYALTY_HELP_URL = 'https://support.capillarytech.com/en/support/solutions/97443';
 
-export const ORG_REFRESH_SEC = 10;
-export const ORG_CHANGED = 'ORG_CHANGED';
+export const ORG_REFRESH_SEC = 10; 
+export const ORG_CHANGED = 'ORG_CHANGED'; 
 

package/v2Containers/Cap/index.js

@@ -22,10 +22,11 @@ import { engagePlusPublicPath } from '../../config/path';
 import { GTM_TRACKING_ID, CREATIVES_UI_VIEW } from '../App/constants';
 import { makeSelectLocale } from '../../v2Containers/LanguageProvider/selectors';
 import {
+  HELP_URL,
   ORG_SETTINGS_URL,
   CAMPAIGN_SETTINGS_URL,
   ORG_REFRESH_SEC,
-  ORG_CHANGED,
+  ORG_CHANGED
 } from './constants';
 import './_cap.scss';
 
@@ -72,8 +73,6 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
   }
 
   componentWillMount() {
-    const { pathname } = this.props.location;
-    const parentModule = pathname.substring(pathname.lastIndexOf('/') + 1);
     this.props.actions.getUserData((userData) => {
       if (!userData.accessiblePermissions.includes(CREATIVES_UI_VIEW)) {
         this.setState({ isCreativesAccessible: false });
@@ -82,7 +81,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
       this.setDimensionData(userGtmData);
       gtm.push({...userGtmData, event: 'userAuthenticated'});
     });
-    this.props.actions.getTopbarMenuData(parentModule);
+    this.props.actions.getTopbarMenuData();
     if (this.props.Global.orgID !== undefined) {
       gtm.push({orgId: this.props.Global.orgID});
     }
@@ -102,7 +101,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
     }
     locale = this.getMappedLocale(locale);
     //locale = 'zh';
-
+    
     moment.locale(locale);
     window.addEventListener('storage', this.handleStorageChange, false);
     document.addEventListener(
@@ -168,7 +167,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
   tabOnloadEventHandler = () => {
     logNewTab();
   }
-
+  
   setDimensionData(userGtmData) {
     Object.values(userGtmData).forEach((value, index) => {
       GA.setCustomDimension({ [`dimension${index + 1}`]: value });
@@ -176,23 +175,23 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
   }
   getUserGtmData(props) {
     const selectedProps = props || this.props;
-    const { user: userData, orgID} = selectedProps?.Global || {};
+    const { user: userData,  orgID} = selectedProps?.Global || {};
     if (userData) {
       const {
         attributes: {
-          USERNAME: userName,
-          EMAIL: userEmail,
+          USERNAME : userName,
+          EMAIL : userEmail
         } = {},
-        proxyOrgList = [],
+        proxyOrgList =[],
         isCapUser,
         refID,
         orgName: userOrgName,
       } = userData;
-      const { orgName } = _.find(proxyOrgList, { orgID }) || {
+      const { orgName } = _.find(proxyOrgList, { orgID: orgID }) || {
         orgName: userOrgName,
       };
       const gtmData = {
-        isCapUser,
+        isCapUser: isCapUser,
         orgId: orgID,
         orgName,
         userId: refID,
@@ -273,7 +272,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
       refreshSeconds === ORG_REFRESH_SEC
     ) {
       const timer = setInterval(() => {
-        this.setState((prevState) => ({
+        this.setState(prevState => ({
           refreshSeconds: prevState.refreshSeconds - 1,
         }));
       }, 1000);
@@ -287,13 +286,13 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
 
   handleStorageChange = (e) => {
     const { oldValue, newValue } = e;
-    if (utilsHandleStorageChange(e, 'orgID')) {
+     if (utilsHandleStorageChange(e, 'orgID')) {
       const localStorageOrgInfo = { oldValue, newValue };
       this.setState({ showRefreshModal: true, localStorageOrgInfo });
     }
   };
 
-  getOrgNameFromId = (orgId) => {
+  getOrgNameFromId = orgId => {
     const {
       Global: {
         user: {
@@ -353,11 +352,11 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
   renderOrgChangeModal = () => {
     const { selectedOrgId, showOrgChangeModal } = this.state;
     const {
-      Global: {
+      Global: { 
       currentOrgDetails: { basic_details: { name: oldOrgName } = {} } = {},
       },
       intl: { formatMessage } = {},
-    } = this.props;
+    } = this.props; 
     const newOrgName = this.getOrgNameFromId(selectedOrgId);
     // some users do not have entry for their default org in proxyOrgList.
     // getOrgNameFromId returns back orgID if no matching entry is present in proxyOrgList
@@ -400,7 +399,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
     const type = this.props.location.query.type;
     const toastMessages = this.props.Global.messages;
     const { isCreativesAccessible, showOrgChangeModal, showRefreshModal } = this.state;
-
+    
     return (
       <CapWrapper>
         { this.props.loader.localeLoading || this.props.Global.fetching_userdata ?
@@ -426,6 +425,7 @@ export class Cap extends React.Component { // eslint-disable-line react/prefer-s
                   logout={this.logout}
                   settingsUrl={`${engagePlusPublicPath}${CAMPAIGN_SETTINGS_URL}`}
                   orgSettingsUrl={ORG_SETTINGS_URL}
+                  helpUrl={HELP_URL}
                   loggedIn={isLoggedIn}
                   topbarMenuData={topbarMenuDataOptions}
                   location={location}

package/v2Containers/Cap/messages.js

@@ -72,14 +72,6 @@ export default defineMessages({
     id: 'creatives.containersV2.incentive',
     defaultMessage: 'Incentive',
   },
-  "programs": {
-    id: `creatives.containersV2.programs`,
-    defaultMessage: 'Programs',
-  },
-  "promotions": {
-    id: `creatives.containersV2.promotions`,
-    defaultMessage: 'Promotions',
-  },
 
     //refresh due to org change messages
 

package/v2Containers/Cap/sagas.js

@@ -6,11 +6,7 @@ import * as LocalStorage from '../../services/localStorageApi';
 import * as types from './constants';
 import config from '../../config/app';
 //import pathConfig from '../../config/path';
-import {
-  getTopbarMenuDataValue,
-  getLoyaltyTopbarMenuDataValue,
-  LOYALTY,
-} from '../../v2Containers/App/constants';
+import { getTopbarMenuDataValue } from '../../v2Containers/App/constants';
 // import {makeSelectOrgId} from './selectors';
 
 function* authorize(user) {
@@ -110,8 +106,9 @@ export function* fetchUserInfo(option) {
 
 export function* fetchSchemaForEntity(queryParams) {
   try {
+    
     const result = yield call(Api.fetchSchemaForEntity, queryParams);
-
+    
     // const sidebar = result.response.sidebar;
     yield put({ type: types.GET_SCHEMA_FOR_ENTITY_SUCCESS, data: result.response, statusCode: result.status ? result.status.code : '', entityType: queryParams.queryParams.type });
   } catch (error) {
@@ -119,21 +116,11 @@ export function* fetchSchemaForEntity(queryParams) {
   }
 }
 
-const getTopbarData = (parentModule) => {
-  switch (parentModule) {
-    case LOYALTY:
-      return getLoyaltyTopbarMenuDataValue();
-    default:
-      return getTopbarMenuDataValue();
-  }
-};
-
-function* getTopbarMenuData(params) {
-  const {parentModule} = params;
+function* getTopbarMenuData() {
   try {
     yield put({
       type: types.GET_TOPBAR_MENU_DATA_SUCCESS,
-      data: getTopbarData(parentModule),
+      data: getTopbarMenuDataValue(),
     });
   } catch (error) {
     yield put({ type: types.GET_TOPBAR_MENU_DATA_FAILURE, error });
@@ -142,6 +129,7 @@ function* getTopbarMenuData(params) {
 
 
 function* watchFetchSchemaForEntity() {
+  
   const watcher = yield takeLatest(types.GET_SCHEMA_FOR_ENTITY_REQUEST, fetchSchemaForEntity);
   yield take(LOCATION_CHANGE);
   yield cancel(watcher);

package/v2Containers/CapFacebookPreview/constants.js

@@ -11,7 +11,3 @@ export const GENERATE_PREVIEW_FAILURE = 'app/CapFacebookPreview/GET_PREVIEW_FAIL
 
 export const CLEAR_PREVIEW = 'app/CapFacebookPreview/CLEAR_PREVIEW';
 
-export const PREVIEW_NOT_REQUESTED = "PreviewNotRequested";
-export const FETCH_PREVIEW_REQUESTED = "PreviewRequested";
-export const FETCH_PREVIEW_SUCCESS = "PreviewRequestSuccess";
-export const FETCH_PREVIEW_FAILURE = "PreviewRequestFailure";