cap-creatives-ui 8.0.280 → 8.0.321

package/app/v2Components/CommonTestAndPreview/tests/selectors.test.js

@@ -32,6 +32,12 @@ import {
   makeSelectUpdatePreviewErrors,
   makeSelectFetchPrefilledValuesError,
   makeSelectFetchPrefilledValuesErrors,
+  makeSelectSenderDetailsForChannel,
+  makeSelectSenderDetailsByChannel,
+  makeSelectWeCrmAccounts,
+  makeSelectIsLoadingSenderDetails,
+  makeSelectFetchSenderDetailsError,
+  makeSelectFetchWeCrmAccountsError,
 } from '../selectors';
 
 describe('CommonTestAndPreview Selectors', () => {
@@ -101,6 +107,19 @@ describe('CommonTestAndPreview Selectors', () => {
       fetchPrefilledValuesErrors: [
         { code: 7078, message: 'User profile not found' },
       ],
+      senderDetailsByChannel: {
+        SMS: [
+          { domainId: 1, domainName: 'SMS Domain', gsmSenders: [{ value: 'sender1' }] },
+        ],
+        EMAIL: [],
+        WHATSAPP: [],
+      },
+      wecrmAccounts: [
+        { name: 'WeCRM Account 1', sourceAccountIdentifier: 'waba-1' },
+      ],
+      isLoadingSenderDetails: false,
+      fetchSenderDetailsError: null,
+      fetchWeCrmAccountsError: null,
     },
   });
 
@@ -550,6 +569,133 @@ describe('CommonTestAndPreview Selectors', () => {
     });
   });
 
