@bigbinary/neeto-rules-frontend 0.8.0-beta1 → 0.8.1

package/dist/index.cjs.js

@@ -16,17 +16,26 @@ var ramda = require('ramda');
 var reactI18next = require('react-i18next');
 var jsxRuntime = require('react/jsx-runtime');
 var i18next = require('i18next');
+var constants = require('@bigbinary/neeto-commons-frontend/constants');
+var SubHeader = require('@bigbinary/neeto-molecules/SubHeader');
+var TableWrapper = require('@bigbinary/neeto-molecules/TableWrapper');
+var Alert = require('@bigbinary/neetoui/Alert');
+var NoData = require('@bigbinary/neetoui/NoData');
+var Table = require('@bigbinary/neetoui/Table');
+var reactQuery = require('react-query');
+var axios = require('axios');
+var utils = require('@bigbinary/neeto-commons-frontend/utils');
+var Switch = require('@bigbinary/neetoui/Switch');
+var reactRouterDom = require('react-router-dom');
 var ReactDOM = require('react-dom');
 var Pagination = require('@bigbinary/neetoui/Pagination');
-var reactRouterDom = require('react-router-dom');
 var shallow = require('zustand/shallow');
 var classNames$1 = require('classnames');
 var formik = require('formik');
 var ActionBlock = require('@bigbinary/neetoui/formik/ActionBlock');
 var PhoneNumber = require('@bigbinary/neeto-molecules/PhoneNumber');
 var yup = require('yup');
-var neetoEditor = require('@bigbinary/neeto-editor');
-var utils = require('@bigbinary/neeto-commons-frontend/utils');
+var utils$1 = require('@bigbinary/neeto-editor/utils');
 var Dropdown$1 = require('@bigbinary/neetoui/Dropdown');
 var Input$2 = require('@bigbinary/neetoui/Input');
 var Textarea = require('@bigbinary/neetoui/formik/Textarea');
@@ -34,6 +43,7 @@ var Label = require('@bigbinary/neetoui/Label');
 var Select$1 = require('@bigbinary/neetoui/Select');
 var dayjs = require('dayjs');
 var DatePicker = require('@bigbinary/neetoui/DatePicker');
+var FormikEditor = require('@bigbinary/neeto-editor/FormikEditor');
 var MultiEmailInput = require('@bigbinary/neetoui/formik/MultiEmailInput');
 var Input$3 = require('@bigbinary/neetoui/formik/Input');
 var useHotkeys = require('@bigbinary/neeto-hotkeys');
@@ -70,6 +80,13 @@ var PageLoader__default = /*#__PURE__*/_interopDefaultLegacy(PageLoader);
 var Pane__default = /*#__PURE__*/_interopDefaultLegacy(Pane);
 var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
+var SubHeader__default = /*#__PURE__*/_interopDefaultLegacy(SubHeader);
+var TableWrapper__default = /*#__PURE__*/_interopDefaultLegacy(TableWrapper);
+var Alert__default = /*#__PURE__*/_interopDefaultLegacy(Alert);
+var NoData__default = /*#__PURE__*/_interopDefaultLegacy(NoData);
+var Table__default = /*#__PURE__*/_interopDefaultLegacy(Table);
+var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
+var Switch__default = /*#__PURE__*/_interopDefaultLegacy(Switch);
 var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 var Pagination__default = /*#__PURE__*/_interopDefaultLegacy(Pagination);
 var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames$1);
@@ -82,6 +99,7 @@ var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
 var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select$1);
 var dayjs__default = /*#__PURE__*/_interopDefaultLegacy(dayjs);
 var DatePicker__default = /*#__PURE__*/_interopDefaultLegacy(DatePicker);
+var FormikEditor__default = /*#__PURE__*/_interopDefaultLegacy(FormikEditor);
 var MultiEmailInput__default = /*#__PURE__*/_interopDefaultLegacy(MultiEmailInput);
 var Input__default$1 = /*#__PURE__*/_interopDefaultLegacy(Input$3);
 var useHotkeys__default = /*#__PURE__*/_interopDefaultLegacy(useHotkeys);
@@ -211,6 +229,24 @@ var Title = function Title(_ref) {
   });
 };
 
+var PREVIEW_CONDITION_LIMIT = 3;
+var ACTION_TYPE = {
+  TEXT: "text",
+  NUMBER: "number",
+  DECIMAL: "decimal",
+  REGEX: "regex",
+  DATE: "date",
+  EMAIL: "email",
+  EMAIL_TO: "emailTo",
+  EMAIL_TO_IDS: "emailToIds",
+  SMS_TO_NUMBERS: "smsToNumbers",
+  MULTI_SELECT: "multiSelect",
+  SEND_TO_API: "sendToApi",
+  DROPDOWN: "dropdown",
+  MULTISELECT: "multiSelect"
+};
+var TEXT_FIELDS = [ACTION_TYPE.TEXT, ACTION_TYPE.NUMBER, ACTION_TYPE.DECIMAL, ACTION_TYPE.REGEX, ACTION_TYPE.DATE];
+
 var MultiSelectValues = function MultiSelectValues(_ref) {
   var separator = _ref.separator,
     values = _ref.values;
@@ -239,6 +275,48 @@ var getEntityDisplayValue = function getEntityDisplayValue(entitiy, entitiyOptio
     value: entitiy.metadata.value
   }, entitiyOption.dropdownOptions)) === null || _findBy === void 0 || (_findBy = _findBy.label) === null || _findBy === void 0 ? void 0 : _findBy.toLowerCase();
 };
