@capillarytech/creatives-library 8.0.328 → 8.0.330-alpha.0

package/v2Components/CommonTestAndPreview/messages.js

@@ -8,10 +8,84 @@ 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',
+  },
+  customerNameOptional: {
+    id: `${scope}.customerNameOptional`,
+    defaultMessage: '(Optional)',
+  },
+  customerCreationInvalidEmail: {
+    id: `${scope}.customerCreationInvalidEmail`,
+    defaultMessage: 'Please enter a valid email address',
+  },
+  customerCreationInvalidMobile: {
+    id: `${scope}.customerCreationInvalidMobile`,
+    defaultMessage: 'Please enter a valid mobile number',
+  },
+  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',
@@ -46,6 +120,34 @@ 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',
@@ -150,6 +252,10 @@ 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,6 +20,7 @@ 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,
@@ -216,6 +217,15 @@ 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/AddTestCustomer.test.js

@@ -0,0 +1,66 @@
+/**
+ * Tests for AddTestCustomerButton Component
+ *
+ * The parent (index.js) only renders this button when channel is EMAIL/SMS and value is valid.
+ * This component always renders the button when mounted; visibility is the parent's responsibility.
+ */
+
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
+import { IntlProvider } from 'react-intl';
+import AddTestCustomerButton from '../AddTestCustomer';
+
+const mockMessages = {
+  'app.v2Components.TestAndPreviewSlidebox.addTestCustomerWithValue': 'Add {searchValue} as Test Customer',
+};
+
+const TestWrapper = ({ children }) => (
+  <IntlProvider locale="en" messages={mockMessages}>
+    {children}
+  </IntlProvider>
+);
+
+describe('AddTestCustomerButton', () => {
+  const defaultProps = {
+    searchValue: 'user@example.com',
+    handleAddTestCustomer: jest.fn(),
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should render button with searchValue in message', () => {
+    render(
+      <TestWrapper>
+        <AddTestCustomerButton {...defaultProps} />
+      </TestWrapper>
+    );
+    const button = screen.getByRole('button', { name: /add.*test customer/i });
+    expect(button).toBeTruthy();
+  });
+
+  it('should show searchValue in button text', () => {
+    render(
+      <TestWrapper>
+        <AddTestCustomerButton {...defaultProps} searchValue="user@example.com" />
+      </TestWrapper>
+    );
+    expect(screen.getByRole('button', { name: /user@example.com/i })).toBeTruthy();
+  });
+
+  it('should call handleAddTestCustomer when button is clicked', () => {
+    const handleAddTestCustomer = jest.fn();
+    render(
+      <TestWrapper>
+        <AddTestCustomerButton
+          searchValue="user@example.com"
+          handleAddTestCustomer={handleAddTestCustomer}
+        />
+      </TestWrapper>
+    );
+    const button = screen.getByRole('button', { name: /add.*test customer/i });
+    fireEvent.click(button);
+    expect(handleAddTestCustomer).toHaveBeenCalledTimes(1);
+  });
+});