@capillarytech/creatives-library 1.0.1-alpha.0 → 1.0.2

package/components/organisms/CustomerActivity/CustomerActivity.js

@@ -28,14 +28,12 @@ import withErrorBoundary from 'utils/withErrorBoundary';
 import * as globalConstants from '../../pages/Cap/constants';
 import { sorterHandler } from '../LoyaltyDetail/utils';
 import TriggerAction from '../../atoms/TriggerAction';
-import messages, { scope } from './messages';
-import globalMessages from '../../pages/Cap/messages';
+import messages from './messages';
 import styles from './style';
-import * as selectors from '../../pages/Cap/selectors';
+import * as selectors from '../ConfigureWorkflows/selectors';
 import * as actions from '../ConfigureWorkflows/actions';
 import { RADIO_BUTTON, EVENT_NAME, CATEGORY } from './constants';
 import { REQUEST, SORT_STR } from '../../pages/App/constants';
-import { apiMessageFormatHandler } from '../../../utils/commonUtils';
 
 import group from '../../../assets/group.svg';
 import removeCart from '../../../assets/removeCart.svg';
@@ -53,19 +51,17 @@ import addUser from '../../../assets/addUser.svg';
 import removeUser from '../../../assets/removeUser.svg';
 import calendar from '../../../assets/calendar.svg';
 import contribute from '../../../assets/contribute.svg';
-import pointsConversion from '../../../assets/pointsConversion.svg';
 
 const { makeSelectCustomerActivity } = selectors;
 const { DESCEND, ASCEND } = globalConstants;
 