+  describe('makeSelectSenderDetailsForChannel', () => {
+    it('should select sender details for given channel as JS array', () => {
+      const selector = makeSelectSenderDetailsForChannel('SMS');
+      const result = selector(mockState);
+
+      expect(result).toBeDefined();
+      expect(Array.isArray(result)).toBe(true);
+      expect(result.length).toBe(1);
+      expect(result[0].domainName).toBe('SMS Domain');
+    });
+
+    it('should return empty array for channel with no data', () => {
+      const selector = makeSelectSenderDetailsForChannel('EMAIL');
+      const result = selector(mockState);
+
+      expect(result).toEqual([]);
+    });
+
+    it('should return empty array when substate or byChannel missing', () => {
+      const emptyState = fromJS({});
+      const selector = makeSelectSenderDetailsForChannel('SMS');
+      const result = selector(emptyState);
+
+      expect(result).toEqual([]);
+    });
+  });
+
+  describe('makeSelectSenderDetailsByChannel', () => {
+    it('should select senderDetailsByChannel and convert to JS object', () => {
+      const selector = makeSelectSenderDetailsByChannel();
+      const result = selector(mockState);
+
+      expect(result).toBeDefined();
+      expect(result.SMS).toBeDefined();
+      expect(Array.isArray(result.SMS)).toBe(true);
+      expect(result.SMS[0].domainName).toBe('SMS Domain');
+      expect(result.EMAIL).toEqual([]);
+      expect(result.WHATSAPP).toEqual([]);
+    });
+
+    it('should return empty object when domain is missing', () => {
+      const emptyState = fromJS({});
+      const selector = makeSelectSenderDetailsByChannel();
+      const result = selector(emptyState);
+
+      expect(result).toEqual({});
+    });
+  });
+
+  describe('makeSelectWeCrmAccounts', () => {
+    it('should select wecrmAccounts and convert to JS array', () => {
+      const selector = makeSelectWeCrmAccounts();
+      const result = selector(mockState);
+
+      expect(result).toBeDefined();
+      expect(Array.isArray(result)).toBe(true);
+      expect(result.length).toBe(1);
+      expect(result[0].name).toBe('WeCRM Account 1');
+      expect(result[0].sourceAccountIdentifier).toBe('waba-1');
+    });
+
+    it('should return empty array when wecrmAccounts is missing', () => {
+      const emptyState = fromJS({ commonTestAndPreview: {} });
+      const selector = makeSelectWeCrmAccounts();
+      const result = selector(emptyState);
+
+      expect(result).toEqual([]);
+    });
+  });
+
+  describe('makeSelectIsLoadingSenderDetails', () => {
+    it('should select isLoadingSenderDetails flag', () => {
+      const selector = makeSelectIsLoadingSenderDetails();
+      const result = selector(mockState);
+
+      expect(result).toBe(false);
+    });
+
+    it('should return true when loading', () => {
+      const loadingState = fromJS({
+        commonTestAndPreview: { isLoadingSenderDetails: true },
+      });
+      const selector = makeSelectIsLoadingSenderDetails();
+      const result = selector(loadingState);
+
+      expect(result).toBe(true);
+    });
+  });
+
+  describe('makeSelectFetchSenderDetailsError', () => {
+    it('should select fetchSenderDetailsError from state', () => {
+      const selector = makeSelectFetchSenderDetailsError();
+      const result = selector(mockState);
+
+      expect(result).toBeNull();
+    });
+
+    it('should return error when present', () => {
+      const errorState = fromJS({
+        commonTestAndPreview: { fetchSenderDetailsError: 'Sender fetch failed' },
+      });
+      const selector = makeSelectFetchSenderDetailsError();
+      const result = selector(errorState);
+
+      expect(result).toBe('Sender fetch failed');
+    });
+  });
+
+  describe('makeSelectFetchWeCrmAccountsError', () => {
+    it('should select fetchWeCrmAccountsError from state', () => {
+      const selector = makeSelectFetchWeCrmAccountsError();
+      const result = selector(mockState);
+
+      expect(result).toBeNull();
+    });
+
+    it('should return error when present', () => {
+      const errorState = fromJS({
+        commonTestAndPreview: { fetchWeCrmAccountsError: 'WeCRM fetch failed' },
+      });
+      const selector = makeSelectFetchWeCrmAccountsError();
+      const result = selector(errorState);
+
+      expect(result).toBe('WeCRM fetch failed');
+    });
+  });
+
   describe('Edge Cases', () => {
     it('should handle undefined state gracefully', () => {
       const selector = makeSelectCustomers();

package/app/v2Components/ErrorInfoNote/index.js

@@ -186,7 +186,6 @@ export const ErrorInfoNote = (props) => {
     errorMessages,
     onErrorClick,
     onClose,
-    isLiquidEnabled = true,
     intl,
     useLegacyDisplay = false, // Use simple list display instead of tabs (for BEE Editor)
   } = props;
@@ -205,6 +204,28 @@ export const ErrorInfoNote = (props) => {
   const isNotArray = !Array.isArray(rawLiquidErrors);
   const hasPlatformKeys = isObject && isNotArray && [ANDROID, IOS, GENERIC].some((key) => key in rawLiquidErrors);
 
+  // Hooks must execute on every render before any conditional return.
+  // Group into Errors (blocking) and Warnings (non-blocking)
+  const { errors: errorIssues, warnings: warningIssues } = useMemo(() => groupByErrorsAndWarnings(
+    Array.isArray(rawStandardErrors) ? rawStandardErrors : [],
+    Array.isArray(rawLiquidErrors) ? rawLiquidErrors : [],
+    Array.isArray(rawStandardWarnings) ? rawStandardWarnings : [],
+  ), [rawStandardErrors, rawLiquidErrors, rawStandardWarnings]);
+
+  const errorsCount = errorIssues?.length;
+  const warningsCount = warningIssues?.length;
+  const totalCount = errorsCount + warningsCount;
+  const hasLiquidErrors = Array.isArray(rawLiquidErrors) && rawLiquidErrors.length > 0;
+
+  // Default active tab: errors if any, else warnings
+  useEffect(() => {
+    if (errorsCount > 0) {
+      setActiveKey(ERROR_TAB_KEYS.ERRORS);
+    } else if (warningsCount > 0) {
+      setActiveKey(ERROR_TAB_KEYS.WARNINGS);
+    }
+  }, [errorsCount, warningsCount]);
+
   // For platform-specific errors or when useLegacyDisplay is true, use the legacy renderer
   if (hasPlatformKeys) {
     // Process errors for both platforms - they use the same structure but different platform parameters
@@ -230,7 +251,7 @@ export const ErrorInfoNote = (props) => {
     const standardErrors = Array.isArray(rawStandardErrors) ? rawStandardErrors : [];
     const liquidErrors = Array.isArray(rawLiquidErrors) ? rawLiquidErrors : [];
     const hasStandardErrors = standardErrors.length > 0;
-    const hasLiquidErrors = liquidErrors.length > 0 && isLiquidEnabled;
+    const hasLiquidErrors = liquidErrors.length > 0;
 
     if (!hasStandardErrors && !hasLiquidErrors) {
       return null;
@@ -256,27 +277,6 @@ export const ErrorInfoNote = (props) => {
     );
   }
 
-  // Group into Errors (blocking) and Warnings (non-blocking)
-  const { errors: errorIssues, warnings: warningIssues } = useMemo(() => groupByErrorsAndWarnings(
-    Array.isArray(rawStandardErrors) ? rawStandardErrors : [],
-    Array.isArray(rawLiquidErrors) ? rawLiquidErrors : [],
-    Array.isArray(rawStandardWarnings) ? rawStandardWarnings : [],
-  ), [rawStandardErrors, rawLiquidErrors, rawStandardWarnings]);
-
-  const errorsCount = errorIssues.length;
-  const warningsCount = warningIssues.length;
-  const totalCount = errorsCount + warningsCount;
-  const hasLiquidErrors = Array.isArray(rawLiquidErrors) && rawLiquidErrors.length > 0;
-
-  // Default active tab: errors if any, else warnings
-  useEffect(() => {
-    if (errorsCount > 0) {
-      setActiveKey(ERROR_TAB_KEYS.ERRORS);
-    } else if (warningsCount > 0) {
-      setActiveKey(ERROR_TAB_KEYS.WARNINGS);
-    }
-  }, [errorsCount, warningsCount]);
-
   // Handle close
   const handleClose = () => {
     setIsDismissed(true);
@@ -357,7 +357,7 @@ export const ErrorInfoNote = (props) => {
           className="error-info-note__tabs"
         />
         <CapRow className="error-info-note__actions">
-          {hasLiquidErrors && isLiquidEnabled && (
+          {hasLiquidErrors && (
             <CapButton
               type="flat"
               className="error-info-note__liquid-doc"
@@ -452,7 +452,6 @@ ErrorInfoNote.defaultProps = {
   },
   onErrorClick: null,
   onClose: null,
-  isLiquidEnabled: true,
   intl: null,
   useLegacyDisplay: false, // Use simple list display for BEE Editor
 };
@@ -479,7 +478,6 @@ ErrorInfoNote.propTypes = {
   }),
   onErrorClick: PropTypes.func,
   onClose: PropTypes.func,
-  isLiquidEnabled: PropTypes.bool,
   intl: PropTypes.object,
   useLegacyDisplay: PropTypes.bool, // Use simple list display for BEE Editor
 };