+var getActionDisplayValue = function getActionDisplayValue(action, actionOption) {
+  var displayValueData = {
+    displayValue: null,
+    isBulk: false
+  };
+  if (TEXT_FIELDS.includes(actionOption.type)) {
+    var _action$metadata$valu;
+    displayValueData.displayValue = (_action$metadata$valu = action.metadata.value) === null || _action$metadata$valu === void 0 ? void 0 : _action$metadata$valu.toLowerCase();
+    return displayValueData;
+  }
+  switch (actionOption.type) {
+    case ACTION_TYPE.DROPDOWN:
+      {
+        displayValueData.displayValue = getEntityDisplayValue(action, actionOption);
+        return displayValueData;
+      }
+    case ACTION_TYPE.EMAIL_TO_IDS:
+      {
+        displayValueData.isBulk = true;
+        displayValueData.displayValue = action.metadata.emails;
+        return displayValueData;
+      }
+    case ACTION_TYPE.EMAIL_TO:
+      {
+        displayValueData.displayValue = action.displayValue;
+        return displayValueData;
+      }
+    case ACTION_TYPE.SMS_TO_NUMBERS:
+      {
+        displayValueData.isBulk = true;
+        displayValueData.displayValue = action.metadata.phoneNumbers;
+        return displayValueData;
+      }
+    case ACTION_TYPE.SEND_TO_API:
+      {
+        displayValueData.displayValue = action.metadata.endpoint;
+        return displayValueData;
+      }
+    default:
+      return null;
+  }
+};
 
 var ActionsDetail = function ActionsDetail(_ref) {
   var actions = _ref.actions;
@@ -256,9 +334,26 @@ var ActionsDetail = function ActionsDetail(_ref) {
     }) : t("neetoRules.common.then");
   };
   var renderActionValues = function renderActionValues(action, actionOption) {
-    if (actionOption.type === "dropdown") {
-      var _actionOption$separat;
-      var separator = (actionOption === null || actionOption === void 0 || (_actionOption$separat = actionOption.separator) === null || _actionOption$separat === void 0 ? void 0 : _actionOption$separat.toLowerCase()) || t("neetoRules.common.to");
+    var _actionOption$separat, _getActionDisplayValu;
+    var commonSeperator = actionOption.type === ACTION_TYPE.SEND_TO_API ? t("neetoRules.common.at") : t("neetoRules.common.to");
+    var separator = (actionOption === null || actionOption === void 0 || (_actionOption$separat = actionOption.separator) === null || _actionOption$separat === void 0 ? void 0 : _actionOption$separat.toLowerCase()) || commonSeperator;
+    var _ref2 = (_getActionDisplayValu = getActionDisplayValue(action, actionOption)) !== null && _getActionDisplayValu !== void 0 ? _getActionDisplayValu : {},
+      displayValue = _ref2.displayValue,
+      isBulk = _ref2.isBulk;
+    if (actionOption.type === ACTION_TYPE.MULTISELECT) {
+      var values = ramda.pluck("label", actionOption.dropdownOptions.filter(function (_ref3) {
+        var value = _ref3.value;
+        return action.metadata.value.includes(value);
+      }));
+      return /*#__PURE__*/jsxRuntime.jsx(MultiSelectValues, {
+        values: values,
+        separator: t("neetoRules.common.and", {
+          what: ""
+        })
+      });
+    }
+    if (!displayValue) return null;
+    if (!isBulk) {
       return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
           className: "neeto-ui-text-gray-700",
@@ -269,23 +364,20 @@ var ActionsDetail = function ActionsDetail(_ref) {
           className: "neeto-ui-text-gray-800",
           style: "h5",
           weight: "semibold",
-          children: getEntityDisplayValue(action, actionOption)
+          children: displayValue === null || displayValue === void 0 ? void 0 : displayValue.toLowerCase()
         })]
       });
     }
-    if (actionOption.type === "multiSelect") {
-      var values = ramda.pluck("label", actionOption.dropdownOptions.filter(function (_ref2) {
-        var value = _ref2.value;
-        return action.metadata.value.includes(value);
-      }));
-      return /*#__PURE__*/jsxRuntime.jsx(MultiSelectValues, {
-        values: values,
-        separator: t("neetoRules.common.and", {
-          what: ""
-        })
-      });
-    }
-    return null;
+    return displayValue.map(function (value, index) {
+      return /*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "mr-1 flex",
+        children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+          style: "h5",
+          weight: "semibold",
+          children: value
+        }, index), index !== displayValue.length - 1 && ", "]
+      }, index);
+    });
   };
   var renderAction = function renderAction(action) {
     var actionOption = neetoCist.findBy({
@@ -306,6 +398,7 @@ var ActionsDetail = function ActionsDetail(_ref) {
     children: [allActions.map(function (action, index) {
       return /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: "mb-2 flex flex-wrap gap-x-1 gap-y-2",
+        "data-cy": "then-action-events",
         children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
           className: "neeto-ui-text-gray-700",
           style: "h5",
@@ -330,10 +423,68 @@ var ActionsDetail = function ActionsDetail(_ref) {
   });
 };
 
+var OPERATORS$1 = {
+  or: "or_operator",
+  and: "and_operator"
+};
+var OPERATOR_LABELS = {
+  or_operator: i18next.t("neetoRules.operators.or"),
+  and_operator: i18next.t("neetoRules.operators.and")
+};
+var VERB_LABELS = {
+  is: i18next.t("neetoRules.conditionVerbs.is"),
+  is_not: i18next.t("neetoRules.conditionVerbs.isNot"),
+  contains: i18next.t("neetoRules.conditionVerbs.contains"),
+  does_not_contain: i18next.t("neetoRules.conditionVerbs.doesNotContain"),
+  contains_any_of: i18next.t("neetoRules.conditionVerbs.containsAnyOf"),
+  contains_all_of: i18next.t("neetoRules.conditionVerbs.containsAllOf"),
+  contains_none_of: i18next.t("neetoRules.conditionVerbs.containsNoneOf"),
+  starts_with: i18next.t("neetoRules.conditionVerbs.startsWith"),
+  ends_with: i18next.t("neetoRules.conditionVerbs.endsWith"),
+  less_than: i18next.t("neetoRules.conditionVerbs.lessThan"),
+  greater_than: i18next.t("neetoRules.conditionVerbs.greaterThan"),
+  any_time: i18next.t("neetoRules.conditionVerbs.anyTime"),
+  during: i18next.t("neetoRules.conditionVerbs.during"),
+  not_during: i18next.t("neetoRules.conditionVerbs.notDuring"),
+  any_of: i18next.t("neetoRules.conditionVerbs.anyOf"),
+  none_of: i18next.t("neetoRules.conditionVerbs.noneOf"),
+  is_before: i18next.t("neetoRules.conditionVerbs.isBefore"),
+  is_after: i18next.t("neetoRules.conditionVerbs.isAfter")
+};
+var CONDITION_VALUE_TYPES = {
+  text: "text",
+  number: "number",
+  decimal: "decimal",
+  url: "url",
+  email: "email",
+  dropdown: "dropdown",
+  multiSelect: "multi-select",
+  multiSelectCreate: "multi-select-create",
+  date: "date",
+  regex: "regex",
+  textarea: "textarea"
+};
+var INPUT_FIELD_TYPES = ["email", "text", "number", "decimal", "url", "regex"];
+var MAXIMUM_OPTION_LENGTH$3 = 7;
+
+function ownKeys$u(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$s(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$u(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$u(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ConditionsDetail = function ConditionsDetail(_ref) {
   var conditions = _ref.conditions,
     conditionOptions = _ref.conditionOptions,
-    conditionVerbs = _ref.conditionVerbs;
+    _ref$conditionVerbs = _ref.conditionVerbs,
+    conditionVerbs = _ref$conditionVerbs === void 0 ? {} : _ref$conditionVerbs,
+    _ref$hasEvent = _ref.hasEvent,
+    hasEvent = _ref$hasEvent === void 0 ? true : _ref$hasEvent;
+  var _useState = React.useState(false),
+    _useState2 = _slicedToArray$1(_useState, 2),
+    viewMore = _useState2[0],
+    setViewMore = _useState2[1];
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var conditionsList = conditions.value;
+  var allConditions = viewMore && conditionsList.length > PREVIEW_CONDITION_LIMIT ? conditionsList : conditionsList.slice(0, PREVIEW_CONDITION_LIMIT);
+  var allConditionVerbs = _objectSpread$s(_objectSpread$s({}, VERB_LABELS), conditionVerbs);
   var getLogicOperator = function getLogicOperator(joinType) {
     return joinType === "or_operator" ? "or" : "and";
   };
@@ -354,7 +505,7 @@ var ConditionsDetail = function ConditionsDetail(_ref) {
       }));
       return /*#__PURE__*/jsxRuntime.jsx(MultiSelectValues, {
         values: values,
-        separator: i18next.t("neetoRules.common.or")
+        separator: t("neetoRules.common.or")
       });
     }
     if (conditionOption.type === "dropdown") {
@@ -368,12 +519,12 @@ var ConditionsDetail = function ConditionsDetail(_ref) {
     return null;
   };
   var renderCondition = function renderCondition(condition) {
-    var _conditionVerbs$condi;
+    var _allConditionVerbs$co;
     var conditionOption = neetoCist.findBy({
       value: condition.field
     }, conditionOptions);
     if (!conditionOption) return null;
-    var conditionVerb = (_conditionVerbs$condi = conditionVerbs[condition.verb]) === null || _conditionVerbs$condi === void 0 ? void 0 : _conditionVerbs$condi.toLowerCase();
+    var conditionVerb = (_allConditionVerbs$co = allConditionVerbs[condition.verb]) === null || _allConditionVerbs$co === void 0 ? void 0 : _allConditionVerbs$co.toLowerCase();
     return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
         className: "neeto-ui-text-gray-800",
@@ -388,31 +539,46 @@ var ConditionsDetail = function ConditionsDetail(_ref) {
       }), renderConditionValues(condition, conditionOption)]
     });
   };