-export const CustomerActivity = ({
+const CustomerActivity = ({
   intl: { formatMessage },
   className,
-  capWorkflowData: { getCustomerActivityStatus, customerActivity = [] },
+  workflowData: { getCustomerActivityStatus, customerActivity = [] },
   eventType,
   setEventType,
   fleetLoyaltyEnabled,
-  isDisabled = false,
 }) => {
   const [localSave, setLocalSave] = useState(eventType);
   const [localCategory, setLocalCategory] = useState('');
@@ -91,9 +87,7 @@ export const CustomerActivity = ({
   };
 
   const handleOnFocus = () => {
-    if (!isDisabled) {
-      setShowSlideBox(true);
-    }
+    setShowSlideBox(true);
   };
 
   //modifiedDataSource is used for passing it in tableProps for table rendering. There is no actual conversion of the structure.
@@ -201,8 +195,6 @@ export const CustomerActivity = ({
         return calendar;
       case 'contribute':
         return contribute;
-      case 'rewards':
-        return pointsConversion;
       default:
         return group;
     }
@@ -217,22 +209,13 @@ export const CustomerActivity = ({
     const activityKey = customerActivity?.['key'];
     const nameMessageKey = `ca_${activityKey}_name`;
     const descMessageKey = `ca_${activityKey}_description`;
-
-    const activityId = `${scope}.${nameMessageKey}`;
-    const descId = `${scope}.${descMessageKey}`;
-
     const displayName = messages[nameMessageKey]
-      ? apiMessageFormatHandler(activityId, activityKey)
+      ? formatMessage(messages[nameMessageKey])
       : customerActivity?.[dataKey];
     const displayDescription = messages[descMessageKey]
       ? formatMessage(messages[descMessageKey])
       : customerActivity?.[dataValue];
 
-    const trimmedCategory = customerActivity?.[dataKey]?.replace(/\s/g, '');
-    const displayCategory = messages[`ca_${trimmedCategory}_category`]
-      ? formatMessage(messages[`ca_${trimmedCategory}_category`])
-      : customerActivity?.[dataKey];
-
     switch (columnType) {
       case RADIO_BUTTON:
         return (
@@ -240,11 +223,8 @@ export const CustomerActivity = ({
             value={customerActivity?.[dataKey]}
             checked={localSave === customerActivity?.[dataKey]}
             onClick={onChange}
-            name={customerActivity?.[dataKey]}
-            aria-label={customerActivity?.[dataKey]}
           />
         );
-
       case EVENT_NAME:
         return (
           <CapHeader
@@ -268,7 +248,7 @@ export const CustomerActivity = ({
               <CapHeading
                 type="h6"
                 className="customer-activity-condition-name-text margin-left-text truncate-text"
-                title={displayDescription}
+                title={customerActivity?.[dataValue]}
               >
                 {displayDescription}
               </CapHeading>
@@ -286,7 +266,7 @@ export const CustomerActivity = ({
                   type="h5"
                   className="customer-activity-condition-name-text fill-text-color truncate-text"
                 >
-                  {displayCategory}
+                  {customerActivity?.[dataKey]}
                 </CapHeading>
               }
             />
@@ -316,7 +296,7 @@ export const CustomerActivity = ({
     key: dataKey + index,
     width: width,
     render: (text, customerActivity) =>
-      getColumnByType(columnType, customerActivity, dataKey, dataValue),
+      getColumnByType(columnType, customerActivity, dataKey, dataValue, icon),
     ...(sortColumnName
       ? {
           sortDirections: [DESCEND, ASCEND],
@@ -331,37 +311,18 @@ export const CustomerActivity = ({
       (filterCustomerGroupActivities(customerActivity) || []).map(
         cActivity => cActivity.category,
       ),
-    ).map(category => {
-      const trimmedCategory = category?.replace(/\s/g, '');
-      const categoryKey = `ca_${trimmedCategory}_category`;
-
-      const displayCategoryName = messages[categoryKey]
-        ? formatMessage(messages[categoryKey])
-        : category;
-
-      return {
-        title: displayCategoryName,
-        value: category,
-        key: category,
-      };
-    });
+    ).map(category => ({
+      title: category,
+      value: category,
+      key: category,
+    }));
 
   const filterCustomerGroupActivities = customerActivity =>
-    (customerActivity || [])
-      .filter(
-        activity =>
-          !(fleetLoyaltyEnabled && activity?.category === 'Customer Group'),
-      )
-      .sort(
-        (a, b) =>
-          (a?.category || '').toLowerCase() > (b?.category || '').toLowerCase()
-            ? -1
-            : (b?.category || '').toLowerCase() >
-              (a?.category || '').toLowerCase()
-              ? 1
-              : 0,
-      );
-
+    customerActivity.filter(activity => {
+      if (fleetLoyaltyEnabled && activity.category === 'Customer Group')
+        return false;
+      return true;
+    });
   const getColumns = () =>
     columns.map((columnData, index) => getColumnProps(columnData, index));
 
@@ -402,12 +363,6 @@ export const CustomerActivity = ({
             placeholder={formatMessage(messages.category)}
             onSelect={handleFilterValueChange}
             appliedKeys={filterValue}
-            closeText={formatMessage(globalMessages.close)}
-            selectedText={formatMessage(globalMessages.selected)}
-            selectAllText={formatMessage(globalMessages.selectAll)}
-            selectText={formatMessage(globalMessages.select)}
-            searchPlaceholder={formatMessage(globalMessages.search)}
-            noResultsFoundText={formatMessage(globalMessages.noResultsFound)}
           />
         </CapColumn>
       </CapRow>
@@ -417,7 +372,7 @@ export const CustomerActivity = ({
 
   const slideBoxFooter = (
     <TriggerAction
-      title={formatMessage(globalMessages.saveAndContinue)}
+      title={formatMessage(messages.saveAndContinue)}
       triggerAction={saveSlidebox}
       isDisabled={isSaveDisabled}
       className="lp-btn-config-select-customer-activity"
@@ -426,12 +381,9 @@ export const CustomerActivity = ({
 
   const slideBoxHeader = (
     <CapHeader
-      className="customer-activity-wrapper"
       size="regular"
       title={
-        <CapHeading type="h2">
-          {formatMessage(globalMessages.customerActivityPlaceholder)}
-        </CapHeading>
+        <CapHeading type="h2">{formatMessage(messages.header)}</CapHeading>
       }
       description={
         <CapHeading type="h6" className="customer-activity-header-description">
@@ -441,15 +393,15 @@ export const CustomerActivity = ({
     />
   );
 
+
+
   return (
     <CapRow className={className}>
       <CapInput
         onClick={handleOnFocus}
-        value={eventType && messages[`ca_${eventType}_key`] ? formatMessage(messages[`ca_${eventType}_key`]) : eventType}
+        value={eventType}
         suffix={<CapIcon type="chevron-right" onClick={handleOnFocus}/>}
         className={classnames('customer-activity-input', 'pointer-cursor')}
-        disabled={isDisabled}
-        placeholder={formatMessage(globalMessages.customerActivityPlaceholder)}
       />
       <CapColumn>
         <CapSlideBox
@@ -473,7 +425,6 @@ CustomerActivity.propTypes = {
   saveSlidebox: PropTypes.func,
   isSaveDisabled: PropTypes.bool,
   fleetLoyaltyEnabled: PropTypes.bool,
-  isDisabled: PropTypes.bool,
 };
 
 CustomerActivity.defaultProps = {
@@ -483,7 +434,7 @@ CustomerActivity.defaultProps = {
 };
 
 const mapStateToProps = createStructuredSelector({
-  capWorkflowData: makeSelectCustomerActivity(),
+  workflowData: makeSelectCustomerActivity(),
 });
 
 function mapDispatchToProps(dispatch) {

package/components/organisms/CustomerActivity/messages.js

@@ -9,9 +9,17 @@ import { defineMessages } from 'react-intl';
 export const scope = 'loyaltyPlus.components.organisms.CustomerActivity';
 
 export default defineMessages({
+  header: {
+    id: `${scope}.header`,
+    defaultMessage: 'Select customer activity',
+  },
   headerDesc: {
     id: `${scope}.headerDesc`,
-    defaultMessage: 'Select the activity which the customer performs',
+    defaultMessage: 'Select an action which the customer performs',
+  },
+  saveAndContinue: {
+    id: `${scope}.saveAndContinue`,
+    defaultMessage: 'Save & Continue',
   },
   noCustomerActivity: {
     id: `${scope}.noCustomerActivity`,
@@ -87,264 +95,8 @@ export default defineMessages({
     defaultMessage:
       "Customer transfers points from their account to another customer's account.",
   },
-  ca_CustomerRegistration_name: {
-    id: `${scope}.ca_CustomerRegistration_name`,
-    defaultMessage: 'Gets enrolled in the program',
-  },
-  ca_CustomerRegistration_description: {
-    id: `${scope}.ca_CustomerRegistration_description`,
-    defaultMessage:
-      'Customer performs the first activity and becomes a part of the program.',
-  },
-  ca_CustomerUpdate_name: {
-    id: `${scope}.ca_CustomerUpdate_name`,
-    defaultMessage: 'Updates customer profile',
-  },
-  ca_CustomerUpdate_description: {
-    id: `${scope}.ca_CustomerUpdate_description`,
-    defaultMessage: 'Customer profile gets updated.',
-  },
-  ca_SlabUpgrade_name: {
-    id: `${scope}.ca_SlabUpgrade_name`,
-    defaultMessage: 'Tier gets upgraded',
-  },
-  ca_SlabUpgrade_description: {
-    id: `${scope}.ca_SlabUpgrade_description`,
-    defaultMessage:
-      'System triggered event when the tier of a customer gets upgraded due to any other activity.',
-  },
-  ca_VoucherRedemption_name: {
-    id: `${scope}.ca_VoucherRedemption_name`,
-    defaultMessage: 'Redeems a coupon',
-  },
-  ca_VoucherRedemption_description: {
-    id: `${scope}.ca_VoucherRedemption_description`,
-    defaultMessage: 'Customer redeems a coupon.',
-  },
-  ca_PartnerProgramLinking_name: {
-    id: `${scope}.ca_PartnerProgramLinking_name`,
-    defaultMessage: 'Gets linked to a partner program',
-  },
-  ca_PartnerProgramLinking_description: {
-    id: `${scope}.ca_PartnerProgramLinking_description`,
-    defaultMessage:
-      'Customer get linked to any of the defined partner or supplementary programs.',
-  },
-  ca_PartnerProgramDeLinking_name: {
-    id: `${scope}.ca_PartnerProgramDeLinking_name`,
-    defaultMessage: 'Gets delinked from a partner program',
-  },
-  ca_PartnerProgramDeLinking_description: {
-    id: `${scope}.ca_PartnerProgramDeLinking_description`,
-    defaultMessage:
-      'Customer get delinked from any of the defined partner or supplementary programs.',
-  },
-  ca_PartnerProgramTierUpdate_name: {
-    id: `${scope}.ca_PartnerProgramTierUpdate_name`,
-    defaultMessage: 'Tier is updated in a partner program',
-  },
-  ca_PartnerProgramTierUpdate_description: {
-    id: `${scope}.ca_PartnerProgramTierUpdate_description`,
-    defaultMessage:
-      'Tier of the customer in a linked partner program gets updated.',
-  },
-  ca_GroupTransactionAdd_name: {
-    id: `${scope}.ca_GroupTransactionAdd_name`,
-    defaultMessage: 'Secondary member makes a transaction',
-  },
-  ca_GroupTransactionAdd_description: {
-    id: `${scope}.ca_GroupTransactionAdd_description`,
-    defaultMessage:
-      'Secondary member of a user group makes a transaction. The actions defined here will impact the primary member.',
-  },
-  ca_GroupTransactionUpdate_name: {
-    id: `${scope}.ca_GroupTransactionUpdate_name`,
-    defaultMessage: 'Secondary member updates a transaction',
-  },
-  ca_GroupTransactionUpdate_description: {
-    id: `${scope}.ca_GroupTransactionUpdate_description`,
-    defaultMessage:
-      'When a previously made transaction of a secondary member gets updated. The actions defined here will impact the primary member.',
-  },
-  ca_GroupReturnBill_name: {
-    id: `${scope}.ca_GroupReturnBill_name`,
-    defaultMessage: 'Secondary member returns a transaction',
-  },
-  ca_GroupReturnBill_description: {
-    id: `${scope}.ca_GroupReturnBill_description`,
-    defaultMessage:
-      'Secondary member of a user group returns a previously made transaction. The actions defined here will impact the primary member.',
-  },
-  ca_GroupMemberJoin_name: {
-    id: `${scope}.ca_GroupMemberJoin_name`,
-    defaultMessage: 'Secondary member joins a user group',
-  },
-  ca_GroupMemberJoin_description: {
-    id: `${scope}.ca_GroupMemberJoin_description`,
-    defaultMessage:
-      'Customer gets added to an existing user group as a secondary member.',
-  },
-  ca_GroupMemberLeave_name: {
-    id: `${scope}.ca_GroupMemberLeave_name`,
-    defaultMessage: 'Secondary member leaves a user group',
-  },
-  ca_GroupMemberLeave_description: {
-    id: `${scope}.ca_GroupMemberLeave_description`,
-    defaultMessage:
-      'Customer gets removed from an existing user group as a secondary member.',
-  },
-  ca_PointsContributionToGroup_name: {
-    id: `${scope}.ca_PointsContributionToGroup_name`,
-    defaultMessage: 'Secondary member contributes points to user group',
-  },
-  ca_PointsContributionToGroup_description: {
-    id: `${scope}.ca_PointsContributionToGroup_description`,
-    defaultMessage:
-      'System triggered event that can be used to define communications to both primary and secondary members when an action causes points to be awarded to primary member based on the activities of the secondary member.',
-  },
-  ca_TargetCompleted_name: {
-    id: `${scope}.ca_TargetCompleted_name`,
-    defaultMessage: 'Milestone or Streak is updated',
-  },
-  ca_TargetCompleted_description: {
-    id: `${scope}.ca_TargetCompleted_description`,
-    defaultMessage:
-      'Whenever a user achieves any type of milestone or streak, this customer activity will be initiated.',
-  },
-  ca_ConvertPointsToReward_name: {
-    id: `${scope}.ca_ConvertPointsToReward_name`,
-    defaultMessage: 'Points conversion to rewards',
-  },
-  ca_ConvertPointsToReward_description: {
-    id: `${scope}.ca_ConvertPointsToReward_description`,
-    defaultMessage: 'Automate conversion of points to catalog rewards',
-  },
   searchEvent: {
     id: `${scope}.searchEvent`,
     defaultMessage: 'Search events',
   },
-  ca_Transactional_category: {
-    id: `${scope}.ca_Transactional_category`,
-    defaultMessage: 'Transactional',
-  },
-  ca_TargetLoyalty_category: {
-    id: `${scope}.ca_TargetLoyalty_category`,
-    defaultMessage: 'Target Loyalty',
-  },
-  ca_PartnerPrograms_category: {
-    id: `${scope}.ca_PartnerPrograms_category`,
-    defaultMessage: 'Partner Programs',
-  },
-  ca_Incentive_category: {
-    id: `${scope}.ca_Incentive_category`,
-    defaultMessage: 'Incentive',
-  },
-  ca_CustomerProfile_category: {
-    id: `${scope}.ca_CustomerProfile_category`,
-    defaultMessage: 'Customer Profile',
-  },
-  ca_CustomerGroup_category: {
-    id: `${scope}.ca_CustomerGroup_category`,
-    defaultMessage: 'Customer Group',
-  },
-  ca_Social_category: {
-    id: `${scope}.ca_Social_category`,
-    defaultMessage: 'Social',
-  },
-  ca_Behavioural_category: {
-    id: `${scope}.ca_Behavioural_category`,
-    defaultMessage: 'Behavioural',
-  },
-  ca_TransactionAdd_key: {
-    id: `${scope}.ca_TransactionAdd_key`,
-    defaultMessage: 'TransactionAdd',
-  },
-  ca_PointsRedemption_key: {
-    id: `${scope}.ca_PointsRedemption_key`,
-    defaultMessage: 'PointsRedemption',
-  },
-  ca_ReturnBill_key: {
-    id: `${scope}.ca_ReturnBill_key`,
-    defaultMessage: 'ReturnBill',
-  },
-  ca_TransactionUpdate_key: {
-    id: `${scope}.ca_TransactionUpdate_key`,
-    defaultMessage: 'TransactionUpdate',
-  },
-  ca_PointsRedemptionReversal_key: {
-    id: `${scope}.ca_PointsRedemptionReversal_key`,
-    defaultMessage: 'PointsRedemptionReversal',
-  },
-  ca_DelayedAccrual_key: {
-    id: `${scope}.ca_DelayedAccrual_key`,
-    defaultMessage: 'DelayedAccrual',
-  },
-  ca_PointsTransfer_key: {
-    id: `${scope}.ca_PointsTransfer_key`,
-    defaultMessage: 'PointsTransfer',
-  },
-  ca_CustomerRegistration_key: {
-    id: `${scope}.ca_CustomerRegistration_key`,
-    defaultMessage: 'CustomerRegistration',
-  },
-  ca_CustomerUpdate_key: {
-    id: `${scope}.ca_CustomerUpdate_key`,
-    defaultMessage: 'CustomerUpdate',
-  },
-  ca_SlabUpgrade_key: {
-    id: `${scope}.ca_SlabUpgrade_key`,
-    defaultMessage: 'SlabUpgrade',
-  },
-  ca_VoucherRedemption_key: {
-    id: `${scope}.ca_VoucherRedemption_key`,
-    defaultMessage: 'VoucherRedemption',
-  },
-  ca_PartnerProgramLinking_key: {
-    id: `${scope}.ca_PartnerProgramLinking_key`,
-    defaultMessage: 'PartnerProgramLinking',
-  },
-  ca_PartnerProgramDeLinking_key: {
-    id: `${scope}.ca_PartnerProgramDeLinking_key`,
-    defaultMessage: 'PartnerProgramDeLinking',
-  },
-  ca_PartnerProgramTierUpdate_key: {
-    id: `${scope}.ca_PartnerProgramTierUpdate_key`,
-    defaultMessage: 'PartnerProgramTierUpdate',
-  },
-  ca_GroupTransactionAdd_key: {
-    id: `${scope}.ca_GroupTransactionAdd_key`,
-    defaultMessage: 'GroupTransactionAdd',
-  },
-  ca_GroupTransactionUpdate_key: {
-    id: `${scope}.ca_GroupTransactionUpdate_key`,
-    defaultMessage: 'GroupTransactionUpdate',
-  },
-  ca_GroupReturnBill_key: {
-    id: `${scope}.ca_GroupReturnBill_key`,
-    defaultMessage: 'GroupReturnBill',
-  },
-  ca_GroupMemberJoin_key: {
-    id: `${scope}.ca_GroupMemberJoin_key`,
-    defaultMessage: 'GroupMemberJoin',
-  },
-  ca_GroupMemberLeave_key: {
-    id: `${scope}.ca_GroupMemberLeave_key`,
-    defaultMessage: 'GroupMemberLeave',
-  },
-  ca_PointsContributionToGroup_key: {
-    id: `${scope}.ca_PointsContributionToGroup_key`,
-    defaultMessage: 'PointsContributionToGroup',
-  },
-  ca_TargetCompleted_key: {
-    id: `${scope}.ca_TargetCompleted_key`,
-    defaultMessage: 'TargetCompleted',
-  },
-  ca_SocialConnect_key: {
-    id: `${scope}.ca_SocialConnect_key`,
-    defaultMessage: 'SocialConnect',
-  },
-  ca_ConvertPointsToReward_key: {
-    id: `${scope}.ca_ConvertPointsToReward_key`,
-    defaultMessage: 'ConvertPointsToReward',
-  },
 });

package/components/organisms/CustomerActivity/style.js

@@ -17,7 +17,7 @@ export default css`
     max-width: 400px;
   }
   .customer-activity-input {
-    width: 23.286rem;
+    width: 270px;
     .ant-input:hover {
       cursor: pointer;
     }
@@ -84,9 +84,4 @@ export default css`
       margin-left: ${CAP_SPACE_08};
     }
   }
-  .customer-activity-wrapper {
-    .cap-header-v2-description {
-      max-width: 28.571rem !important;
-    }
-  }
 `;