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

package/v2Components/CapTagList/index.js

@@ -58,19 +58,14 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
       dynamicDateValue: '',
       showModal: false,
       translationLang: '',
-      tagsList: [],
-      selectedContext: 'Outbound',
-      isLoadingLoyaltyTags: false,
-      isLoadingContextChange: false,
+      tagsList: []
     };
     this.renderTags = this.renderTags.bind(this);
     this.getSearchedExpandedKeys = this.getSearchedExpandedKeys.bind(this);
   }
-
   getTranslationMappedLocale(locale) {
     return GET_TRANSLATION_MAPPED?.[locale];
   }
-
   componentDidMount() {
     const user = localStorage.getItem('user');
     let locale = 'en';
@@ -84,36 +79,17 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
     });
   }
 
-  componentDidUpdate(prevProps, prevState) {
+  componentDidUpdate(prevProps, prevState){
     if (this.props.tags !== prevProps.tags || this.state.searchValue !== prevState.searchValue) {
-      const temp = this.renderTags(this.props.tags, this.state.searchValue);
-      this.setState({
-        tagsList: temp,
-      });
-    }
-
-    // Reset loading states when tags are received after context change
-    if ((this.state.isLoadingLoyaltyTags || this.state.isLoadingContextChange)
-        && this.props.tags !== prevProps.tags) {
+      let temp = this.renderTags(this.props.tags, this.state.searchValue);
       this.setState({
-        isLoadingLoyaltyTags: false,
-        isLoadingContextChange: false,
-      });
-    }
-
-    // Backup: Reset loading states if props.loading changed from true to false
-    // This handles cases where the API doesn't return different tags but injectedTags change
-    if (prevProps.loading === true && this.props.loading === false
-        && (this.state.isLoadingLoyaltyTags || this.state.isLoadingContextChange)) {
-      this.setState({ 
-        isLoadingLoyaltyTags: false,
-        isLoadingContextChange: false,
+        tagsList: temp
       });
     }
   }
 
   onChange = (e) => {
-    const {value} = e.target;
+    const value = e.target.value;
     let expandedKeys = this.getSearchedExpandedKeys(this.props.tags, value);
     if (value === '') {
       expandedKeys = [];
@@ -124,7 +100,6 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
       autoExpandParent: true,
     });
   };
-
   onExpand = (expandedKeys, info) => {
     this.handleOnExpand(info.node.props.eventKey);
   };
@@ -132,25 +107,26 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
   getSearchedExpandedKeys(tags, value = '') {
     let list = [];
     _.forEach(tags, (val = {}, key) => {
-      const tagName = typeof val?.name === STRING
-        ? _.toLower(_.get(val, "name", ""))
-        : _.toLower(_.get(val, "name.props.defaultMessage", ""));
+      const tagName =
+        typeof val?.name === STRING
+          ? _.toLower(_.get(val, "name", ""))
+          : _.toLower(_.get(val, "name.props.defaultMessage", ""));
       const tagNameWithoutUnderscore = tagName.replace(/_/g, " ");
       const searchStringLower = _.toLower(value);
       if (_.has(val, "subtags")) {
         if (
-          val?.name
-          && (tagName.includes(searchStringLower)
-            || tagNameWithoutUnderscore.includes(searchStringLower))
+          val?.name &&
+          (tagName.includes(searchStringLower) ||
+            tagNameWithoutUnderscore.includes(searchStringLower))
         ) {
           list.push(key);
         }
         const temp = this.getSearchedExpandedKeys(val?.subtags, value);
         list = list.concat(temp);
       } else if (
-        val?.name
-        && (tagName.includes(searchStringLower)
-          || tagNameWithoutUnderscore.includes(searchStringLower))
+        val?.name &&
+        (tagName.includes(searchStringLower) ||
+          tagNameWithoutUnderscore.includes(searchStringLower))
       ) {
         list.push(key);
       }
@@ -159,21 +135,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
   }
 
   handleOnChange = (data) => {
-    const { selectedContext } = this.state;
-
-    // Only proceed if the context has actually changed
-    if (selectedContext !== data) {
-      // Set loading state for any context change
-      this.setState({
-        isLoadingContextChange: true,
-        selectedContext: data,
-        // Keep loyalty-specific loading for backward compatibility
-        isLoadingLoyaltyTags: data === 'Loyalty',
-      });
-
-      // Call the parent's context change handler
-      this.props.onContextChange(data);
-    }
+    this.props.onContextChange(data);
   };
 
   handleDynamicDateChange = (data) => {
@@ -230,7 +192,6 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
     }
     this.setState({expandedKeys, autoExpandParent: false});
   };
-
   togglePopoverVisibility = (visible) => {
     this.setState({visible});
   };
@@ -239,11 +200,9 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
     this.setState({showModal: true, visible: false});
   };
 
