@capillarytech/creatives-library 7.12.111 → 7.12.113

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "7.12.111",
+  "version": "7.12.113",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",
@@ -24,7 +24,6 @@
     "jest-date-mock": "^1.0.8",
     "jquery": "^3.3.1",
     "load-script": "^1.0.0",
-    "node-html-parser": "^5.4.2-0",
     "normalizr": "^3.2.3",
     "papaparse": "^5.3.1",
     "pre-push": "^0.1.2",

package/tests/integration/CreateTemplate/CreateTemplate.integration.test.js

@@ -0,0 +1,18 @@
+/**
+ * This is not an integration test rather it's created to run the integration test script for now.
+ * The tests case and file name will be re-written as per the requirement in future.
+ */
+
+describe('Create Templates ', () => {
+  it('Should pass the test case for truthy values', async () => {
+    expect(true).toBeTruthy();
+  });
+
+  it('Should pass the test case for falsy values', async () => {
+    expect(false).toBeFalsy();
+  });
+
+  it('Should pass the test case for falsy values', async () => {
+    expect({}).toEqual({});
+  });
+});

package/v2Components/FormBuilder/index.js

@@ -11,7 +11,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import _ from 'lodash';
 import { Tabs, Table, Modal} from 'antd';
-import { CapSpin, CapDrawer, CapButton, CapInput, CapPopover, CapImage, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon} from '@capillarytech/cap-ui-library';
+import { CapSpin, CapDrawer, CapButton, CapInput, CapPopover, CapImage, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon, CapTooltip} from '@capillarytech/cap-ui-library';
 import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
 import LabelHOC from '@capillarytech/cap-ui-library/assets/HOCs/ComponentWithLabelHOC';
 import { CAP_SPACE_12, CAP_SPACE_08, FONT_COLOR_05, FONT_COLOR_04 } from '@capillarytech/cap-ui-library/styled/variables';
@@ -2800,22 +2800,28 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
             break;
           case "checkbox":
             ifError = this.state.checkValidation && (isVersionEnable ? this.state.errorData[`${this.state.currentTab - 1}`][val.id] : this.state.errorData[val.id]);
+            const { disabled , hoverText } = val || {};
             if (styling === 'semantic') {
               columns.push(
                 <CapColumn key="input" span={val.width} offset={val.offset}>
-                  <CapCheckbox
-                    key={val.id}
-                    className={`${ifError ? 'error' : ''}`}
-                    errorMessage={val.errorMessage && ifError ? val.errorMessage : ''}
-                    onChange={(e) => this.updateFormData(e.target.checked, val, val.submitAction)}
-                    checked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
-                    defaultChecked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
-                    style={val.style ? val.style : {}}
-                    disabled={val.disabled}
-                    inductiveText={val.inductiveText}
+                  <CapTooltip
+                    title={ disabled && hoverText ? hoverText : '' }
+                    placement="topLeft"
                   >
+                    <CapCheckbox
+                      key={val.id}
+                      className={`${ifError ? 'error' : ''}`}
+                      errorMessage={val.errorMessage && ifError ? val.errorMessage : ''}
+                      onChange={(e) => this.updateFormData(e.target.checked, val, val.submitAction)}
+                      checked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
+                      defaultChecked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
+                      style={val.style ? val.style : {}}
+                      disabled={val.disabled}
+                      inductiveText={val.inductiveText}
+                    >
                     {val.label}
-                  </CapCheckbox>
+                    </CapCheckbox>
+                  </CapTooltip>
                 </CapColumn>
               );
             }

package/v2Components/FormBuilder/tests/index.test.js

@@ -0,0 +1,41 @@
+import React from "react";
+import { injectIntl } from 'react-intl';
+import '@testing-library/jest-dom';
+import FormBuilder from '../index';
+import { Provider } from 'react-redux';
+import configureStore from '../../../store';
+import {
+    render,
+    screen,
+    fireEvent,
+    waitFor
+  } from '../../../utils/test-utils';
+import { mockData } from './mockData';
+
+
+const ComponentToRender = injectIntl(FormBuilder);
+const renderComponent = props => {
+  const store = configureStore({}, null);
+  return render(
+    <Provider store={store}>
+      <ComponentToRender {...props} />
+    </Provider>,
+  );
+};
+
+describe("test for checkbox form builder",() => {
+  const onFormValidityChange=jest.fn();
+    const props={
+      ...mockData,
+      onFormValidityChange
+    }
+    renderComponent(props);
+    it("add action button to notification disabled in ios", async () => {
+      const addNotifBtn=screen.getByLabelText("Add action buttons to notification")
+      expect(addNotifBtn).toBeDisabled();
+      fireEvent.mouseOver(addNotifBtn);
+      await waitFor(() => {
+        expect(screen.getByText("This section is being revamped. Till then it will remain disabled.")).toBeInTheDocument();
+      })
+    })
+})

