@capillarytech/creatives-library 7.12.25 → 7.12.27

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "7.12.25",
+  "version": "7.12.27",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/v2Components/CapActionButton/index.js

@@ -32,11 +32,11 @@ export const CapActionButton = (props) => {
   const onButtonTextChange = (e) => {
     const val = e.target.value;
     setButtonText(val);
-    updateButtonChange([{
+    updateButtonChange({
       type,
       text: val,
       url: buttonLink,
-    }]);
+    });
   };
 
   const onButtonLinkChange = (e) => {
@@ -45,13 +45,14 @@ export const CapActionButton = (props) => {
     let errorMessage = false;
     if (!isUrl(val)) {
       errorMessage = formatMessage(messages.inValidUrlErrorMessage);
-    } else {
-      updateButtonChange([{
-        type,
-        text: buttonText,
-        url: val,
-      }]);
     }
+    updateButtonChange({
+      type,
+      text: buttonText,
+      url: val,
+      error: errorMessage,
+    });
+
     updateButtonURLErrorMessage(errorMessage);
   };
 

package/v2Components/CapActionButton/tests/__snapshots__/index.test.js.snap

@@ -76,81 +76,6 @@ exports[`CapActionButton test Test if CapActionButton component renders 1`] = `
 `;
 
 exports[`CapActionButton test Test if CapActionButton component renders 2`] = `
-<CapRow
-  className="cap-action-button"
->
-  <CapHeading
-    type="h4"
-  >
-    <FormattedMessage
-      defaultMessage="Button text"
-      id="creatives.componentsV2.CapActionButton.templateButtonText"
-      values={Object {}}
-    />
-  </CapHeading>
-  <_class
-    id="rcs-template-Button-Text"
-    labelPosition="top"
-    maxLength={200}
-    onChange={[Function]}
-    placeholder="Enter button text"
-    size="default"
-    suffix={
-      <CapLabel
-        type="label1"
-      >
-        9 / 200
-      </CapLabel>
-    }
-    value="testValue"
-  />
-  <CapHeading
-    style={
-      Object {
-        "paddingTop": "20px",
-      }
-    }
-    type="h4"
-  >
-    <FormattedMessage
-      defaultMessage="Button link"
-      id="creatives.componentsV2.CapActionButton.templateButtonLink"
-      values={Object {}}
-    />
-  </CapHeading>
-  <_class
-    errorMessage="Button URL is not valid"
-    id="rcs-template-Button-link"
-    labelPosition="top"
-    onChange={[Function]}
-    placeholder="Enter button link"
-    size="default"
-    value="testValue"
-  />
-  <CapDivider
-    style={
-      Object {
-        "marginBottom": 16,
-        "marginTop": 23,
-      }
-    }
-  />
-  <CapTooltip
-    placement="topLeft"
-    title="Not enabled yet. Coming soon!"
-  >
-    <CapButton
-      className="disabled-button"
-      isAddBtn={true}
-      type="flat"
-    >
-      Add button
-    </CapButton>
-  </CapTooltip>
-</CapRow>
-`;
-
-exports[`CapActionButton test Test if CapActionButton component renders 3`] = `
 <CapRow
   className="cap-action-button"
 >

package/v2Containers/Rcs/index.js

@@ -133,6 +133,7 @@ export const Rcs = (props) => {
   const [dltPreviewData, setDltPreviewData] = useState('');
   const [suggestions, setSuggestions] = useState([]);
   const [buttonType, setButtonType] = useState('');
+  const [suggestionError, setSuggestionError] = useState(true);
   const mediaRadioOptions = [
     {
       value: RCS_MEDIA_TYPES.NONE,
@@ -167,8 +168,15 @@ export const Rcs = (props) => {
     }
     }
 `;
-  const updateButtonChange = (val) => {
-    setSuggestions(val);
+  const updateButtonChange = (data) => {
+    const {
+      type,
+      text,
+      url,
+      error,
+  } = data;
+    setSuggestions([{type, text, url}]);
+    setSuggestionError(error);
   };
   const RcsLabel = styled.div`
     display: flex;
@@ -249,7 +257,8 @@ export const Rcs = (props) => {
       setEditFlow(true);
       if (rcsSuggestions.length > 0) {
         setSuggestions(rcsSuggestions);
-        setButtonType(CTA);
+        setButtonType([CTA]);
+        setSuggestionError(false);
       }
 
       // for DLT Fallback message
@@ -1004,7 +1013,7 @@ export const Rcs = (props) => {
 
     // if call to action (Button text & link) is not added
     const {text, url} = suggestions[0] || {};
-    if (buttonType.includes(CTA) && !(text && url) ) {
+    if (buttonType.includes(CTA) && !(text && url && !suggestionError ) ) {
       return true;
     }
     if (templateDescError || fallbackMessageError) {