-  return /*#__PURE__*/jsxRuntime.jsx("div", {
-    className: "mt-2",
-    children: conditions.map(function (condition, index) {
-      return /*#__PURE__*/jsxRuntime.jsxs("div", {
-        className: "mb-2 flex flex-wrap gap-x-2 gap-y-2",
-        children: [!index && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
-          className: "neeto-ui-text-gray-700",
-          style: "h5",
-          weight: "normal",
-          children: i18next.t("neetoRules.common.and", {
-            what: ""
-          })
-        }), !!index && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
-          className: "neeto-ui-text-gray-800",
-          style: "h5",
-          weight: "semibold",
-          children: getLogicOperator(condition.joinType)
-        }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
-          className: "neeto-ui-text-gray-700",
-          style: "h5",
-          weight: "normal",
-          children: i18next.t("neetoRules.common.when").toLowerCase()
-        }), renderCondition(condition)]
-      }, condition.id);
-    })
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "mt-2",
+      children: allConditions.map(function (condition, index) {
+        return /*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "mb-2 flex flex-wrap gap-x-2 gap-y-2",
+          children: [!index && hasEvent && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+            className: "neeto-ui-text-gray-700",
+            style: "h5",
+            weight: "normal",
+            children: t("neetoRules.common.and", {
+              what: ""
+            })
+          }), !!index && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+            className: "neeto-ui-text-gray-800",
+            style: "h5",
+            weight: "semibold",
+            children: getLogicOperator(condition.joinType)
+          }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+            className: "neeto-ui-text-gray-700",
+            style: "h5",
+            weight: "normal",
+            children: t("neetoRules.common.when")
+          }), renderCondition(condition)]
+        }, condition.id);
+      })
+    }), conditionsList.length > 3 && /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "mt-3 w-full",
+      children: /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
+        icon: !viewMore ? neetoIcons.Down : neetoIcons.Up,
+        size: "small",
+        style: "link",
+        label: !viewMore ? t("neetoRules.common.viewMore") : t("neetoRules.common.viewLess"),
+        onClick: function onClick() {
+          return setViewMore(function (prevState) {
+            return !prevState;
+          });
+        }
+      })
+    })]
   });
 };
 
@@ -421,23 +587,20 @@ var EventsDetail = function EventsDetail(_ref) {
   var events = _ref.events,
     performer = _ref.performer,
     conditions = _ref.conditions;
-  var _useState = React.useState(false),
-    _useState2 = _slicedToArray$1(_useState, 2),
-    viewMore = _useState2[0],
-    setViewMore = _useState2[1];
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
   var eventNames = ramda.pluck("name", events.value);
   var allEvents = events.eventOptions.filter(function (event) {
     return eventNames === null || eventNames === void 0 ? void 0 : eventNames.includes(event.value);
   });
-  var conditionsList = conditions.value;
-  var allConditions = viewMore && conditionsList.length > 3 ? conditionsList : conditionsList.slice(0, 3);
   var currentPerformer = neetoCist.findBy({
     value: performer.value
   }, performer.options);
   return /*#__PURE__*/jsxRuntime.jsxs(Title, {
-    title: i18next.t("neetoRules.common.when"),
+    title: t("neetoRules.common.when"),
     children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex flex-wrap gap-x-2 gap-y-2",
+      "data-cy": "when-condition-events",
       children: [allEvents.map(function (event, index) {
         return /*#__PURE__*/jsxRuntime.jsxs("div", {
           className: "flex gap-x-2",
@@ -445,12 +608,12 @@ var EventsDetail = function EventsDetail(_ref) {
             className: "neeto-ui-text-gray-700 my-auto",
             style: "h5",
             weight: "normal",
-            children: i18next.t("neetoRules.common.when")
+            children: t("neetoRules.common.when")
           }), !!index && /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
             className: "neeto-ui-text-gray-700 my-auto",
             style: "h5",
             weight: "normal",
-            children: i18next.t("neetoRules.common.or")
+            children: t("neetoRules.common.or")
           }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
             className: "neeto-ui-text-gray-800",
             style: "h5",
@@ -462,7 +625,7 @@ var EventsDetail = function EventsDetail(_ref) {
         className: "neeto-ui-text-gray-700",
         style: "h5",
         weight: "normal",
-        children: i18next.t("neetoRules.common.by")
+        children: t("neetoRules.common.by")
       }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
         className: "neeto-ui-text-gray-800",
         style: "h5",
@@ -470,30 +633,18 @@ var EventsDetail = function EventsDetail(_ref) {
         children: currentPerformer === null || currentPerformer === void 0 || (_currentPerformer$lab = currentPerformer.label) === null || _currentPerformer$lab === void 0 ? void 0 : _currentPerformer$lab.toLowerCase()
       })]
     }), /*#__PURE__*/jsxRuntime.jsx(ConditionsDetail, {
+      conditions: conditions,
       conditionOptions: conditions.conditionOptions,
-      conditionVerbs: conditions.verbs,
-      conditions: allConditions
-    }), conditionsList.length > 3 && /*#__PURE__*/jsxRuntime.jsx("div", {
-      className: "mt-3 w-full",
-      children: /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
-        icon: !viewMore ? neetoIcons.Down : neetoIcons.Up,
-        size: "small",
-        style: "link",
-        label: !viewMore ? i18next.t("neetoRules.common.viewMore") : i18next.t("neetoRules.common.viewLess"),
-        onClick: function onClick() {
-          return setViewMore(function (prevState) {
-            return !prevState;
-          });
-        }
-      })
+      conditionVerbs: conditions.verbs
     })]
   });
 };
 