package/v2Components/FormBuilder/tests/mockData.js

@@ -0,0 +1,120 @@
+export const mockData = {
+    schema:{
+        "containers": [
+            {
+                "id": "pane",
+                "supportedEvents": [
+                    "onTabChange"
+                ],
+                "panes": [
+                    {
+                        "isSupported": true,
+                        "sectionsHeaders": [
+                            {
+                                "type": "multicols",
+                                "inputFields": [
+                                    {
+                                        "rowStyle": {
+                                            "display": "flex",
+                                            "flex": 1
+                                        },
+                                        "cols": [
+                                            {
+                                                "id": "tab-header",
+                                                "metaType": "label",
+                                                "value": "iOS",
+                                                "primitive": true,
+                                                "dynamicTab": false,
+                                                "type": "div",
+                                                "width": 5,
+                                                "offset": 0,
+                                                "onlyDisplay": true,
+                                                "colStyle": {
+                                                    "flex": 1
+                                                },
+                                                "injectedEvents": {}
+                                            }
+                                        ]
+                                    }
+                                ],
+                                "actionFields": []
+                            }
+                        ],
+                        "sections": [
+                            {
+                                "type": "parent",
+                                "width": 16,
+                                "rowStyle": {
+                                    "height": "100%"
+                                },
+                                "childSections": [
+                                    {
+                                        "colStyle": {
+                                            "paddingTop": "16px",
+                                            "paddingLeft": "16px",
+                                            "borderRight": "1px solid #d9d9d9",
+                                            "height": "70vh",
+                                            "overflowY": "auto"
+                                        },
+                                        "width": 16,
+                                        "type": "parent",
+                                        "childSections": [
+                                            {
+                                                "type": "multicols",
+                                                "inputFields": [
+                                                    {
+                                                        "identifier": "add-sec-cta-ios",
+                                                        "cols": [
+                                                            {
+                                                                "id": "add-sec-cta-ios",
+                                                                "metaType": "label",
+                                                                "dynamicTab": false,
+                                                                "label": "Add action buttons to notification",
+                                                                "styling": "semantic",
+                                                                "type": "checkbox",
+                                                                "customComponent": false,
+                                                                "datatype": "boolean",
+                                                                "fluid": true,
+                                                                "onlyDisplay": false,
+                                                                "offset": 0,
+                                                                "colStyle": {
+                                                                    "flex": 1
+                                                                },
+                                                                "submitAction": "addSecondaryCtaIos",
+                                                                "supportedEvents": [
+                                                                    "addSecondaryCtaIos"
+                                                                ],
+                                                                "disabled": true,
+                                                                "hoverText": "This section is being revamped. Till then it will remain disabled.",
+                                                                "injectedEvents": {}
+                                                            }
+                                                        ]
+                                                    }
+                                                ],
+                                                "actionFields": []
+                                            }
+                                        ]
+                                    },
+                                ]
+                            }
+                        ]
+                    }
+                ],
+                "type": "tabs",
+                "defaultPanes": 1,
+                "additionalPanes": 0,
+                "injectedEvents": {}
+            }
+        ],
+        "channel": "MOBILEPUSH",
+        "module": "Campaigns",
+        "type": "LAYOUT"
+    },
+    location:{
+        "pathname": "/mobilepush/create/image",
+        "query": {
+            "type": false,
+            "module": "default"
+        }
+    }
+}

package/v2Components/NewCallTask/index.js