-  renderTags = (tags) => {
+  renderTags(tags) {
     const searchString = this.state.searchValue || '';
-    const {
-      disableRelatedTags, childTagsToDisable, parentTagstoDisable,
-    } = this?.props?.disableTagsDetails;
+    const { disableRelatedTags, childTagsToDisable, parentTagstoDisable, showCardsRelatedTags } = this?.props?.disableTagsDetails;
     const { accessibleFeatures = [] } = this?.props?.currentOrgDetails || {};
     const hideDateTagsForJpLocale = accessibleFeatures.includes(JP_LOCALE_HIDE_FEATURE);
     const list = [];
@@ -267,14 +226,16 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
         supportedTagsString += `${supportedTag} ,`;
       });
       supportedTagsString = supportedTagsString.replace(/,\s*$/, "");
-      const tagName = typeof val?.name === STRING
-        ? _.toLower(_.get(val, "name", ""))
-        : _.toLower(_.get(val, "name.props.defaultMessage", ""));
+      const tagName =
+        typeof val?.name === STRING
+          ? _.toLower(_.get(val, "name", ""))
+          : _.toLower(_.get(val, "name.props.defaultMessage", ""));
       const tagNameWithoutUnderscore = tagName.replace(/_/g, " ");
       const searchStringLower = _.toLower(searchString);
-      const tagContainsSearchedString = searchStringLower
-        && (tagName.includes(searchStringLower)
-          || tagNameWithoutUnderscore.includes(searchStringLower));
+      const tagContainsSearchedString =
+        searchStringLower &&
+        (tagName.includes(searchStringLower) ||
+          tagNameWithoutUnderscore.includes(searchStringLower));
       if (_.has(val, 'subtags')) {
         const disabled = disableRelatedTags ? parentTagstoDisable.includes(key) : false;
         const temp = this.renderTags(val?.subtags);
@@ -325,8 +286,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
                     : `${key}`
                 }
                 disabled={childDisabled}
-              >
-              </CapTreeNode>
+              ></CapTreeNode>
             );
             hidingDateTagsForJpLocale(
               hideDateTagsForJpLocale,
@@ -361,8 +321,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
                   : `${key}`
               }
               disabled={childDisabled}
-            >
-            </CapTreeNode>
+            ></CapTreeNode>
           );
           hidingDateTagsForJpLocale(
             hideDateTagsForJpLocale,
@@ -375,23 +334,14 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
     });
     return list;
   }
-
   openTranslationLink = () => {
     window.open(TAG_TRANSLATION_DOC, '_blank');
   }
