@capillarytech/creatives-library 8.0.126 → 8.0.127-alpha.1

package/v2Containers/MobilePush/commonMethods.js

@@ -248,20 +248,13 @@ function getLinkTypeFields({inputFieldsArgs, fieldIndex, deepLinkOptions, formDa
 }
 
 function getContent(obj) {
-  const {
-    versions : {
-      base: {
-        ANDROID: {
-          title : androidTitle,
-          message : androidMessage
-        } = {},
-        IOS: {
-          title: iosTitle,
-          message: iosMessage
-        } = {}
-      } = {}
-    } = {}
-  } = obj;
+  const base = obj?.versions?.base || {};
+  const android = base.ANDROID || {};
+  const ios = base.IOS || {};
+  const androidTitle = android.title || '';
+  const androidMessage = android.message || '';
+  const iosTitle = ios.title || '';
+  const iosMessage = ios.message || '';
   return `${androidTitle} ${androidMessage} ${iosTitle} ${iosMessage}`;
 }
 export {

package/v2Containers/MobilePushNew/actions.js

@@ -0,0 +1,116 @@
+/*
+ *
+ * Create actions
+ *
+ */
+
+import * as types from './constants';
+
+export function createTemplate(template, callback) {
+  return {
+    type: types.CREATE_TEMPLATE_REQUEST,
+    template,
+    callback,
+  };
+}
+
+export function clearCreateResponse() {
+  return {
+    type: types.CLEAR_CREATE_RESPONSE_REQUEST,
+  };
+}
+
+export function defaultAction() {
+  return {
+    type: types.DEFAULT_ACTION,
+  };
+}
+
+export function uploadAsset(file, assetType, fileParams, index = 0, mobilePushParams = {}) {
+  return {
+    type: types.UPLOAD_ASSET_REQUEST,
+    file,
+    assetType,
+    fileParams,
+    index,
+    mobilePushParams,
+  };
+}
+
+export function getIosCtas(licenseCode) {
+  return {
+    type: types.GET_IOS_CTAS, licenseCode,
+  };
+}
+
+export function clearAsset(index = undefined) {
+  return {
+    type: types.CLEAR_ASSET,
+    index,
+  };
+}
+
+export function resetStore() {
+  return {
+    type: types.RESET_STORE,
+  };
+}
+
+export function getTemplateDetails(id) {
+  return {
+    type: types.GET_TEMPLATE_DETAILS_REQUEST, id,
+  };
+}
+
+export function editTemplate(template, callback) {
+  return {
+    type: types.EDIT_TEMPLATE_REQUEST, template, callback,
+  };
+}
+
+export function clearEditResponse() {
+  return {
+    type: types.CLEAR_EDIT_RESPONSE_REQUEST,
+  };
+}
+
+export function clearData() {
+  return {
+    type: types.CLEAR_DATA,
+  };
+}
+
+export function getWeCrmAccounts(source) {
+  return {
+    type: types.GET_WECRM_ACCOUNTS_REQUEST, source,
+  };
+}
+
+export function setWeChatAccount(weChatAccount) {
+  return {
+    type: types.SET_WECHAT_ACCOUNT,
+    weChatAccount,
+  };
+}
+
+export function getMobilepushTemplatesList(channel, queryParams) {
+  return {
+    type: types.GET_MOBILEPUSH_TEMPLATES_LIST_REQUEST,
+    channel,
+    queryParams,
+  };
+}
+
+export function setSelectedTemplate(templateData) {
+  return {
+    type: types.SET_SELECTED_TEMPLATE,
+    data: templateData,
+  };
+}
+
+export function setTemplateDetails(templateDetails) {
+  return {
+    type: types.GET_TEMPLATE_DETAILS_SUCCESS,
+    data: templateDetails,
+  };
+}

package/v2Containers/MobilePushNew/components/CtaButtons.js

@@ -0,0 +1,170 @@
+import React, { memo, useState } from "react";
+import PropTypes from "prop-types";
+import { FormattedMessage } from "react-intl";
+import CapRow from "@capillarytech/cap-ui-library/CapRow";
+import CapButton from "@capillarytech/cap-ui-library/CapButton";
+import CapIcon from "@capillarytech/cap-ui-library/CapIcon";
+import CapHeading from "@capillarytech/cap-ui-library/CapHeading";
+import CapMpushCTA from "../../../v2Components/CapMpushCTA";
+import { PRIMARY, SECONDARY, DEEP_LINK } from "../constants";
+import messages from "../messages";
+
+const CtaButtons = ({
+  primaryButton,
+  secondaryButton,
+  setPrimaryButton,
+  setSecondaryButton,
+  ctaData,
+  updateHandler,
+  deleteHandler,
+  deepLink,
+}) => {
+  // Local state to control CTA form visibility
+  const [showPrimaryCTA, setShowPrimaryCTA] = useState(false);
+  const [showSecondaryCTA, setShowSecondaryCTA] = useState(false);
+
+  const handleAddPrimary = () => {
+    // Prevent multiple clicks if primary button is already being added or form is already showing
+    if (primaryButton && showPrimaryCTA) {
+      return;
+    }
+
+    // If ctaData is empty or doesn't have a primary button, initialize it
+    if (ctaData.length === 0 || !ctaData.find((cta) => cta.index === 0)) {
+      const newPrimaryButton = {
+        index: 0,
+        ctaType: PRIMARY,
+        text: "",
+        urlType: DEEP_LINK,
+        url: "",
+        isSaved: false,
+      };
+      updateHandler(newPrimaryButton, 0);
+    }
+
+    setPrimaryButton(true);
+    setShowPrimaryCTA(true);
+  };
+
+  const handleAddSecondary = () => {
+    // Prevent multiple clicks if secondary button is already being added or form is already showing
+    if (secondaryButton && showSecondaryCTA) {
+      return;
+    }
+
+    if (shouldShowSecondaryCTA) {
+      return;
+    }
+
+    // If ctaData doesn't have a secondary button, initialize it
+    if (ctaData.length < 2 || !ctaData.find((cta) => cta.index === 1)) {
+      const newSecondaryButton = {
+        index: 1,
+        ctaType: SECONDARY,
+        text: "",
+        urlType: DEEP_LINK,
+        url: "",
+        isSaved: false,
+      };
+      updateHandler(newSecondaryButton, 1);
+    }
+
+    setSecondaryButton(true);
+    setShowSecondaryCTA(true);
+  };
+
+  // Check if primary button exists (saved or being edited)
+  const primaryButtonExists = ctaData.length > 0 && ctaData[0]?.text;
+  const isPrimaryButtonSaved = primaryButtonExists && ctaData[0]?.isSaved;
+
+  // Check if secondary button exists (saved or being edited)
+  const secondaryButtonExists = ctaData.length > 1 && ctaData[1]?.text;
+  const isSecondaryButtonSaved = secondaryButtonExists && ctaData[1]?.isSaved;
+
+  // Show primary CTA if button is active and (form is showing OR button exists)
+  const shouldShowPrimaryCTA = primaryButton && (showPrimaryCTA || primaryButtonExists);
+
+  // Show secondary CTA if button is active and (form is showing OR button exists)
+  const shouldShowSecondaryCTA = secondaryButton && (showSecondaryCTA || secondaryButtonExists);
+
+  // Enhanced delete handler to hide forms when buttons are deleted
+  const handleDelete = (index) => {
+    if (index === 0) {
+      setShowPrimaryCTA(false);
+      setPrimaryButton(false);
+    } else if (index === 1) {
+      setShowSecondaryCTA(false);
+      setSecondaryButton(false);
+    }
+    deleteHandler(index);
+  };
+
+  return (
+    <>
+      <CapRow>
+        <CapHeading type="h4">
+          <FormattedMessage {...messages.buttons} />
+        </CapHeading>
+        {!isPrimaryButtonSaved && !shouldShowPrimaryCTA && (
+          <CapButton
+            type="flat"
+            id="add-primary-button"
+            onClick={handleAddPrimary}
+          >
+            <CapIcon type="plus" />
+            <CapHeading type="h5" id="add-primary-btn-heading">
+              <FormattedMessage {...messages.addPrimaryButton} />
+            </CapHeading>
+          </CapButton>
+        )}
+      </CapRow>
+      {shouldShowPrimaryCTA && (
+        <CapMpushCTA
+          ctaData={ctaData}
+          updateHandler={updateHandler}
+          deleteHandler={handleDelete}
+          deepLink={deepLink || []}
+          buttonType={PRIMARY}
+        />
+      )}
+      {isPrimaryButtonSaved && !isSecondaryButtonSaved && !shouldShowSecondaryCTA && (
+        <CapButton
+          type="flat"
+          id="add-secondary-button"
+          onClick={handleAddSecondary}
+        >
+          <CapIcon type="plus" />
+          <CapHeading type="h5" id="add-secondary-btn-heading">
+            <FormattedMessage {...messages.addSecondaryButton} />
+          </CapHeading>
+        </CapButton>
+      )}
+      {shouldShowSecondaryCTA && (
+        <CapMpushCTA
+          ctaData={ctaData}
+          updateHandler={updateHandler}
+          deleteHandler={handleDelete}
+          deepLink={deepLink || []}
+          buttonType={SECONDARY}
+        />
+      )}
+    </>
+  );
+};
+
+CtaButtons.propTypes = {
+  primaryButton: PropTypes.bool.isRequired,
+  secondaryButton: PropTypes.bool.isRequired,
+  setPrimaryButton: PropTypes.func.isRequired,
+  setSecondaryButton: PropTypes.func.isRequired,
+  ctaData: PropTypes.array.isRequired,
+  updateHandler: PropTypes.func.isRequired,
+  deleteHandler: PropTypes.func.isRequired,
+  deepLink: PropTypes.array,
+};
+
+CtaButtons.defaultProps = {
+  deepLink: [],
+};
+
+export default memo(CtaButtons);