-function ownKeys$q(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread$o(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$q(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$q(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var RulePreview = function RulePreview(_ref) {
-  var isLoading = _ref.isLoading,
+function ownKeys$t(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$r(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$t(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$t(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var RulePreview = reactUtils.withT(function (_ref) {
+  var t = _ref.t,
+    isLoading = _ref.isLoading,
     ruleDetails = _ref.ruleDetails,
     isOpen = _ref.isOpen,
     onClose = _ref.onClose,
@@ -511,7 +662,7 @@ var RulePreview = function RulePreview(_ref) {
             style: "h4",
             weight: "semibold",
             children: ruleDetails.name.value
-          }), neetoCist.isNotEmpty(moreDropdownProps) && /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], _objectSpread$o({}, moreDropdownProps))]
+          }), neetoCist.isNotEmpty(moreDropdownProps) && /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], _objectSpread$r({}, moreDropdownProps))]
         })
       }), /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Body, {
         children: /*#__PURE__*/jsxRuntime.jsxs("div", {
@@ -536,10 +687,18 @@ var RulePreview = function RulePreview(_ref) {
                 children: ruleDetails.entity.value
               })]
             })]
-          }), /*#__PURE__*/jsxRuntime.jsx(EventsDetail, {
+          }), ruleDetails.events && neetoCist.isNotEmpty(ruleDetails.events) ? /*#__PURE__*/jsxRuntime.jsx(EventsDetail, {
             conditions: ruleDetails.conditions,
             events: ruleDetails.events,
             performer: ruleDetails.performer
+          }) : /*#__PURE__*/jsxRuntime.jsx(Title, {
+            title: t("neetoRules.common.when"),
+            children: /*#__PURE__*/jsxRuntime.jsx(ConditionsDetail, {
+              conditionOptions: ruleDetails.conditions.conditionOptions,
+              conditionVerbs: ruleDetails.conditions.verbs,
+              conditions: ruleDetails.conditions,
+              hasEvent: false
+            })
           }), /*#__PURE__*/jsxRuntime.jsx(ActionsDetail, {
             actions: ruleDetails.actions
           })]
@@ -547,6 +706,419 @@ var RulePreview = function RulePreview(_ref) {
       })]
     })
   });