-
   render() {
-    const {
-      hidePopover = false, intl = {}, moduleFilterEnabled, label, modalProps, channel, fetchingSchemaError = false,
-    } = this.props;
+    const { hidePopover = false, tags = {}, intl = {}, moduleFilterEnabled, label, modalProps, channel, fetchingSchemaError = false } = this.props;
+    const tg = tags;
     const {formatMessage} = intl;
-    const {
-      tagValue, expandedKeys, autoExpandParent, visible, translationLang, selectedContext, isLoadingLoyaltyTags, isLoadingContextChange,
-    } = this.state;
-
-    // Show loading spinner if general loading OR if specifically loading loyalty tags OR if context change is in progress
-    const shouldShowLoading = this.props.loading || (selectedContext === 'Loyalty' && isLoadingLoyaltyTags) || isLoadingContextChange;
-
+    const { tagValue, expandedKeys, autoExpandParent, searchValue, visible, translationLang } = this.state;
     const options = [
       {
         value: "Outbound",
@@ -404,106 +354,99 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
         key: 'loyalty',
       },
     ];
-    const contentSection = (
-      <div>
-        <CapSpin tip={formatMessage(messages.gettingTags)} spinning={shouldShowLoading}>
-          <Search
-            style={{ marginBottom: 8, width: '250px'}}
-            placeholder={formatMessage(messages.search)}
-            onChange={this.onChange} />
-          {moduleFilterEnabled ? (
-            <CapSelect
-              getPopupContainer={(triggerNode) => triggerNode.parentNode}
-              style={{
-                width: '250px', marginBottom: '16px', minWidth: 'initial', display: 'inherit',
-              }}
-              onChange={this.handleOnChange}
-              value={selectedContext}
-              options={options}>
-            </CapSelect>
-          ) : ''}
-          <CapTree
-            styling={{height: '350px', overflow: 'auto'}}
-            onSelect={this.handleOnSelect}
-            selectedKeys={tagValue}
-            expandedKeys={expandedKeys}
-            autoExpandParent={autoExpandParent}
-            onExpand={this.onExpand}
-          >
-            {/* {this.renderTags(tg, searchValue)} */}
-            {this.state.tagsList}
-          </CapTree>
-          {translationLang === "ja-JP" && (
-            <div className="tag-list-footer">
-              <CapIcon
-                type="help"
-                size="s"
-              />
-              <CapLink>
-                <CapButton id="translationtagfooter" type="flat" onClick={this.openTranslationLink}>
-                  <div className="tag-list-footer-icon">
-                    <div>{JAPANESE_HELP_TEXT}</div>
-                    <CapIcon
-                      type="open-in-new-light"
-                      size="s"
-                      svgProps={{ color: FONT_COLOR_05 }}
-                    />
-                  </div>
-                </CapButton>
-              </CapLink>
-            </div>
-          )}
+    const contentSection = (<div>
+      <CapSpin tip={formatMessage(messages.gettingTags)} spinning={this.props.loading}>
+        <Search
+          style={{ marginBottom: 8, width: '250px'}}
+          placeholder={formatMessage(messages.search)}
+          onChange={this.onChange} />
+        {moduleFilterEnabled ?
+          <CapSelect
+            getPopupContainer={(triggerNode) => triggerNode.parentNode}
+            style={{width: '250px', marginBottom: '16px', minWidth: 'initial', display: 'inherit'}}
+            onChange={this.props.onContextChange}
+            defaultValue={'Outbound'}
+            options={options}>
+          </CapSelect> : ''}
+        <CapTree
+          styling={{height: '350px', overflow: 'auto'}}
+          onSelect={this.handleOnSelect}
+          selectedKeys={tagValue}
+          expandedKeys={expandedKeys}
+          autoExpandParent={autoExpandParent}
+          onExpand={this.onExpand}
+        >
+          {/* {this.renderTags(tg, searchValue)} */}
+          {this.state.tagsList}
+        </CapTree>
+        {translationLang === "ja-JP" &&
+          <div className="tag-list-footer">
+            <CapIcon
+              type="help"
+              size="s"
+            />
+            <CapLink>
+              <CapButton id="translationtagfooter" type="flat" onClick={this.openTranslationLink} >
+                <div className="tag-list-footer-icon">
+                  <div>{JAPANESE_HELP_TEXT}</div>
+                  <CapIcon
+                    type="open-in-new-light"
+                    size="s"
+                    svgProps={{ color: FONT_COLOR_05 }}
+                  />
+                </div>
+              </CapButton>
+            </CapLink>
+          </div>
+        }
 
-        </CapSpin>
-      </div>
-    );
+      </CapSpin>
+    </div>);
     return (
       <>
-        {hidePopover ? (
-          <CapModal
-            visible={this.props.visibleTaglist}
-            footer={[]}
-            {...modalProps}
-          >
-            {contentSection}
-          </CapModal>
-        ) : (
-          <CapPopover
-            visible={fetchingSchemaError ? false : visible}
-            onVisibleChange={this.togglePopoverVisibility}
-            content={contentSection}
-            trigger="click"
-            placement={channel === EMAIL.toUpperCase() ? "leftTop" : "rightTop"}
+        {hidePopover ? <CapModal
+          visible={this.props.visibleTaglist}
+          footer={[]}
+          {...modalProps}
+        >
+          {contentSection}
+        </CapModal> :
+        <CapPopover
+          visible={fetchingSchemaError ? false : visible}
+          onVisibleChange={this.togglePopoverVisibility}
+          content={contentSection}
+          trigger="click"
+          placement={channel === EMAIL.toUpperCase() ? "leftTop" : "rightTop"}
+        >
+          <CapTooltip
+            title={
+              fetchingSchemaError && (
+                <CapRow className="tooltip-text-container">
+                  <CapLabel className="tooltip-text1">
+                    {formatMessage(messages.somethingWentWrong)}
+                  </CapLabel>
+                  <CapLabel className="tooltip-text2">
+                    {formatMessage(messages.labelFetchErrorMsg)}
+                  </CapLabel>
+                </CapRow>
+              )
+            }
+            placement="right"
           >
-            <CapTooltip
-              title={
-                fetchingSchemaError && (
-                  <CapRow className="tooltip-text-container">
-                    <CapLabel className="tooltip-text1">
-                      {formatMessage(messages.somethingWentWrong)}
-                    </CapLabel>
-                    <CapLabel className="tooltip-text2">
-                      {formatMessage(messages.labelFetchErrorMsg)}
-                    </CapLabel>
-                  </CapRow>
-                )
-              }
-              placement="right"
-            >
-              <CapRow className="tooltip-add-label-container">
-                <CapButton
-                  disabled={
-                    this?.props?.disabled || fetchingSchemaError
-                  }
-                  isAddBtn
-                  type="flat"
-                >
-                  {label || ""}
-                </CapButton>
-              </CapRow>
-            </CapTooltip>
-          </CapPopover>
-        )}
+            <CapRow className="tooltip-add-label-container">
+              <CapButton
+                disabled={
+                  this?.props?.disabled || fetchingSchemaError
+                }
+                isAddBtn
+                type="flat"
+              >
+                {label || ""}
+              </CapButton>
+            </CapRow>
+          </CapTooltip>
+        </CapPopover>
+        }
         <CapModal
           visible={this.state.showModal}
           title={this.props.intl.formatMessage(messages["Dynamic Days before Expiry"])}

package/v2Components/CapVideoUpload/constants.js

@@ -1,10 +1,7 @@
 export const WHATSAPP = 'WHATSAPP';
 export const DEFAULT = 'DEFAULT';
-export const MOBILEPUSH = 'MOBILEPUSH';
 export const SUPPORTED_FILE_FORMATS = {
   VIBER: '3GP, MP4, MOV, M4V',
   DEFAULT: 'MP4',
-  MOBILEPUSH: '3GP, MP4, MOV, M4V',
 };
 export const VIBER_MAX_DURATION = 600; // seconds
-export const MAX_DURATION = 600; // seconds for all channels