@capillarytech/creatives-library 7.17.25 → 7.17.26-alpha.0

package/package.json

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

package/utils/common.js

@@ -282,16 +282,13 @@ export const isTraiDLTEnable = (isFullMode, smsRegister) => {
   return isTraiDltFeature;
 };
 
-export const intlKeyGenerator = (value = "") => {
-  return value.replace(/[^a-zA-Z0-9_]/g, "");
-};
+export const intlKeyGenerator = (value = "") => String(value).replace(/[^a-zA-Z0-9_]/g, "");
 
 export const handleInjectedData = (data, scope) => {
-  const temp = _.cloneDeep(data);
   let tagType;
-  for (const tagKey in temp) {
-    if (temp.hasOwnProperty(tagKey)) {
-      const tag = temp[tagKey];
+  for (const tagKey in data) {
+    if (data.hasOwnProperty(tagKey)) {
+      const tag = data[tagKey];
 
       if (tag?.name === REGISTRATION_CUSTOM_FIELD) {
         tagType = CUSTOM_TAG;
@@ -300,19 +297,19 @@ export const handleInjectedData = (data, scope) => {
       }
 
       if (tag?.name) {
-        const name = tag?.name;
+        const name = tag.name;
         const key = intlKeyGenerator(name);
         const id = tagType
           ? `${scope}.${key}_name.${tagType}`
           : `${scope}.${key}`;
 
-        tag["name"] = apiMessageFormatHandler(id, name);
+        tag.name = apiMessageFormatHandler(id, name);
       }
 
       if (tag?.subtags) {
         for (const subtagKey in tag.subtags) {
-          if (tag["subtags"].hasOwnProperty(subtagKey)) {
-            const subtag = tag["subtags"][subtagKey];
+          if (tag.subtags.hasOwnProperty(subtagKey)) {
+            const subtag = tag.subtags[subtagKey];
             if (subtag?.name) {
               const name = subtag?.name;
               const key = intlKeyGenerator(name);
@@ -320,7 +317,7 @@ export const handleInjectedData = (data, scope) => {
                 ? `${scope}.${key}_name.${tagType}`
                 : `${scope}.${key}`;
 
-              subtag["name"] = apiMessageFormatHandler(id, name);
+              subtag.name = apiMessageFormatHandler(id, name);
             }
             if (subtag?.desc) {
               const desc = subtag?.desc;
@@ -329,7 +326,7 @@ export const handleInjectedData = (data, scope) => {
                 ? `${scope}.${key}_desc.${tagType}`
                 : `${scope}.${key}`;
 
-              subtag["desc"] = apiMessageFormatHandler(id, desc);
+              subtag.desc = apiMessageFormatHandler(id, desc);
             }
           }
         }
@@ -337,5 +334,5 @@ export const handleInjectedData = (data, scope) => {
       tagType = "";
     }
   }
-  return temp;
+  return data;
 };

package/v2Containers/ChannelTemplates/actions.js

@@ -0,0 +1,20 @@
+/*
+ *
+ * ChannelTemplates actions
+ *
+ */
+
+import * as types from './constants';
+
+export function defaultAction() {
+  return {
+    type: types.DEFAULT_ACTION,
+  };
+}
+
+export function getTemplates(channel) {
+  return {
+    type: types.GET_TEMPLATES_REQUEST,
+    channel,
+  };
+}

package/v2Containers/ChannelTemplates/constants.js

@@ -0,0 +1,8 @@
+/*
+ *
+ * ChannelTemplates constants
+ *
+ */
+
+export const DEFAULT_ACTION = 'app/ChannelTemplates/DEFAULT_ACTION';
+

package/v2Containers/ChannelTemplates/index.js

@@ -0,0 +1,47 @@
+/*
+ *
+ * ChannelTemplates
+ *
+ */
+
+import PropTypes from 'prop-types';
+
+import React from 'react';
+import { connect } from 'react-redux';
+import { FormattedMessage } from 'react-intl';
+import { bindActionCreators } from 'redux';
+import { createStructuredSelector } from 'reselect';
+import makeSelectChannelTemplates from './selectors';
+import * as actions from './actions';
+import messages from './messages';
+
+
+export class ChannelTemplates extends React.Component { // eslint-disable-line react/prefer-stateless-function
+  componentDidMount() {
+    this.props.actions.getTemplates(this.props.channel);
+  }
+  render() {
+    return (
+      <CardGrid
+        cardDataList={[]}
+      />
+    );
+  }
+}
+
+ChannelTemplates.propTypes = {
+  actions: PropTypes.object.isRequired,
+  channel: PropTypes.string,
+};
+
+const mapStateToProps = createStructuredSelector({
+  ChannelTemplates: makeSelectChannelTemplates(),
+});
+
+function mapDispatchToProps(dispatch) {
+  return {
+    actions: bindActionCreators(actions, dispatch),
+  };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(ChannelTemplates);

package/v2Containers/ChannelTemplates/messages.js

@@ -0,0 +1,13 @@
+/*
+ * ChannelTemplates Messages
+ *
+ * This contains all the text for the ChannelTemplates component.
+ */
+import { defineMessages } from 'react-intl';
+
+export default defineMessages({
+  header: {
+    id: 'creatives.containersV2.ChannelTemplates.header',
+    defaultMessage: 'This is ChannelTemplates container !',
+  },
+});

package/v2Containers/ChannelTemplates/reducer.js

@@ -0,0 +1,34 @@
+/*
+ *
+ * ChannelTemplates reducer
+ *
+ */
+
+import { fromJS } from 'immutable';
+import * as types from './constants';
+
+const initialState = fromJS({
+  loadingTemplates: true,
+  smsTemplates: [],
+  emailTemplates: [],
+  wechatTemplates: [],
+  mobilepushTemplates: [],
+});
+
+function channelTemplatesReducer(state = initialState, action) {
+  const channelTemplates = `${action.channel}Templates`;
+  switch (action.type) {
+    case types.DEFAULT_ACTION:
+      return state;
+    case types.GET_TEMPLATES_REQUEST:
+      return state.set('loadingTemplates', true);
+    case types.GET_TEMPLATES_SUCESS:
+      return state.set('loadingTemplates', false).set(channelTemplates, action.templates);
+    case types.GET_TEMPLATES_FAILURE:
+      return state.set('loadingTemplates', false).set('error', action.error);
+    default:
+      return state;
+  }
+}
+
+export default channelTemplatesReducer;

package/v2Containers/ChannelTemplates/sagas.js

@@ -0,0 +1,32 @@
+import { take, takeLatest, call, put, cancel } from 'redux-saga/effects';
+import { LOCATION_CHANGE } from 'react-router-redux';
+import * as Api from '../../services/api';
+
+
+import * as types from './constants';
+// Individual exports for testing
+export function* defaultSaga() {
+  // See example in v2Containers/HomePage/sagas.js
+}
+function* getTemplates(action) {
+  try {
+    const req = {
+      channel: action.channel,
+      queryParams: action.query,
+    };
+    const res = call(Api.getAllTemplates, req);
+    put({type: types.GET_TEMPLATES_SUCESS, templates: res.response, channel: action.channel});
+  } catch (error) {
+    put({type: types.GET_TEMPLATES_FAILURE, error});
+  }
+}
+function* getTemplatesWatcher() {
+  const watcher = yield takeLatest(types.GET_TEMPLATES_REQUEST, getTemplates);
+  yield take(LOCATION_CHANGE);
+  yield cancel(watcher);
+}
+// All sagas to be loaded
+export default [
+  defaultSaga,
+  getTemplatesWatcher,
+];

package/v2Containers/ChannelTemplates/selectors.js

@@ -0,0 +1,25 @@
+import { createSelector } from 'reselect';
+
+/**
+ * Direct selector to the channelTemplates state domain
+ */
+const selectChannelTemplatesDomain = () => (state) => state.get('templates');
+
+/**
+ * Other specific selectors
+ */
+
+
+/**
+ * Default selector used by ChannelTemplates
+ */
+
+const makeSelectChannelTemplates = () => createSelector(
+  selectChannelTemplatesDomain(),
+  (substate) => substate.toJS()
+);
+
+export default makeSelectChannelTemplates;
+export {
+  selectChannelTemplatesDomain,
+};

package/v2Containers/Sms/Create/tests/sagas.test.js

@@ -0,0 +1,82 @@
+import { expectSaga } from "redux-saga-test-plan";
+import { take, cancel, takeLatest } from "redux-saga/effects";
+import * as matchers from "redux-saga-test-plan/matchers";
+import { LOCATION_CHANGE } from "react-router-redux";
+import { throwError } from "redux-saga-test-plan/providers";
+import { createMockTask } from "redux-saga/utils";
+import * as types from "../constants";
+import { watchAiSuggestions, getAiSuggestions } from "../sagas";
+import * as Api from "../../../../services/api";
+
+describe("getAiSuggestions saga", () => {
+  it("Should handle valid response from api", () => {
+    const successCallback = () => {};
+    const failureCallback = () => {};
+    const action = {
+      type: types.GET_AI_SUGGESTIONS,
+      prompt: {},
+      successCallback,
+      failureCallback,
+    };
+    expectSaga(getAiSuggestions, action)
+      .provide([
+        [
+          matchers.call.fn(Api.getAiSuggestions),
+          {
+            success: true,
+            status: {
+              isError: false,
+              code: 200,
+              message: "success",
+            },
+            message: "Meta data fetched successfully",
+            response: {
+              "https://response.com": 1400,
+            },
+          },
+        ],
+        [matchers.call.fn(successCallback)],
+      ])
+      .run();
+  });
+
+  it("Should handles error thrown from api", () => {
+    const successCallback = () => {};
+    const failureCallback = () => {};
+    const action = {
+      type: types.GET_AI_SUGGESTIONS,
+      prompt: {},
+      successCallback,
+      failureCallback,
+    };
+    expectSaga(getAiSuggestions, action)
+      .provide([[matchers.call.fn(Api.getAiSuggestions), throwError()]])
+      .run();
+  });
+});
+
+describe("watchAiSuggestions saga", () => {
+  let generator = null;
+  beforeEach(() => {
+    generator = watchAiSuggestions();
+  });
+  it("Should handle valid response from api", () => {
+    const progress1 = generator.next();
+    const mockTask = takeLatest(types.GET_AI_SUGGESTIONS, getAiSuggestions);
+    expect(progress1.value).toEqual(mockTask);
+    const progress2 = generator.next();
+    expect(progress2.value).toEqual(take(LOCATION_CHANGE));
+  });
+
+  it("Should handle LOCATION_CHANGE action and cancel the watcher", () => {
+    generator = watchAiSuggestions();
+    const mockTask = createMockTask();
+
+    expect(generator.next().value).toEqual(
+      takeLatest(types.GET_AI_SUGGESTIONS, getAiSuggestions)
+    );
+    expect(generator.next(mockTask).value).toEqual(take(LOCATION_CHANGE));
+    expect(generator.next().value).toEqual(cancel(mockTask));
+    expect(generator.next().done).toEqual(true);
+  });
+});

package/v2Containers/TagList/index.js

@@ -20,17 +20,18 @@ import * as globalActions from '../Cap/actions';
 import CapTagList from '../../v2Components/CapTagList';
 import './_tagList.scss';
 import { selectCurrentOrgDetails } from '../Cap/selectors';
-const TreeNode = Tree.TreeNode;
 import { injectIntl } from 'react-intl';
 import { scope } from './messages';
 import { handleInjectedData } from '../../utils/common';
 
+const TreeNode = Tree.TreeNode;
+
 export class TagList extends React.Component { // eslint-disable-line react/prefer-stateless-function
   constructor(props) {
     super(props);
     this.state = {
       loading: false,
-      tags: []
+      tags: [],
     };
     this.renderTags = this.renderTags.bind(this);
     this.populateTags = this.populateTags.bind(this);
@@ -40,35 +41,7 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
   }
 
   componentDidMount() {
-    
-  }
-
-  componentDidUpdate(prevProps) {
-    if (this.props.tags !== prevProps.tags || this.props.injectedTags !== prevProps.injectedTags || this.props.selectedOfferDetails !== prevProps.selectedOfferDetails) {
-      this.setState({
-        tags: this.generateTags(this.props),
-      });
-    }
-  }
-
-  generateTags(props) {
-    let tags = {};
-    let injectedTags = {};
-    if (props.injectedTags && !_.isEmpty(props.injectedTags)) {
-      const formattedInjectedTags = handleInjectedData(
-        props.injectedTags,
-        scope
-      );
-      injectedTags = this.transformInjectedTags(formattedInjectedTags);
-    }
-    if (props.tags && props.tags.length > 0) {
-      tags = this.populateTags(props.tags);
-      console.log('populating tags', Object.keys(tags || {}).length);
-    }
-    if (props.selectedOfferDetails && !_.isEmpty(props.selectedOfferDetails) && (tags && tags.coupon)) {
-      this.transformCouponTags(props.selectedOfferDetails, tags);
-    }
-    return _.merge( {}, tags, injectedTags);
+    this.generateTags(this.props);
   }
 
   componentWillReceiveProps(nextProps) {
@@ -76,33 +49,52 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
       this.setState({loading: true});
     }
     if (!_.isEqual(nextProps.injectedTags, this.props.injectedTags)) {
-      
+
       this.setState({loading: false});
     }
     if (!_.isEqual(nextProps.tags, this.props.tags)) {
-      
+
       this.setState({loading: false});
     }
 
   }
-
+  componentDidUpdate(prevProps) {
+    if (this.props.tags !== prevProps.tags || this.props.injectedTags !== prevProps.injectedTags || this.props.selectedOfferDetails !== prevProps.selectedOfferDetails) {
+      this.generateTags(this.props);
+    }
+  }
   onSelect = (selectedKeys) => {
     this.props.onTagSelect(selectedKeys[0]);
   };
 
   onClick = (e, data) => {
-    
+
   };
 
   getTagsforContext = (data) => {
     //this.setState({loading: true});
     this.props.onContextChange(data);
   }
-
+  generateTags = (props) => {
+    let tags = {};
+    let injectedTags = {};
+    if (props.injectedTags && !_.isEmpty(props.injectedTags)) {
+      const formattedInjectedTags = handleInjectedData(
+        props.injectedTags,
+        scope
+      );
+      injectedTags = this.transformInjectedTags(formattedInjectedTags);
+    }
+    if (props.tags && props.tags.length > 0) {
+      tags = this.populateTags(props.tags);
+    }
+    if (props.selectedOfferDetails && !_.isEmpty(props.selectedOfferDetails) && (tags && tags.coupon)) {
+      this.transformCouponTags(props.selectedOfferDetails, tags);
+    }
+    this.setState({tags: _.merge( {}, tags, injectedTags)});
+  }
   populateTags(tagsList) {
-    console.log('populating tags', (tagsList || []).length);
     const mainTags = {};
-
     //Form tags object with tag headers
     _.forEach(tagsList, (temp) => {
       const tag = temp.definition;
@@ -115,7 +107,6 @@ export class TagList extends React.Component { // eslint-disable-line react/pref
       } else if (tag['tag-header'] && mainTags[tag.value]) {
         mainTags[tag.value].subtags = _.concat(mainTags[tag.value].subtags, tag.subtags);
       } else if (!mainTags[tag.value]) {
-        // 
         mainTags[tag.value] = {
           'tag-header': true,
           "name": tag?.label[userLocale] ? tag?.label[userLocale] : tag?.label?.en,