@capillarytech/creatives-library 8.0.309 → 8.0.310

package/v2Components/CommonTestAndPreview/index.js

@@ -17,9 +17,6 @@ import CapIcon from '@capillarytech/cap-ui-library/CapIcon';
 import CapHeader from '@capillarytech/cap-ui-library/CapHeader';
 import CapDivider from '@capillarytech/cap-ui-library/CapDivider';
 import CapNotification from '@capillarytech/cap-ui-library/CapNotification';
-import CapSpin from '@capillarytech/cap-ui-library/CapSpin';
-import CustomerCreationModal from './CustomerCreationModal';
-import { createTestCustomer } from '../../services/api';
 
 // Import messages and styles
 import messages from './messages';
@@ -30,16 +27,10 @@ import LeftPanelContent from './LeftPanelContent';
 import CustomValuesEditor from './CustomValuesEditor';
 import SendTestMessage from './SendTestMessage';
 import PreviewSection from './PreviewSection';
-import AddTestCustomerButton from './AddTestCustomer';
-import ExistingCustomerModal from './ExistingCustomerModal';
+
 // Import constants
 import {
   CHANNELS,
-  CUSTOMER_MODAL_NEW,
-  CUSTOMER_MODAL_EXISTING,
-  IDENTIFIER_TYPE_EMAIL,
-  IDENTIFIER_TYPE_MOBILE,
-  IDENTIFIER_TYPE_PHONE,
   TEST,
   DESKTOP,
   ANDROID,
@@ -83,8 +74,6 @@ import {
 
 // Import utilities
 import { getCdnUrl } from '../../utils/cdnTransformation';
-import { isValidEmail, isValidMobile } from '../../utils/commonUtils';
-import { getMembersLookup } from '../../services/api';
 
 /**
  * Preview Component Factory - REMOVED IN PHASE 5
@@ -141,11 +130,6 @@ const CommonTestAndPreview = (props) => {
   const [customValues, setCustomValues] = useState({});
   const [showJSON, setShowJSON] = useState(false);
   const [tagsExtracted, setTagsExtracted] = useState(false);
-  const [searchValue, setSearchValue] = useState("");
-  const [customerModal, setCustomerModal] = useState([false, ""]);
-  const [isCustomerDataLoading, setIsCustomerDataLoading] = useState(false);
-  const [customerData, setCustomerData] = useState({ name: '', email: '', mobile: '', customerId: '' });
-
   // Initialize device based on channel: SMS uses Android/iOS, others use Desktop/Mobile
   // Initialize device based on channel: SMS, WhatsApp, RCS, InApp, MobilePush, and Viber use Android/iOS, others use Desktop/Mobile
   const initialDevice = (channel === CHANNELS.SMS || channel === CHANNELS.WHATSAPP || channel === CHANNELS.RCS || channel === CHANNELS.INAPP || channel === CHANNELS.MOBILEPUSH || channel === CHANNELS.VIBER) ? ANDROID : DESKTOP;
@@ -364,7 +348,7 @@ const CommonTestAndPreview = (props) => {
     return content || '';
   }, [channel, formData, currentTab, beeContent, content, beeInstance]);
 
-  // Build test entities tree data from testCustomers prop (includes customers added via addTestCustomer action)
+  // Build test entities tree data
   const testEntitiesTreeData = useMemo(() => {
     const groupsNode = {
       title: 'Groups',
@@ -377,10 +361,7 @@ const CommonTestAndPreview = (props) => {
       title: 'Individuals',
       value: 'customers-node',
       selectable: false,
-      children: testCustomers?.map((customer) => ({
-        title: customer?.name?.trim() || customer?.email?.trim() || customer?.mobile?.trim() || customer?.userId || customer?.customerId,
-        value: customer?.userId ?? customer?.customerId,
-      })) || [],
+      children: testCustomers?.map((customer) => ({ title: customer.name, value: customer?.userId })),
     };
 
     return [groupsNode, customersNode];
@@ -410,13 +391,15 @@ const CommonTestAndPreview = (props) => {
   /**
    * Common handler for saving test customers (both new and existing)
    */
-  const handleSaveTestCustomer = async (validationErrors = {},setIsLoading = () => {}) => {
+  const handleSaveTestCustomer = async (validationErrors = {},setIsLoading) => {
     // Check for validation errors before saving (for new customers)
     if (customerModal[1] === CUSTOMER_MODAL_NEW && (validationErrors.email || validationErrors.mobile)) {
       return;
     }
 
-    setIsLoading(true);
+    if (typeof setIsLoading === 'function') {
+      setIsLoading(true);
+    }
     
     try {
       let payload;
@@ -2576,6 +2559,7 @@ const CommonTestAndPreview = (props) => {
    * Handle extract tags
    */
   const handleExtractTags = () => {
+    // Get content based on channel
     let contentToExtract = getCurrentContent;
 
     if (channel === CHANNELS.EMAIL && formData) {
@@ -2676,10 +2660,7 @@ const CommonTestAndPreview = (props) => {
 
       if (!success) {
         const errorMessage = response?.message || response?.status?.message || formatMessage(messages.memberLookupError);
-        CapNotification.error({
-          message: formatMessage(messages.memberLookupError),
-          description: errorMessage,
-        });
+        CapNotification.error({ title: formatMessage(messages.errorTitle), message: errorMessage });
         return;
       }
 
@@ -2713,7 +2694,6 @@ const CommonTestAndPreview = (props) => {
     } catch {
       CapNotification.error({
         message: formatMessage(messages.memberLookupError),
-        description: formatMessage(messages.memberLookupError),
       });
     } finally {
       setIsCustomerDataLoading(false);
@@ -2838,7 +2818,6 @@ const CommonTestAndPreview = (props) => {
       content={getCurrentContent}
       channel={channel}
       isSendingTestMessage={isSendingTestMessage}
-      renderAddTestCustomerButton={renderAddTestCustomerButton}
       formatMessage={formatMessage}
       deliverySettings={testPreviewDeliverySettings[channel]}
       senderDetailsOptions={senderDetailsByChannel[channel]}
@@ -2847,8 +2826,6 @@ const CommonTestAndPreview = (props) => {
       isLoadingSenderDetails={isLoadingSenderDetails}
       smsTraiDltEnabled={smsTraiDltEnabled}
       registeredSenderIds={registeredSenderIds}
-      searchValue={searchValue}
-      setSearchValue={setSearchValue}
     />
   );
 
@@ -2858,20 +2835,6 @@ const CommonTestAndPreview = (props) => {
     />
   );
 
-  const renderAddTestCustomerButton = () => {
-    const value = searchValue || "";
-    const showAddButton =
-      [CHANNELS.EMAIL, CHANNELS.SMS].includes(channel) &&
-      (channel === CHANNELS.EMAIL ? isValidEmail(value) : isValidMobile(value));
-    if (!showAddButton) return null;
-    return (
-      <AddTestCustomerButton
-        searchValue={value}
-        handleAddTestCustomer={handleAddTestCustomer}
-      />
-    );
-  };
-
   // Header content for the slidebox
   const slideboxHeader = (
     <CapRow className="test-preview-header">
@@ -2891,18 +2854,14 @@ const CommonTestAndPreview = (props) => {
       show={show}
       size="size-xl"
       content={(
-        <CapSpin
-          spinning={isCustomerDataLoading}
-          className={`common-test-preview-lookup-spin ${isCustomerDataLoading ? 'common-test-preview-customer-loading' : ''}`}
-        >
-          <CapRow className="test-preview-container">
-            <CapRow className="test-and-preview-panels">
-              {/* Left Panel */}
-              <CapRow className="left-panel">
-                {channel === CHANNELS.ZALO ? null : renderLeftPanelContent()}
-                <CapDivider className="panel-divider" />
-
-                {/* Send Test Message Section */}
+        <CapRow className="test-preview-container">
+          <CapRow className="test-and-preview-panels">
+            {/* Left Panel */}
+            <CapRow className="left-panel">
+              {channel === CHANNELS.ZALO ? null : renderLeftPanelContent()}
+              <CapDivider className="panel-divider" />
+
+              {/* Send Test Message Section */}
               {config.enableTestMessage !== false && (
                 <CapRow className="panel-section send-test-section">
                   {renderSendTestMessage()}
@@ -2916,27 +2875,7 @@ const CommonTestAndPreview = (props) => {
               {renderPreview()}
             </CapRow>
           </CapRow>
-          {customerModal[0] && customerModal[1] === CUSTOMER_MODAL_EXISTING && (
-            <ExistingCustomerModal
-              customerData={customerData}
-              setCustomerModal={setCustomerModal}
-              customerModal={customerModal}
-              channel={channel}
-              onSave={handleSaveTestCustomer}
-            />
-          )}
-          {customerModal[0] && customerModal[1] === CUSTOMER_MODAL_NEW && (
-            <CustomerCreationModal
-              customerData={customerData}
-              setCustomerData={setCustomerData}
-              setCustomerModal={setCustomerModal}
-              customerModal={customerModal}
-              onSave={handleSaveTestCustomer}
-              channel={channel}
-            />
-          )}
-          </CapRow>
-        </CapSpin>
+        </CapRow>
       )}
     />
   );
@@ -3038,4 +2977,4 @@ CommonTestAndPreview.defaultProps = {
 // Note: Redux connection is handled by the wrapper components (e.g., TestAndPreviewSlidebox)
 // This component receives all Redux props (including intl) from its parent
 
-export default CommonTestAndPreview;
+export default CommonTestAndPreview;

package/v2Components/CommonTestAndPreview/messages.js

@@ -8,72 +8,10 @@ import { defineMessages } from 'react-intl';
 export const scope = 'app.v2Components.TestAndPreviewSlidebox';
 
 export default defineMessages({
-  mobileAlreadyExists: {
-    id: `${scope}.mobileAlreadyExists`,
-    defaultMessage: 'This phone number matches with already existing user profile. Please remove or use a different number.',
-  },
-  customerNamePlaceholder: {
-    id: `${scope}.customerNamePlaceholder`,
-    defaultMessage: 'Enter the name',
-  },
-  customerEmailPlaceholder: {
-    id: `${scope}.customerEmailPlaceholder`,
-    defaultMessage: 'Enter the Email',
-  },
-  customerMobilePlaceholder: {
-    id: `${scope}.customerMobilePlaceholder`,
-    defaultMessage: 'Enter the Mobile Number',
-  },
-  customerAlreadyInTestList: {
-    id: `${scope}.customerAlreadyInTestList`,
-    defaultMessage: 'This customer is already in the test customers list.',
-  },
-  emailAlreadyExists: {
-    id: `${scope}.emailAlreadyExists`,
-    defaultMessage: 'This email matches with already existing user profile. Please remove or use a different email.',
-  },
-  customerName: {
-    id: `${scope}.customerName`,
-    defaultMessage: 'Name',
-  },
-  customerEmail: {
-    id: `${scope}.customerEmail`,
-    defaultMessage: 'Email',
-  },
-  customerMobile: {
-    id: `${scope}.customerMobileNumber`,
-    defaultMessage: 'Mobile Number',
-  },
-  saveButton: {
-    id: `${scope}.saveButton`,
-    defaultMessage: 'Save',
-  },
-  cancelButton: {
-    id: `${scope}.cancelButton`,
-    defaultMessage: 'Cancel',
-  },
-  customerID: {
-    id: `${scope}.customerID`,
-    defaultMessage: 'Customer ID',
-  },
-  existingCustomerModalDescription: {
-    id: `${scope}.existingCustomerModalDescription`,
-    defaultMessage: 'This user profile already exists in the system. Would you like to add them to Test Customer list?'
-  },
-
-  customerCreationModalTitle: {
-    id: `${scope}.customerCreationModalTitle`,
-    defaultMessage: 'Add new test customer',
-  },
-  customerCreationModalDescription: {
-    id: `${scope}.customerCreationModalDescription`,
-    defaultMessage: 'This customer profile will be available for testing across multiple communication channels.',
-  },
   testAndPreviewHeader: {
     id: `${scope}.testAndPreviewHeader`,
     defaultMessage: 'Preview and Test',
   },
-
   customerSearchTitle: {
     id: `${scope}.customerSearchTitle`,
     defaultMessage: 'Customer',
@@ -94,34 +32,6 @@ export default defineMessages({
     id: `${scope}.showJSON`,
     defaultMessage: 'Show JSON',
   },
-  addTestCustomer: {
-    id: `${scope}.addTestCustomer`,
-    defaultMessage: 'Add as Test Customer',
-  },
-  addTestCustomerWithValue: {
-    id: `${scope}.addTestCustomerWithValue`,
-    defaultMessage: 'Add {searchValue} as Test Customer',
-  },
-  memberLookupError: {
-    id: `${scope}.memberLookupError`,
-    defaultMessage: 'Unable to look up customer. Please try again.',
-  },
-  newTestCustomerAddedSuccess: {
-    id: `${scope}.newTestCustomerAddedSuccess`,
-    defaultMessage: 'New test customer added successfully!',
-  },
-  errorTitle: {
-    id: `${scope}.errorTitle`,
-    defaultMessage: 'Error',
-  },
-  failedToAddTestCustomer: {
-    id: `${scope}.failedToAddTestCustomer`,
-    defaultMessage: 'Failed to add test customer',
-  },
-  errorAddingTestCustomer: {
-    id: `${scope}.errorAddingTestCustomer`,
-    defaultMessage: 'An error occurred while adding test customer',
-  },
   discardCustomValues: {
     id: `${scope}.discardCustomValues`,
     defaultMessage: 'Discard custom values',
@@ -210,10 +120,6 @@ export default defineMessages({
     id: `${scope}.testCustomersPlaceholder`,
     defaultMessage: 'Search and select a group or individual test customers',
   },
-  noMatchingOptions: {
-    id: `${scope}.noMatchingOptions`,
-    defaultMessage: 'No matching options',
-  },
   updatingPreview: {
     id: `${scope}.updatingPreview`,
     defaultMessage: 'Updating preview with the latest changes',

package/v2Components/CommonTestAndPreview/reducer.js

@@ -20,7 +20,6 @@ import {
   GET_TEST_CUSTOMERS_REQUESTED,
   GET_TEST_CUSTOMERS_SUCCESS,
   GET_TEST_CUSTOMERS_FAILURE,
-  ADD_TEST_CUSTOMER,
   GET_TEST_GROUPS_REQUESTED,
   GET_TEST_GROUPS_SUCCESS,
   GET_TEST_GROUPS_FAILURE,
@@ -217,15 +216,6 @@ const previewAndTestReducer = (state = initialState, action) => {
       return state.set('isFetchingTestCustomers', false)
         .set('fetchTestCustomersError', action.payload.error);
 
-    case ADD_TEST_CUSTOMER: {
-      const raw = state.get('testCustomers');
-      const list = Array.isArray(raw) ? raw : (raw && raw.toArray ? raw.toArray().map((i) => (i && i.toJS ? i.toJS() : i)) : []);
-      const customer = action.payload.customer;
-      const newId = customer.userId || customer.customerId;
-      if (list.some((c) => (c.userId || c.customerId) === newId)) return state;
-      return state.set('testCustomers', list.concat([customer]));
-    }
-
     // Test Groups
     case GET_TEST_GROUPS_REQUESTED:
       return state.set('isFetchingTestGroups', true)

package/v2Components/CommonTestAndPreview/tests/SendTestMessage.test.js

@@ -135,10 +135,6 @@ describe('SendTestMessage', () => {
     isLoadingSenderDetails: false,
     smsTraiDltEnabled: false,
     registeredSenderIds: [],
-    channel: 'EMAIL',
-    renderAddTestCustomerButton: jest.fn(() => null),
-    searchValue: '',
-    setSearchValue: jest.fn(),
   };
 
   beforeEach(() => {
@@ -637,53 +633,4 @@ describe('SendTestMessage', () => {
       consoleSpy.mockRestore();
     });
   });
-
-  describe('notFoundContent (Add as test customer)', () => {
-    it('should call renderAddTestCustomerButton and use result as notFoundContent', () => {
-      const renderAddTestCustomerButton = jest.fn(() => (
-        <button type="button" data-testid="add-test-customer-btn">
-          Add as test customer
-        </button>
-      ));
-      const props = {
-        ...defaultProps,
-        renderAddTestCustomerButton,
-      };
-      render(
-        <TestWrapper>
-          <SendTestMessage {...props} />
-        </TestWrapper>
-      );
-      expect(renderAddTestCustomerButton).toHaveBeenCalled();
-    });
-
-    it('should render notFoundContent as a clickable button when provided', () => {
-      const onAddClick = jest.fn();
-      const renderAddTestCustomerButton = jest.fn(() => (
-        <button type="button" data-testid="add-test-customer-btn" onClick={onAddClick}>
-          Add as test customer
-        </button>
-      ));
-      const props = {
-        ...defaultProps,
-        renderAddTestCustomerButton,
-      };
-      const { container } = render(
-        <TestWrapper>
-          <SendTestMessage {...props} />
-        </TestWrapper>
-      );
-      // notFoundContent is passed to TreeSelect and shown when dropdown is open with no match.
-      // We assert the render function returns a button that can be clicked.
-      const notFoundContent = renderAddTestCustomerButton.mock.results[0]?.value;
-      expect(notFoundContent).toBeTruthy();
-      expect(notFoundContent.props['data-testid']).toBe('add-test-customer-btn');
-      expect(notFoundContent.type).toBe('button');
-      // Simulate click on the returned element's onClick
-      if (notFoundContent.props.onClick) {
-        notFoundContent.props.onClick();
-        expect(onAddClick).toHaveBeenCalled();
-      }
-    });
-  });
 });

package/v2Components/CommonTestAndPreview/tests/constants.test.js

@@ -54,13 +54,8 @@ import {
   // API Channel Constants
   API_CHANNEL_PUSH,
   // Identifier Type Constants
-  IDENTIFIER_TYPE_EMAIL,
   IDENTIFIER_TYPE_MOBILE,
-  IDENTIFIER_TYPE_PHONE,
-  INPUT_HAS_ERROR_CLASS,
-  // Validation Regex
-  EMAIL_REGEX,
-  PHONE_REGEX,
+  IDENTIFIER_TYPE_EMAIL,
   // Channel Name Constants
   CHANNEL_NAME_INAPP,
   // Channel Mapping Constants
@@ -211,31 +206,6 @@ describe('CommonTestAndPreview Constants', () => {
     });
   });
 
-  describe('Identifier Type Constants', () => {
-    it('should export identifier type constants', () => {
-      expect(IDENTIFIER_TYPE_EMAIL).toBe('email');
-      expect(IDENTIFIER_TYPE_MOBILE).toBe('mobile');
-      expect(IDENTIFIER_TYPE_PHONE).toBe('phone');
-    });
-  });
-
-  describe('Validation Regex', () => {
-    it('should export EMAIL_REGEX that validates email format', () => {
-      expect(EMAIL_REGEX.test('user@example.com')).toBe(true);
-      expect(EMAIL_REGEX.test('invalid')).toBe(false);
-    });
-    it('should export PHONE_REGEX that validates phone format', () => {
-      expect(PHONE_REGEX.test('9123456789')).toBe(true);
-      expect(PHONE_REGEX.test('123')).toBe(false);
-    });
-  });
-
-  describe('Input has error class', () => {
-    it('should export INPUT_HAS_ERROR_CLASS', () => {
-      expect(INPUT_HAS_ERROR_CLASS).toBe(' has-input-error');
-    });
-  });
-
   describe('Channel Name Constants', () => {
     it('should export channel name constants', () => {
       expect(CHANNEL_NAME_INAPP).toBe('INAPP');

package/v2Components/CommonTestAndPreview/tests/index.test.js

@@ -81,12 +81,6 @@ jest.mock('../../../utils/cdnTransformation', () => ({
   getCdnUrl: jest.fn(({ url }) => `cdn_${url}`),
 }));
 
-// Mock services/api for add test customer flow
-jest.mock('../../../services/api', () => ({
-  getMembersLookup: jest.fn(),
-  createTestCustomer: jest.fn(),
-}));
-
 // Mock messages - using actual message IDs from messages.js
 const mockMessages = {
   'app.v2Components.TestAndPreviewSlidebox.testAndPreviewHeader': { defaultMessage: 'Preview and Test' },
@@ -132,7 +126,6 @@ describe('CommonTestAndPreview', () => {
     clearPreviewErrors: jest.fn(),
     getSenderDetailsRequested: jest.fn(),
     getWeCrmAccountsRequested: jest.fn(),
-    addTestCustomer: jest.fn(),
   };
 
   const defaultProps = {
@@ -1585,35 +1578,6 @@ describe('CommonTestAndPreview', () => {
 
       expect(screen.getByTestId('send-test-message')).toBeTruthy();
     });
-
-    it('should show error notification when sendTestMessageRequested callback receives false', async () => {
-      const CapNotification = require('@capillarytech/cap-ui-library/CapNotification');
-      mockActions.createMessageMetaRequested.mockImplementation((payload, metaId, cb) => {
-        if (cb) cb({ entity: 'meta-123' });
-      });
-      mockActions.sendTestMessageRequested.mockImplementation((payload, cb) => {
-        if (cb) cb(false);
-      });
-      const props = {
-        ...defaultProps,
-        selectedTestEntities: ['user-1'],
-        testGroups: [],
-      };
-
-      render(
-        <TestWrapper>
-          <CommonTestAndPreview {...props} />
-        </TestWrapper>
-      );
-
-      expect(lastSendTestMessageProps).toBeTruthy();
-      expect(lastSendTestMessageProps.handleSendTestMessage).toBeDefined();
-      lastSendTestMessageProps.handleSendTestMessage();
-
-      await waitFor(() => {
-        expect(CapNotification.error).toHaveBeenCalled();
-      });
-    });
   });
 
   describe('Content Extraction', () => {

package/v2Components/CommonTestAndPreview/tests/reducer.test.js

@@ -24,7 +24,6 @@ import {
   GET_TEST_CUSTOMERS_REQUESTED,
   GET_TEST_CUSTOMERS_SUCCESS,
   GET_TEST_CUSTOMERS_FAILURE,
-  ADD_TEST_CUSTOMER,
   GET_TEST_GROUPS_REQUESTED,
   GET_TEST_GROUPS_SUCCESS,
   GET_TEST_GROUPS_FAILURE,
@@ -612,76 +611,6 @@ describe('previewAndTestReducer', () => {
     });
   });
 
-  describe('ADD_TEST_CUSTOMER', () => {
-    it('should add new customer to testCustomers list', () => {
-      const customer = {
-        userId: 'cust-1',
-        customerId: 'cust-1',
-        name: 'John',
-        email: 'john@example.com',
-        mobile: '',
-      };
-      const action = {
-        type: ADD_TEST_CUSTOMER,
-        payload: { customer },
-      };
-      const result = previewAndTestReducer(initialState, action);
-
-      const list = result.get('testCustomers');
-      expect(Array.isArray(list) ? list.length : list.size).toBe(1);
-      const first = Array.isArray(list) ? list[0] : list.get(0);
-      const id = first.userId != null ? first.userId : first.get('userId');
-      const name = first.name != null ? first.name : first.get('name');
-      expect(id).toBe('cust-1');
-      expect(name).toBe('John');
-    });
-
-    it('should not add duplicate customer when userId already in list', () => {
-      const existing = fromJS([
-        { userId: 'cust-1', customerId: 'cust-1', name: 'John', email: 'john@example.com', mobile: '' },
-      ]);
-      const stateWithCustomer = initialState.set('testCustomers', existing);
-      const customer = {
-        userId: 'cust-1',
-        customerId: 'cust-1',
-        name: 'John Updated',
-        email: 'john@example.com',
-        mobile: '',
-      };
-      const action = {
-        type: ADD_TEST_CUSTOMER,
-        payload: { customer },
-      };
-      const result = previewAndTestReducer(stateWithCustomer, action);
-
-      const list = result.get('testCustomers');
-      expect(Array.isArray(list) ? list.length : list.size).toBe(1);
-      const first = Array.isArray(list) ? list[0] : list.get(0);
-      const name = first.name != null ? first.name : first.get('name');
-      expect(name).toBe('John');
-    });
-
-    it('should use customerId when userId is missing', () => {
-      const customer = {
-        customerId: 'cust-2',
-        name: 'Jane',
-        email: 'jane@example.com',
-        mobile: '',
-      };
-      const action = {
-        type: ADD_TEST_CUSTOMER,
-        payload: { customer },
-      };
-      const result = previewAndTestReducer(initialState, action);
-
-      const list = result.get('testCustomers');
-      expect(Array.isArray(list) ? list.length : list.size).toBe(1);
-      const first = Array.isArray(list) ? list[0] : list.get(0);
-      const id = first.customerId != null ? first.customerId : first.get('customerId');
-      expect(id).toBe('cust-2');
-    });
-  });
-
   describe('GET_TEST_GROUPS_REQUESTED', () => {
     it('should set fetching flag and clear error', () => {
       const action = { type: GET_TEST_GROUPS_REQUESTED };