@capillarytech/creatives-library 8.0.114-alpha.1 → 8.0.114

package/utils/tests/tagValidations.test.js

@@ -1,15 +1,6 @@
+import React from 'react';
 import '@testing-library/jest-dom';
-import {
-  checkSupport,
-  extractNames,
-  getTagMapValue,
-  getForwardedMapValues,
-  preprocessHtml,
-  validateIfTagClosed,
-  validateTags,
-  skipTags,
-  isInsideLiquidBlock,
-} from '../tagValidations';
+import { checkSupport, extractNames, getTagMapValue,getForwardedMapValues, preprocessHtml, validateIfTagClosed,validateTags, skipTags } from '../tagValidations';
 import { eventContextTags } from '../../v2Containers/TagList/tests/mockdata';
 
 describe("check if curly brackets are balanced", () => {
@@ -815,82 +806,4 @@ describe('getForwardedMapValues', () => {
 
     expect(input).toEqual(inputCopy);
   });
-});
-
-describe('isInsideLiquidBlock', () => {
-  it('returns true for index inside a single block', () => {
-    const content = 'Hello {% assign foo = 1 %} World';
-    // Index of 'a' in 'assign' inside the block
-    const tagIndex = content.indexOf('assign');
-    expect(isInsideLiquidBlock(content, tagIndex)).toBe(true);
-  });
-
-  it('returns false for index outside any block', () => {
-    const content = 'Hello {% assign foo = 1 %} World';
-    // Index of 'H' in 'Hello'
-    expect(isInsideLiquidBlock(content, 0)).toBe(false);
-    // Index of 'W' in 'World'
-    expect(isInsideLiquidBlock(content, content.indexOf('World'))).toBe(false);
-  });
-
-  it('returns true for index at the start of a block', () => {
-    const content = 'Hello {% assign foo = 1 %} World';
-    // Index of '{' in '{%'
-    const tagIndex = content.indexOf('{%');
-    expect(isInsideLiquidBlock(content, tagIndex)).toBe(true);
-  });
-
-  it('returns false for index at the end of a block (exclusive)', () => {
-    const content = 'Hello {% assign foo = 1 %} World';
-    // Index just after the closing '%}'
-    const blockEnd = content.indexOf('%}') + 2;
-    expect(isInsideLiquidBlock(content, blockEnd)).toBe(false);
-  });
-
-  it('returns true for index inside the second of multiple blocks', () => {
-    const content = 'A {% first %} B {% second %} C';
-    const tagIndex = content.indexOf('second');
-    expect(isInsideLiquidBlock(content, tagIndex)).toBe(true);
-  });
-
-  it('returns false for index between blocks', () => {
-    const content = 'A {% first %} B {% second %} C';
-    // Index of 'B' (between blocks)
-    const tagIndex = content.indexOf('B');
-    expect(isInsideLiquidBlock(content, tagIndex)).toBe(false);
-  });
-
-  it('returns false for empty string', () => {
-    expect(isInsideLiquidBlock('', 0)).toBe(false);
-  });
-
-  it('returns false if there are no blocks', () => {
-    const content = 'Just some text with no blocks';
-    expect(isInsideLiquidBlock(content, 5)).toBe(false);
-  });
-
-  it('returns false for negative index', () => {
-    const content = 'Hello {% assign foo = 1 %} World';
-    expect(isInsideLiquidBlock(content, -1)).toBe(false);
-  });
-
-  it('returns false for index beyond string length', () => {
-    const content = 'Hello {% assign foo = 1 %} World';
-    expect(isInsideLiquidBlock(content, 100)).toBe(false);
-  });
-
-  it('works for nested-like blocks (not truly nested)', () => {
-    const content = 'A {% outer {% inner %} outer %} B';
-    // Index of 'inner' (should be inside the first block)
-    const tagIndex = content.indexOf('inner');
-    expect(isInsideLiquidBlock(content, tagIndex)).toBe(true);
-  });
-
-  it('returns true for index at last char inside block', () => {
-    const content = 'A {% foo %} B';
-    // Index of last char inside block (just before %})
-    const blockStart = content.indexOf('{%');
-    const blockEnd = content.indexOf('%}');
-    expect(isInsideLiquidBlock(content, blockEnd - 1)).toBe(true);
-  });
 });

package/v2Components/ErrorInfoNote/index.js