+});
+
+function _objectWithoutPropertiesLoose$2(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+
+function _objectWithoutProperties$1(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose$2(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
+var _excluded$k = ["url"];
+var fetch = function fetch(_ref) {
+  var url = _ref.url,
+    params = _objectWithoutProperties$1(_ref, _excluded$k);
+  return axios__default["default"].get(url, {
+    params: params
+  });
+};
+var update$1 = function update(_ref2) {
+  var url = _ref2.url,
+    id = _ref2.id,
+    payload = _ref2.payload;
+  return axios__default["default"].patch("".concat(url, "/").concat(id), payload);
+};
+var clone = function clone(_ref3) {
+  var url = _ref3.url,
+    id = _ref3.id;
+  return axios__default["default"].post("".concat(url, "/").concat(id, "/clone"));
+};
+var destroy = function destroy(_ref4) {
+  var url = _ref4.url,
+    id = _ref4.id;
+  return axios__default["default"]["delete"]("".concat(url, "/").concat(id));
+};
+var automationRulesApi = {
+  fetch: fetch,
+  update: update$1,
+  clone: clone,
+  destroy: destroy
+};
+
+//TODO: Remove if not used
+var AUTOMATION_RULES = "automation-rules";
+var STALE_TIME = 3200000;
+
+function ownKeys$s(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$q(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$s(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$s(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var useFetchAutomationRules = function useFetchAutomationRules(params) {
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return reactQuery.useQuery([AUTOMATION_RULES, params], function () {
+    return automationRulesApi.fetch(params);
+  }, _objectSpread$q({
+    staleTime: STALE_TIME,
+    select: function select(response) {
+      return response.data || response;
+    },
+    keepPreviousData: true
+  }, options));
+};
+var useUpdateAutomationRule = function useUpdateAutomationRule() {
+  return reactUtils.useMutationWithInvalidation(automationRulesApi.update, {
+    keysToInvalidate: [AUTOMATION_RULES]
+  });
+};
+var useCloneAutomationRule = function useCloneAutomationRule() {
+  return reactUtils.useMutationWithInvalidation(automationRulesApi.clone, {
+    keysToInvalidate: [AUTOMATION_RULES]
+  });
+};
+var useDeleteAutomationRule = function useDeleteAutomationRule() {
+  return reactUtils.useMutationWithInvalidation(automationRulesApi.destroy, {
+    keysToInvalidate: [AUTOMATION_RULES]
+  });
+};
+
+var createRoutes = function createRoutes(basePath) {
+  return {
+    index: basePath,
+    "new": "".concat(basePath, "/new"),
+    edit: "".concat(basePath, "/:ruleId/edit")
+  };
+};
+
+var STATUS_KEYS = {
+  ENABLED: "enabled",
+  DISABLED: "disabled"
+};
+var DEFAULT_INIT_PAGE = 1;
+
+function _arrayWithoutHoles$1(arr) {
+  if (Array.isArray(arr)) return _arrayLikeToArray$1(arr);
+}
+
+function _iterableToArray$1(iter) {
+  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+
+function _nonIterableSpread$1() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _toConsumableArray$1(arr) {
+  return _arrayWithoutHoles$1(arr) || _iterableToArray$1(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableSpread$1();
+}
+
+var DisableMessage = reactUtils.withT(function (_ref) {
+  var t = _ref.t,
+    disabledReason = _ref.disabledReason;
+  return ramda.isNotNil(disabledReason) && /*#__PURE__*/jsxRuntime.jsx("div", {
+    children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+      "class": "text-red-600",
+      component: "span",
+      style: "body2",
+      children: t(disabledReason)
+    })
+  });
+});
+
+var _excluded$j = ["onClick"],
+  _excluded2 = ["handleChangeStatus", "additionalColumns", "onPreview"];
+function ownKeys$r(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$p(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$r(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$r(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var buildActionDropdownMenuItems = function buildActionDropdownMenuItems(_ref) {
+  var rule = _ref.rule,
+    onClone = _ref.onClone,
+    onDelete = _ref.onDelete,
+    _ref$moreDropdownItem = _ref.moreDropdownItems,
+    moreDropdownItems = _ref$moreDropdownItem === void 0 ? [] : _ref$moreDropdownItem,
+    automationRulesPath = _ref.automationRulesPath;
+  return [].concat(_toConsumableArray$1(moreDropdownItems.map(function (_ref2) {
+    var _onClick = _ref2.onClick,
+      others = _objectWithoutProperties$1(_ref2, _excluded$j);
+    return _objectSpread$p(_objectSpread$p({}, others), {}, {
+      onClick: function onClick() {
+        return _onClick(rule);
+      }
+    });
+  })), [{
+    key: "edit",
+    className: "neeto-ui-btn",
+    "data-test-id": "automation-rules-edit-link",
+    label: i18next.t("neetoRules.button.edit"),
+    to: utils.buildUrl(createRoutes(automationRulesPath).edit, {
+      ruleId: rule.id
+    })
+  }, {
+    key: "clone",
+    "data-test-id": "automation-rules-clone-link",
+    label: i18next.t("neetoRules.button.clone"),
+    onClick: function onClick() {
+      return onClone(rule.id);
+    }
+  }, {
+    key: "delete",
+    "data-test-id": "automation-rules-delete-link",
+    label: i18next.t("neetoRules.button.delete"),
+    onClick: function onClick() {
+      return onDelete(rule);
+    }
+  }]);
+};
+var getColumnData = function getColumnData(_ref3) {
+  var handleChangeStatus = _ref3.handleChangeStatus,
+    _ref3$additionalColum = _ref3.additionalColumns,
+    additionalColumns = _ref3$additionalColum === void 0 ? [] : _ref3$additionalColum,
+    onPreview = _ref3.onPreview,
+    otherProps = _objectWithoutProperties$1(_ref3, _excluded2);
+  return [{
+    title: i18next.t("neetoRules.labels.name"),
+    dataIndex: "name",
+    key: "name",
+    ellipsis: true,
+    width: 440,
+    render: function render(name, rule) {
+      return /*#__PURE__*/jsxRuntime.jsxs("div", {
+        children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+          className: "flex items-center justify-between gap-x-3",
+          children: [/*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
+            className: "whitespace-pre-line break-words text-left",
+            style: "link",
+            onClick: function onClick() {
+              return onPreview(rule.id);
+            },
+            children: name
+          }), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], {
+            dropdownProps: {
+              strategy: "fixed"
+            },
+            menuItems: buildActionDropdownMenuItems(_objectSpread$p({
+              rule: rule
+            }, otherProps))
+          })]
+        }), /*#__PURE__*/jsxRuntime.jsx(DisableMessage, {
+          disabledReason: rule.disabledReason
+        })]
+      });
+    }
+  }, {
+    title: i18next.t("neetoRules.labels.description"),
+    dataIndex: "description",
+    key: "description",
+    width: 390,
+    render: function render(description) {
+      return /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+        className: "whitespace-pre-line break-words",
+        style: "body2",
+        children: description
+      });
+    }
+  }, {
+    title: i18next.t("neetoRules.labels.active"),
+    key: "active",
+    width: 100,
+    align: "center",
+    render: function render(_, rule) {
+      return /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "flex justify-center",
+        children: /*#__PURE__*/jsxRuntime.jsx(Switch__default["default"], {
+          checked: rule.status === STATUS_KEYS.ENABLED,
+          "data-test-id": "automation-rules-state-switch-row",
+          disabled: !!rule.disabledReason,
+          onChange: function onChange(e) {
+            handleChangeStatus(e, rule.id);
+          }
+        })
+      });
+    }
+  }].concat(_toConsumableArray$1(additionalColumns));
+};
+var renderNoDataHelpText = function renderNoDataHelpText(helpDocUrl) {
+  return /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
+    i18nKey: "neetoRules.noData.helpText",
+    components: {
+      a: /*#__PURE__*/jsxRuntime.jsx(reactRouterDom.Link, {
+        className: "neeto-ui-text-primary-600 underline",
+        target: "_blank",
+        to: {
+          pathname: helpDocUrl
+        }
+      })
+    }
+  });
+};
+
+function ownKeys$q(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$o(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$q(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$q(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var RulesTable = function RulesTable(_ref) {
+  var url = _ref.automationRulesEndpoint,
+    additionalColumns = _ref.additionalColumns,
+    _ref$automationRulesP = _ref.automationRulesPath,
+    automationRulesPath = _ref$automationRulesP === void 0 ? "/" : _ref$automationRulesP,
+    onPreview = _ref.onPreview,
+    _ref$helpDocUrl = _ref.helpDocUrl,
+    helpDocUrl = _ref$helpDocUrl === void 0 ? null : _ref$helpDocUrl,
+    _ref$moreDropdownItem = _ref.moreDropdownItems,
+    moreDropdownItems = _ref$moreDropdownItem === void 0 ? [] : _ref$moreDropdownItem;
+  var _useState = React.useState(null),
+    _useState2 = _slicedToArray$1(_useState, 2),
+    selectedRule = _useState2[0],
+    setSelectedRule = _useState2[1];
+  var _useState3 = React.useState(DEFAULT_INIT_PAGE),
+    _useState4 = _slicedToArray$1(_useState3, 2),
+    page = _useState4[0],
+    setPage = _useState4[1];
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var _useQueryParams = reactUtils.useQueryParams(),
+    _useQueryParams$searc = _useQueryParams.searchTerm,
+    searchTerm = _useQueryParams$searc === void 0 ? "" : _useQueryParams$searc;
+  var _useFetchAutomationRu = useFetchAutomationRules({
+      url: url,
+      page: page,
+      pageSize: constants.DEFAULT_PAGE_SIZE,
+      searchTerm: searchTerm
+    }),
+    _useFetchAutomationRu2 = _useFetchAutomationRu.data,
+    _useFetchAutomationRu3 = _useFetchAutomationRu2 === void 0 ? {} : _useFetchAutomationRu2,
+    _useFetchAutomationRu4 = _useFetchAutomationRu3.rules,
+    rules = _useFetchAutomationRu4 === void 0 ? [] : _useFetchAutomationRu4,
+    _useFetchAutomationRu5 = _useFetchAutomationRu3.totalCount,
+    totalCount = _useFetchAutomationRu5 === void 0 ? 0 : _useFetchAutomationRu5,
+    isLoading = _useFetchAutomationRu.isLoading;
+  var _useUpdateAutomationR = useUpdateAutomationRule(),
+    updateRule = _useUpdateAutomationR.mutate,
+    isUpdating = _useUpdateAutomationR.isLoading;
+  var _useCloneAutomationRu = useCloneAutomationRule(),
+    cloneRule = _useCloneAutomationRu.mutate,
+    isCloning = _useCloneAutomationRu.isLoading;
+  var _useDeleteAutomationR = useDeleteAutomationRule(),
+    deleteRule = _useDeleteAutomationR.mutate,
+    isDeleting = _useDeleteAutomationR.isLoading;
+  var handleChangeStatus = function handleChangeStatus(event, id) {
+    var status = event.target.checked ? STATUS_KEYS.ENABLED : STATUS_KEYS.DISABLED;
+    var payload = {
+      rule: {
+        status: status
+      }
+    };
+    updateRule({
+      id: id,
+      url: url,
+      payload: payload
+    });
+  };
+  var columnData = getColumnData({
+    handleChangeStatus: handleChangeStatus,
+    additionalColumns: additionalColumns,
+    onClone: function onClone(id) {
+      return cloneRule({
+        id: id,
+        url: url
+      });
+    },
+    onDelete: setSelectedRule,
+    onPreview: onPreview,
+    automationRulesPath: automationRulesPath,
+    moreDropdownItems: moreDropdownItems
+  });
+  if (isLoading) {
+    return /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {});
+  }
+  if (ramda.isEmpty(rules)) {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex h-full w-full items-center justify-center",
+      children: /*#__PURE__*/jsxRuntime.jsx(NoData__default["default"], _objectSpread$o({
+        title: t("neetoRules.noData.title")
+      }, ramda.isEmpty(searchTerm) && {
+        helpText: helpDocUrl ? renderNoDataHelpText(helpDocUrl) : null,
+        primaryButtonProps: {
+          label: t("neetoRules.button.addNew"),
+          to: createRoutes(automationRulesPath)["new"]
+        }
+      }))
+    });
+  }
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(SubHeader__default["default"], {
+      leftActionBlock: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+        className: "mr-4 font-semibold",
+        style: "h4",
+        children: t("neetoRules.common.automationRuleWithCount", {
+          count: totalCount
+        })
+      })
+    }), /*#__PURE__*/jsxRuntime.jsx(TableWrapper__default["default"], {
+      hasPagination: totalCount > constants.DEFAULT_PAGE_SIZE,
+      children: /*#__PURE__*/jsxRuntime.jsx(Table__default["default"], {
+        columnData: columnData,
+        totalCount: totalCount,
+        fixedHeight: true,
+        allowClick: false,
+        currentPageNumber: page,
+        defaultPageSize: constants.DEFAULT_PAGE_SIZE,
+        handlePageChange: setPage,
+        loading: isUpdating || isLoading || isCloning || isDeleting,
+        rowData: rules.map(function (item) {
+          return _objectSpread$o({
+            key: item.id
+          }, item);
+        }),
+        rowSelection: false,
+        scroll: {
+          x: 0
+        },
+        tableLayout: "fixed"
+      })
+    }), /*#__PURE__*/jsxRuntime.jsx(Alert__default["default"], {
+      isOpen: !!selectedRule,
+      isSubmitting: isDeleting,
+      submitButtonLabel: t("neetoRules.button.delete"),
+      title: t("neetoRules.deleteAlert.title"),
+      message: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
+        i18nKey: "neetoRules.deleteAlert.message",
+        values: {
+          name: selectedRule === null || selectedRule === void 0 ? void 0 : selectedRule.name
+        }
+      }),
+      onClose: function onClose() {
+        return setSelectedRule(null);
+      },
+      onSubmit: function onSubmit() {
+        return deleteRule({
+          id: selectedRule === null || selectedRule === void 0 ? void 0 : selectedRule.id,
+          url: url
+        }, {
+          onSuccess: function onSuccess() {
+            return setSelectedRule(null);
+          }
+        });
+      }
+    })]
+  });
 };
 
 function _typeof$2(o) {
@@ -1147,7 +1719,7 @@ function _extends$2() {
   }, _extends$2.apply(null, arguments);
 }
 
