@capillarytech/creatives-library 8.0.168 → 8.0.170-beta.1

package/v2Containers/Rcs/index.js

@@ -111,7 +111,7 @@ export const Rcs = (props) => {
     isDltEnabled,
     smsRegister,
     selectedOfferDetails,
-    currentOrgDetails
+    currentOrgDetails,
   } = props || {};
   const { formatMessage } = intl;
   const { TextArea } = CapInput;
@@ -189,6 +189,76 @@ export const Rcs = (props) => {
     display: flex;
     margin-top: 20px;
   `;
+
+  // tag Code start from here
+  useEffect(() => {
+    if (!showDltContainer) {
+      //fetching tags
+      const { type, module } = location.query || {};
+      const isEmbedded = type === EMBEDDED;
+      const context = isEmbedded ? module : DEFAULT;
+      const embedded = isEmbedded ? type : FULL;
+      const query = {
+        layout: SMS,
+        type: TAG,
+        context,
+        embedded,
+      };
+      if (getDefaultTags) {
+        query.context = getDefaultTags;
+      }
+      globalActions.fetchSchemaForEntity(query);
+    }
+  }, [showDltContainer]);
+
+  useEffect(() => {
+    let tag = get(metaEntities, `tags.standard`, []);
+    const { type, module } = location.query || {};
+    if (type === EMBEDDED && module === LIBRARY && !getDefaultTags) {
+      tag = supportedTags;
+    }
+    updateTags(tag);
+  }, [metaEntities]);
+
+  const handleOnTagsContextChange = (data) => {
+    const { type } = location.query || {};
+    const tempData = (data || '').toLowerCase();
+    const isEmbedded = type === EMBEDDED;
+    const embedded = isEmbedded ? type : FULL;
+    const context = tempData === ALL ? DEFAULT : tempData;
+    const query = {
+      layout: SMS,
+      type: TAG,
+      context,
+      embedded,
+    };
+    globalActions.fetchSchemaForEntity(query);
+  };
+
+  const onTagSelect = (data) => {
+    const tempMsg = `${templateDesc}{{${data}}}`;
+    const error = templateDescErrorHandler(tempMsg);
+    setTemplateDesc(tempMsg);
+    setTemplateDescError(error);
+  };
+
+  const onTagSelectFallback = (data) => {
+    const tempMsg = `${fallbackMessage}{{${data}}}`;
+    const error = fallbackMessageErrorHandler(tempMsg);
+    setFallbackMessage(tempMsg);
+    setFallbackMessageError(error);
+  };
+
+  //removing optout tag for rcs
+  const getRcsTags = () => {
+    const tempTags = cloneDeep(tags);
+    // eslint-disable-next-line no-undef
+    if (tempTags?.length > 0 && tempTags[0]?.definition?.value === 'optout') {
+      tempTags.shift();
+    }
+    return tempTags;
+  };
+  // tag Code end
   const rcsButtonTypeOptions = [
     {
       label: (
@@ -207,6 +277,12 @@ export const Rcs = (props) => {
               buttonTextlen={TEMPLATE_BUTTON_TEXT_MAX_LENGTH}
               updateButtonChange={updateButtonChange}
               suggestions={suggestions}
+              onTagSelect={onTagSelect}
+              location={location}
+              tags={getRcsTags()}
+              onContextChange={handleOnTagsContextChange}
+              injectedTags={injectedTags || {}}
+              selectedOfferDetails={selectedOfferDetails}
             />
           )}
         </>
@@ -306,76 +382,6 @@ export const Rcs = (props) => {
     }
   }, [rcsData.templateDetails || templateData]);
 
-  // tag Code start from here
-  useEffect(() => {
-    if (!showDltContainer) {
-      //fetching tags
-      const { type, module } = location.query || {};
-      const isEmbedded = type === EMBEDDED;
-      const context = isEmbedded ? module : DEFAULT;
-      const embedded = isEmbedded ? type : FULL;
-      const query = {
-        layout: SMS,
-        type: TAG,
-        context,
-        embedded,
-      };
-      if (getDefaultTags) {
-        query.context = getDefaultTags;
-      }
-      globalActions.fetchSchemaForEntity(query);
-    }
-  }, [showDltContainer]);
-
-  useEffect(() => {
-    let tag = get(metaEntities, `tags.standard`, []);
-    const { type, module } = location.query || {};
-    if (type === EMBEDDED && module === LIBRARY && !getDefaultTags) {
-      tag = supportedTags;
-    }
-    updateTags(tag);
-  }, [metaEntities]);
-
-  const handleOnTagsContextChange = (data) => {
-    const { type } = location.query || {};
-    const tempData = (data || '').toLowerCase();
-    const isEmbedded = type === EMBEDDED;
-    const embedded = isEmbedded ? type : FULL;
-    const context = tempData === ALL ? DEFAULT : tempData;
-    const query = {
-      layout: SMS,
-      type: TAG,
-      context,
-      embedded,
-    };
-    globalActions.fetchSchemaForEntity(query);
-  };
-
-  const onTagSelect = (data) => {
-    const tempMsg = `${templateDesc}{{${data}}}`;
-    const error = templateDescErrorHandler(tempMsg);
-    setTemplateDesc(tempMsg);
-    setTemplateDescError(error);
-  };
-
-  const onTagSelectFallback = (data) => {
-    const tempMsg = `${fallbackMessage}{{${data}}}`;
-    const error = fallbackMessageErrorHandler(tempMsg);
-    setFallbackMessage(tempMsg);
-    setFallbackMessageError(error);
-  };
-
-  //removing optout tag for rcs
-  const getRcsTags = () => {
-    const tempTags = cloneDeep(tags);
-    // eslint-disable-next-line no-undef
-    if (tempTags?.length > 0 && tempTags[0]?.definition?.value === 'optout') {
-      tempTags.shift();
-    }
-    return tempTags;
-  };
-  // tag Code end
-
   const renderLabel = (value, showLabel, desc) => (
     <>
       <RcsLabel>