@@ -9,25 +9,19 @@ import {
   FormattedMessage,
   FormattedNumber,
   injectIntl,
+  intlShape,
 } from "react-intl";
 import "./style.scss";
 import messages from "./messages";
-import { processErrors } from "./utils";
-import ErrorTypeRenderer from "./ErrorTypeRenderer";
-import { ANDROID, GENERIC, IOS } from "../../v2Containers/CreativesContainer/constants";
 
-const ErrorSection = ({
-  title,
-  errors,
-  liquidError,
-  platformLabel,
-}) => (
-  <>
-    {title && (
+export const ErrorInfoNote = (props) => {
+
+  const { LIQUID_ERROR_MSG = [], STANDARD_ERROR_MSG = [] } = props?.errorMessages || {};
+
+  const ErrorSection = ({ title = "", errors = [], liquidError = false }) => (
+    <>
       <CapRow
-        className={`error-header ${
-          !liquidError ? "standard-error-header" : ""
-        }`}
+        className={`error-header ${!liquidError ? "standard-error-header": ""}`}
       >
         <>
           <CapIcon size="s" type="warning" className="warning-icon" />
@@ -38,7 +32,8 @@ const ErrorSection = ({
             <CapButton
               type="flat"
               className="add-btn"
-              onClick={() => window.open("https://docs.capillarytech.com/docs/liquid-language-in-messages", "_blank")
+              onClick={() =>
+                window.open(`https://docs.capillarytech.com/docs/liquid-language-in-messages`, "_blank")
               }
             >
               <FormattedMessage {...messages.liquidDoc} />
@@ -47,111 +42,48 @@ const ErrorSection = ({
           )}
         </>
       </CapRow>
-    )}
-    {platformLabel && (
-      <CapRow className="error-header-sub-title">
-        <CapLabel type="label2">{platformLabel}</CapLabel>
-      </CapRow>
-    )}
-    <CapList
-      className="error-list"
-      size="small"
-      dataSource={errors}
-      renderItem={(error, index) => (
-        <CapList.Item>
-          <CapLabel type="label2" className="cap-list-v2-error-item">
-            <CapLabel type="label2">
-              <FormattedNumber value={index + 1} />.
+      <CapList
+        className="error-list"
+        size="small"
+        dataSource={errors}
+        renderItem={(error, index) => (
+          <CapList.Item>
+            <CapLabel type="label2" className="cap-list-v2-error-item">
+              <CapLabel type="label2"><FormattedNumber value={index + 1} />.</CapLabel>
+              <CapLabel type="label2">{error}</CapLabel> 
             </CapLabel>
-            <CapLabel type="label2">{error}</CapLabel>
-          </CapLabel>
-        </CapList.Item>
-      )}
-    />
-  </>
-);
-
-ErrorSection.propTypes = {
-  title: PropTypes.node.isRequired,
-  errors: PropTypes.array,
-  liquidError: PropTypes.bool,
-  platformLabel: PropTypes.string,
-};
-
-ErrorSection.defaultProps = {
-  errors: [],
-  liquidError: false,
-  platformLabel: null,
-};
-
-export const ErrorInfoNote = (props) => {
-  const { errorMessages } = props;
-
-  const {
-    LIQUID_ERROR_MSG: rawLiquidErrors = [],
-    STANDARD_ERROR_MSG: rawStandardErrors = [],
-  } = errorMessages || {};
-
-  // Detect if platform-specific (ANDROID/IOS) or GENERIC
-  const isObject = typeof rawStandardErrors === 'object' && rawStandardErrors !== null;
-  const isNotArray = !Array.isArray(rawStandardErrors);
-  const hasPlatformKeys = isObject && isNotArray && [ANDROID, IOS, GENERIC].some((key) => key in rawStandardErrors);
-
-  if (hasPlatformKeys) {
-    // Platform-specific
-    const androidErrors = {
-      standard: processErrors(rawStandardErrors, 'standard', ANDROID, messages),
-      liquid: processErrors(rawLiquidErrors, 'liquid', ANDROID, messages),
-    };
-    const iosErrors = {
-      standard: processErrors(rawStandardErrors, 'standard', IOS, messages),
-      liquid: processErrors(rawLiquidErrors, 'liquid', IOS, messages),
-    };
-    return (
-      <ErrorTypeRenderer
-        androidErrors={androidErrors}
-        iosErrors={iosErrors}
-        ErrorSectionComponent={ErrorSection}
+          </CapList.Item>
+        )}
       />
-    );
-  }
-  // GENERIC (not platform-specific)
-  const genericStandard = processErrors(rawStandardErrors, 'standard', null, messages);
-  const genericLiquid = processErrors(rawLiquidErrors, 'liquid', null, messages);
+    </>
+  );
+  const liquidErrors = LIQUID_ERROR_MSG?.length;
   return (
-    <ErrorTypeRenderer
-      genericErrors={{ standard: genericStandard, liquid: genericLiquid }}
-      ErrorSectionComponent={ErrorSection}
-    />
+    <div className="error-container">
+      {STANDARD_ERROR_MSG?.length > 0 && (
+        <>
+          <ErrorSection
+            title={
+              <FormattedMessage {...messages.standardErrorHeader} />
+            }
+            errors={STANDARD_ERROR_MSG}
+          />
+        </>
+      )}
+      {liquidErrors > 0 && (
+        <ErrorSection
+          title={<FormattedMessage {...messages.dynamicErrorHeader} />}
+          errors={LIQUID_ERROR_MSG}
+          liquidError={true}
+        />
+      )}
+    </div>
   );
 };
-
-ErrorInfoNote.defaultProps = {
-  errorMessages: {
-    LIQUID_ERROR_MSG: [],
-    STANDARD_ERROR_MSG: [],
-  },
-};
-
 ErrorInfoNote.propTypes = {
-  errorMessages: PropTypes.shape({
-    LIQUID_ERROR_MSG: PropTypes.oneOfType([
-      PropTypes.array,
-      PropTypes.shape({
-        ANDROID: PropTypes.array,
-        IOS: PropTypes.array,
-        GENERIC: PropTypes.array,
-      }),
-    ]),
-    STANDARD_ERROR_MSG: PropTypes.oneOfType([
-      PropTypes.array,
-      PropTypes.shape({
-        ANDROID: PropTypes.array,
-        IOS: PropTypes.array,
-        GENERIC: PropTypes.array,
-      }),
-    ]),
-  }),
+  errorMessage: PropTypes.string,
+  errorType: PropTypes.string,
+  intl: intlShape.isRequired,
 };
 
 export default injectIntl(ErrorInfoNote);

package/v2Components/ErrorInfoNote/messages.js

@@ -26,29 +26,4 @@ export default defineMessages({
     defaultMessage:
       "Aira can make mistakes. Please verify the suggestions before applying them"
   },
-  liquidDocLink: {
-    id: `${scope}.liquidDocLink`,
-    defaultMessage:
-      "https://docs.capillarytech.com/docs/liquid-language-in-messages"
-  },
-  androidDynamicErrorHeader: {
-    id: `${scope}.androidDynamicErrorHeader`,
-    defaultMessage:
-      "Errors found in Android Dynamic Tags"
-  },
-  iosDynamicErrorHeader: {
-    id: `${scope}.iosDynamicErrorHeader`,
-    defaultMessage:
-      "Errors found in iOS Dynamic Tags"
-  },
-  androidStandardErrorHeader: {
-    id: `${scope}.androidStandardErrorHeader`,
-    defaultMessage:
-      "Errors found in Android Standard Tags"
-  },
-  iosStandardErrorHeader: {
-    id: `${scope}.iosStandardErrorHeader`,
-    defaultMessage:
-      "Errors found in iOS Standard Tags"
-  },
 });

package/v2Components/ErrorInfoNote/style.scss

@@ -58,28 +58,15 @@
     gap: $CAP_SPACE_04;
   }
 }
-
 .liquid-divider {
-  &.ant-divider.cap-divider-v2 {
+  &.ant-divider.cap-divider-v2{
     background: $FONT_COLOR_04;
   }
   margin: $CAP_SPACE_08 0;
 }
 
-.platform-divider {
-  &.ant-divider.cap-divider-v2 {
-    background: $FONT_COLOR_04;
-    margin: $CAP_SPACE_12 0;
-  }
-}
-
 .aria-error-footer {
   display: flex;
   align-items: center;
   gap: $CAP_SPACE_04;
-}
-
-.error-header-sub-title {
-  margin-left: $CAP_SPACE_04;
-  font-weight: 500;
 }