@@ -99,7 +99,7 @@ class NewCallTask extends React.Component { // eslint-disable-line react/prefer-
   };
 
   render() {
-    const { intl, isLoading, metaEntities, selectedOfferDetails } = this.props;
+    const { intl, isLoading, metaEntities, selectedOfferDetails , injectedTags} = this.props;
     const { formatMessage } = intl;
     const { subject, messageBody, description, callTaskActionType } = this.state;
     const tags = metaEntities && metaEntities.tags ? metaEntities.tags.standard : [];
@@ -125,6 +125,7 @@ class NewCallTask extends React.Component { // eslint-disable-line react/prefer-
                   tags={tags}
                   onTagSelect={this.onTagSelect}
                   selectedOfferDetails={selectedOfferDetails}
+                  injectedTags={injectedTags}
                 />
                 <CapInput.TextArea
                   setInputRef={this.setInputRef}
@@ -177,6 +178,7 @@ NewCallTask.propTypes = {
   selectedOfferDetails: PropTypes.array,
   messageDetails: PropTypes.object,
   mode: PropTypes.string,
+  injectedTags: PropTypes.object,
 };
 
 export default injectIntl(NewCallTask);

package/v2Components/NewCallTask/tests/index.test.js

@@ -0,0 +1,36 @@
+import React from "react";
+import { injectIntl } from 'react-intl';
+import '@testing-library/jest-dom';
+import { Provider } from 'react-redux';
+import { browserHistory } from 'react-router';
+import NewCallTask from '../index';
+import configureStore from '../../../store';
+import mockData from './mockData'
+import {
+    render,
+  } from '../../../utils/test-utils';
+import { Router } from "express";
+const ComponentToRender = injectIntl(NewCallTask);
+
+const renderComponent = (props) => {
+  const store = configureStore({}, browserHistory);
+  return render(
+    <Router>
+      <Provider store={store}>
+        <ComponentToRender {...props} />
+      </Provider>
+    </Router>,
+  );
+};
+
+describe("test for NewCallTask", () => {
+  const onCallTaskSubmit = jest.fn();
+  const props = {
+    ...mockData,
+    onCallTaskSubmit,
+  };
+ 
+  it("New call task", async () => {
+    renderComponent(props);
+  });
+});

package/v2Components/NewCallTask/tests/mockData.js

@@ -0,0 +1,20 @@
+const mockData= {
+    injectedTags: {},
+    templateData: {},
+    messageDetails: {},
+    isLoading: true,
+    selectedOfferDetails: [],
+    location: {
+      pathname: "/NewCallTask",
+      query: {
+        type: false,
+        module: "default",
+      },
+    },
+    match: {
+      path: '/NewCallTask',
+      url: '/creatives/ui/v2',
+      isExact: true,
+      params: {},
+    }
+}

package/v2Containers/CallTask/index.js

@@ -16,7 +16,7 @@ import {
 } from '@capillarytech/cap-ui-library';
 import { injectIntl, intlShape } from 'react-intl';
 import { createStructuredSelector } from 'reselect';
-import { makeSelectMetaEntities, isLoadingMetaEntities } from '../Cap/selectors';
+import { makeSelectMetaEntities, isLoadingMetaEntities, setInjectedTags } from '../Cap/selectors';
 import * as globalActions from '../Cap/actions';
 import * as actions from "./actions";
 import makeSelectCallTask from './selectors';
@@ -71,7 +71,7 @@ export class CallTask extends React.Component { // eslint-disable-line react/pre
     };
   }
   render() {
-    const { intl, onCallTaskSubmit, templateData, loadingMetaEntities, metaEntities, selectedOfferDetails, messageDetails } = this.props;
+    const { intl, onCallTaskSubmit, templateData, loadingMetaEntities, metaEntities, selectedOfferDetails, messageDetails, injectedTags } = this.props;
     const { formatMessage } = intl;
     const { mode } = this.state;
     return (
@@ -85,6 +85,7 @@ export class CallTask extends React.Component { // eslint-disable-line react/pre
             onCallTaskSubmit={onCallTaskSubmit}
             selectedOfferDetails={selectedOfferDetails}
             messageDetails={messageDetails}
+            injectedTags={injectedTags || {}}
           />
           :
             <div>
@@ -144,6 +145,7 @@ const mapStateToProps = createStructuredSelector({
   CallTask: makeSelectCallTask(),
   metaEntities: makeSelectMetaEntities(),
   loadingMetaEntities: isLoadingMetaEntities(),
+  injectedTags: setInjectedTags(),
 });
 
 function mapDispatchToProps(dispatch) {

package/v2Containers/MobilePush/initialSchema.js

@@ -782,6 +782,8 @@ export const response = {
                                       supportedEvents: [
                                         "addSecondaryCtaIos",
                                       ],
+                                      disabled: true,
+                                      hoverText: "This section is being revamped. Till then it will remain disabled.",
                                     },
                                   ],
                                 },
@@ -1688,8 +1690,10 @@ export const response = {
                                       },
                                       submitAction: "addSecondaryCtaIos",
                                       supportedEvents: [
-                                        "addSecondaryCtaIos",
+                                        "addSecondaryCtaIos"
                                       ],
+                                      disabled: true,
+                                      hoverText: "This section is being revamped. Till then it will remain disabled.",
                                     },
                                   ],
                                 },