-function _objectWithoutPropertiesLoose$2(r, e) {
+function _objectWithoutPropertiesLoose$1(r, e) {
   if (null == r) return {};
   var t = {};
   for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
@@ -1381,7 +1953,7 @@ function finalPropsSelectorFactory(dispatch, _ref) {
     initMapDispatchToProps,
     initMergeProps
   } = _ref,
-      options = _objectWithoutPropertiesLoose$2(_ref, _excluded$i);
+      options = _objectWithoutPropertiesLoose$1(_ref, _excluded$i);
 
   const mapStateToProps = initMapStateToProps(dispatch, options);
   const mapDispatchToProps = initMapDispatchToProps(dispatch, options);
@@ -1896,7 +2468,7 @@ function connect(mapStateToProps, mapDispatchToProps, mergeProps, {
         const {
           reactReduxForwardedRef
         } = props,
-              wrapperProps = _objectWithoutPropertiesLoose$2(props, _excluded$h);
+              wrapperProps = _objectWithoutPropertiesLoose$1(props, _excluded$h);
 
         return [props.context, reactReduxForwardedRef, wrapperProps];
       }, [props]);
@@ -9763,35 +10335,6 @@ function _objectDestructuringEmpty(obj) {
   if (obj == null) throw new TypeError("Cannot destructure " + obj);
 }
 
-function _objectWithoutPropertiesLoose$1(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-
-function _objectWithoutProperties$1(source, excluded) {
-  if (source == null) return {};
-  var target = _objectWithoutPropertiesLoose$1(source, excluded);
-  var key, i;
-  if (Object.getOwnPropertySymbols) {
-    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-    for (i = 0; i < sourceSymbolKeys.length; i++) {
-      key = sourceSymbolKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-      target[key] = source[key];
-    }
-  }
-  return target;
-}
-
 var propTypes = {exports: {}};
 
 /**
@@ -9883,22 +10426,6 @@ var factoryWithThrowingShims = function() {
 var propTypesExports = propTypes.exports;
 var PropTypes = /*@__PURE__*/getDefaultExportFromCjs(propTypesExports);
 
-function _arrayWithoutHoles$1(arr) {
-  if (Array.isArray(arr)) return _arrayLikeToArray$1(arr);
-}
-
-function _iterableToArray$1(iter) {
-  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
-}
-
-function _nonIterableSpread$1() {
-  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-
-function _toConsumableArray$1(arr) {
-  return _arrayWithoutHoles$1(arr) || _iterableToArray$1(arr) || _unsupportedIterableToArray$1(arr) || _nonIterableSpread$1();
-}
-
 var ACTION_TYPES = {
   emailToIds: "emailToIds",
   email: "email",
@@ -9937,52 +10464,8 @@ var DEFAULT_RULE_ACTION = {
 };
 var EDITOR_ADDONS = ["code-block", "block-quote", "image-upload"];
 var EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-var MAXIMUM_OPTION_LENGTH$3 = 7;
-var ACTION_INPUT_TYPES = ["text", "number", "decimal", "regex"];
-
-var OPERATORS$1 = {
-  or: "or_operator",
-  and: "and_operator"
-};
-var OPERATOR_LABELS = {
-  or_operator: i18next.t("neetoRules.operators.or"),
-  and_operator: i18next.t("neetoRules.operators.and")
-};
-var VERB_LABELS = {
-  is: i18next.t("neetoRules.conditionVerbs.is"),
-  is_not: i18next.t("neetoRules.conditionVerbs.isNot"),
-  contains: i18next.t("neetoRules.conditionVerbs.contains"),
-  does_not_contain: i18next.t("neetoRules.conditionVerbs.doesNotContain"),
-  contains_any_of: i18next.t("neetoRules.conditionVerbs.containsAnyOf"),
-  contains_all_of: i18next.t("neetoRules.conditionVerbs.containsAllOf"),
-  contains_none_of: i18next.t("neetoRules.conditionVerbs.containsNoneOf"),
-  starts_with: i18next.t("neetoRules.conditionVerbs.startsWith"),
-  ends_with: i18next.t("neetoRules.conditionVerbs.endsWith"),
-  less_than: i18next.t("neetoRules.conditionVerbs.lessThan"),
-  greater_than: i18next.t("neetoRules.conditionVerbs.greaterThan"),
-  any_time: i18next.t("neetoRules.conditionVerbs.anyTime"),
-  during: i18next.t("neetoRules.conditionVerbs.during"),
-  not_during: i18next.t("neetoRules.conditionVerbs.notDuring"),
-  any_of: i18next.t("neetoRules.conditionVerbs.anyOf"),
-  none_of: i18next.t("neetoRules.conditionVerbs.noneOf"),
-  is_before: i18next.t("neetoRules.conditionVerbs.isBefore"),
-  is_after: i18next.t("neetoRules.conditionVerbs.isAfter")
-};
-var CONDITION_VALUE_TYPES = {
-  text: "text",
-  number: "number",
-  decimal: "decimal",
-  url: "url",
-  email: "email",
-  dropdown: "dropdown",
-  multiSelect: "multi-select",
-  multiSelectCreate: "multi-select-create",
-  date: "date",
-  regex: "regex",
-  textarea: "textarea"
-};
-var INPUT_FIELD_TYPES = ["email", "text", "number", "decimal", "url", "regex"];
 var MAXIMUM_OPTION_LENGTH$2 = 7;
+var ACTION_INPUT_TYPES = ["text", "number", "decimal", "regex"];
 
 function ownKeys$l(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$l(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -10095,7 +10578,7 @@ var getConditionsSchema = function getConditionsSchema(element) {
         } else if ([CONDITION_VALUE_TYPES.textarea].includes(type)) {
           return yup__namespace.object({
             value: yup__namespace.string().test("text", i18next.t("neetoRules.validations.required.text"), function (value) {
-              return !neetoEditor.isEditorEmpty(value);
+              return !utils$1.isEditorEmpty(value);
             })
           });
         }
@@ -10124,7 +10607,7 @@ var getActionsSchema = function getActionsSchema(element, customData) {
             subject: !selectedAction.hideSubject ? yup__namespace.string().required(i18next.t("neetoRules.validations.required.subject")) : schema,
             emails: selectedAction.type === ACTION_TYPES.emailToIds ? yup__namespace.array().min(1, i18next.t("neetoRules.validations.required.emailId")).required(i18next.t("neetoRules.validations.required.emailId")).of(yup__namespace.string().email(i18next.t("neetoRules.validations.inValidEmail"))) : schema,
             body: yup__namespace.string().test("body", i18next.t("neetoRules.validations.required.body"), function (value) {
-              return !neetoEditor.isEditorEmpty(value);
+              return !utils$1.isEditorEmpty(value);
             }),
             value: selectedAction.type === ACTION_TYPES.emailTo ? yup__namespace.string().required(i18next.t("neetoRules.validations.required.value")) : schema
           });
@@ -10136,7 +10619,7 @@ var getActionsSchema = function getActionsSchema(element, customData) {
               return PhoneNumber.isPhoneNumberValid(value);
             })) : schema,
             body: yup__namespace.string().test("body", i18next.t("neetoRules.validations.required.body"), function (value) {
-              return !neetoEditor.isEditorEmpty(value);
+              return !utils$1.isEditorEmpty(value);
             }),
             value: selectedAction.type === ACTION_TYPES.smsTo ? yup__namespace.string().required(i18next.t("neetoRules.validations.required.value")) : schema
           });
@@ -10159,7 +10642,7 @@ var getActionsSchema = function getActionsSchema(element, customData) {
         } else if ((selectedAction === null || selectedAction === void 0 ? void 0 : selectedAction.type) === ACTION_TYPES.note || (selectedAction === null || selectedAction === void 0 ? void 0 : selectedAction.type) === ACTION_TYPES.textarea) {
           return yup__namespace.object({
             value: yup__namespace.string().test("body", i18next.t("neetoRules.validations.required.body"), function (value) {
-              return !neetoEditor.isEditorEmpty(value);
+              return !utils$1.isEditorEmpty(value);
             })
           });
         } else if ((selectedAction === null || selectedAction === void 0 ? void 0 : selectedAction.type) === ACTION_TYPES.dropdown || (selectedAction === null || selectedAction === void 0 ? void 0 : selectedAction.type) === ACTION_TYPES.date) {
@@ -10584,6 +11067,9 @@ var setEditorContent = function setEditorContent(ref, content) {
 
 // eslint-disable-next-line react-hooks/rules-of-hooks
 var dotPath = ramda.useWith(ramda.path, [ramda.split(".")]);
+var formatAdditionalData = function formatAdditionalData(additionalData) {
+  return neetoCist.isPresent(additionalData) ? additionalData : [ADDITIONAL_DATA_INITIAL_VALUE];
+};
 
 var KeyValuePairsField = reactUtils.withT(function (_ref) {
   var t = _ref.t,
@@ -10697,7 +11183,7 @@ var ApiFields = function ApiFields(_ref) {
   var isTemplateSelectionEnabled = neetoCist.isPresent(templates);
   var handleTemplateChange = function handleTemplateChange(template) {
     setFieldValue("".concat(name, ".endpoint"), template.endpoint);
-    setFieldValue("".concat(name, ".additionalData"), template.additionalData);
+    setFieldValue("".concat(name, ".additionalData"), formatAdditionalData(template.additionalData));
   };
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
@@ -11066,7 +11552,7 @@ var DropdownField$1 = function DropdownField(_ref) {
       onClose: handleClose,
       children: /*#__PURE__*/jsxRuntime.jsxs(Menu$a, {
         className: "max-h-60 max-w-2xl p-3",
-        children: [dropdownOptions.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
+        children: [dropdownOptions.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
           autoFocus: true,
           className: "mb-1",
           "data-cy": "search-text-field",
@@ -11080,7 +11566,7 @@ var DropdownField$1 = function DropdownField(_ref) {
             return e.stopPropagation();
           }
         }), /*#__PURE__*/jsxRuntime.jsx(OptionsWrapper, {
-          hasScroll: dropdownOptions.length > MAXIMUM_OPTION_LENGTH$3,
+          hasScroll: dropdownOptions.length > MAXIMUM_OPTION_LENGTH$2,
           children: searchedOptions.map(function (option, idx) {
             return /*#__PURE__*/jsxRuntime.jsx(MenuItem$9.Button, {
               "data-cy": "".concat(utils.joinHyphenCase(option.label), "-menu-item"),
@@ -11132,7 +11618,7 @@ var EditorAction = function EditorAction(_ref) {
   React.useEffect(function () {
     setFieldValue(name, editorData);
   }, [debouncedValue]);
-  return /*#__PURE__*/jsxRuntime.jsx(neetoEditor.FormikEditor, _objectSpread$f({
+  return /*#__PURE__*/jsxRuntime.jsx(FormikEditor__default["default"], _objectSpread$f({
     addons: addons,
     autoFocus: autoFocus,
     defaults: defaults,
@@ -11714,7 +12200,7 @@ var MultiSelect$1 = function MultiSelect(_ref) {
       onClose: handleClose,
       children: /*#__PURE__*/jsxRuntime.jsxs(Menu$9, {
         className: "max-h-60 max-w-2xl p-3",
-        children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
+        children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
           autoFocus: true,
           className: "mb-1",
           "data-cy": "search-text-field",
@@ -11725,7 +12211,7 @@ var MultiSelect$1 = function MultiSelect(_ref) {
             return setSearchTerm(e.target.value);
           }
         }), /*#__PURE__*/jsxRuntime.jsx(OptionsWrapper, {
-          hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3,
+          hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2,
           children: searchedOptions.map(function (option, idx) {
             return /*#__PURE__*/jsxRuntime.jsx(MenuItem$8.Button, {
               "data-cy": "".concat(utils.joinHyphenCase(option.label), "-menu-item"),
@@ -20409,7 +20895,7 @@ var DropdownField = function DropdownField(_ref) {
     onClose: handleClose,
     children: /*#__PURE__*/jsxRuntime.jsxs(Menu$6, {
       className: "max-h-60 max-w-2xl p-3",
-      children: [options.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
+      children: [options.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
         autoFocus: true,
         className: "mb-1",
         "data-cy": "search-text-field",
@@ -20423,7 +20909,7 @@ var DropdownField = function DropdownField(_ref) {
           return e.stopPropagation();
         }
       }), /*#__PURE__*/jsxRuntime.jsx(OptionsWrapper, {
-        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$2,
+        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$3,
         children: searchedOptions.map(function (option, idx) {
           return /*#__PURE__*/jsxRuntime.jsx(MenuItem$6.Button, {
             "data-cy": "".concat(utils.joinHyphenCase(option.label), "-menu-item"),
@@ -20531,7 +21017,7 @@ var Dropdown = function Dropdown(_ref) {
     onClose: handleClose,
     children: /*#__PURE__*/jsxRuntime.jsxs(Menu$5, {
       className: "max-h-60 max-w-2xl p-3",
-      children: [options.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
+      children: [options.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
         autoFocus: true,
         className: "mb-1",
         "data-cy": "search-text-field",
@@ -20545,7 +21031,7 @@ var Dropdown = function Dropdown(_ref) {
           return e.stopPropagation();
         }
       }), /*#__PURE__*/jsxRuntime.jsx(OptionsWrapper, {
-        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$2,
+        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$3,
         children: searchedOptions.map(function (option, idx) {
           return /*#__PURE__*/jsxRuntime.jsx(MenuItem$5.Button, {
             "data-cy": "".concat(utils.joinHyphenCase(option.label), "-menu-item"),
@@ -20705,7 +21191,7 @@ var MultiSelect = function MultiSelect(_ref) {
     onClose: handleClose,
     children: /*#__PURE__*/jsxRuntime.jsxs(Menu$4, {
       className: "max-h-60 max-w-2xl p-3",
-      children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
+      children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], {
         autoFocus: true,
         className: "mb-1",
         "data-cy": "search-text-field",
@@ -20716,7 +21202,7 @@ var MultiSelect = function MultiSelect(_ref) {
           return setSearchTerm(e.target.value);
         }
       }), /*#__PURE__*/jsxRuntime.jsx(OptionsWrapper, {
-        hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2,
+        hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3,
         children: searchedOptions.map(function (option, idx) {
           return /*#__PURE__*/jsxRuntime.jsx(MenuItem$4.Button, {
             "data-cy": "".concat(utils.joinHyphenCase(option.label), "-menu-item"),
@@ -22583,5 +23069,6 @@ NeetoRules.EventConditions = EventConditions;
 exports.NeetoRulesForm = NeetoRules;
 exports.RulePreview = RulePreview;
 exports.RulesReorder = RulesReorder;
+exports.RulesTable = RulesTable;
 exports.useCustomDataStore = useCustomDataStore;
 //# sourceMappingURL=index.cjs.js.map