ordering-ui-admin-external 1.3.7 → 1.4.0

package/_modules/components/Stores/BusinessWidgets/index.js

@@ -0,0 +1,108 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.BusinessWidgets = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
+
+var _Select = require("../../../styles/Select");
+
+var _styledComponents = require("styled-components");
+
+var _utils = require("../../../utils");
+
+var _styles = require("./styles");
+
+var _styles2 = require("../../../styles");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var BusinessWidgets = function BusinessWidgets(props) {
+  var business = props.business;
+
+  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
+      _useLanguage2 = _slicedToArray(_useLanguage, 2),
+      t = _useLanguage2[1];
+
+  var theme = (0, _styledComponents.useTheme)();
+
+  var _useState = (0, _react.useState)('modal'),
+      _useState2 = _slicedToArray(_useState, 2),
+      selectedType = _useState2[0],
+      setSelectedType = _useState2[1];
+
+  var modalTypes = [{
+    value: 'modal',
+    content: t('TYPE_MODAL_POPUP', 'Button with modal style')
+  }, {
+    value: 'chat',
+    content: t('TYPE_MODAL_CHAT', 'Chat style integration')
+  }];
+  var url = "".concat(_utils.widgetURL).concat(business === null || business === void 0 ? void 0 : business.slug);
+  var color = theme.colors.primary;
+  var widgetPopup = '<script type="text/javascript">window.onload=function(){function e(e,t){return!0===e||!1===e?e:t}function t(){return!!(navigator.userAgent.match(/Android/i)||navigator.userAgent.match(/webOS/i)||navigator.userAgent.match(/iPhone/i)||navigator.userAgent.match(/iPad/i)||navigator.userAgent.match(/iPod/i)||navigator.userAgent.match(/BlackBerry/i)||navigator.userAgent.match(/Windows Phone/i))}"undefined"==typeof orderingSettings&&(orderingSettings={});var i=orderingSettings,o=e(i.openOnMobile,!1),n=e(i.openOnDesktop,!1),s=!1,l=document.createElement("div");l.id="ordering_bot",l.style.height=0,l.style.width=0,l.style.position="fixed",l.style.right="20%",l.style.left="20%",l.style.top="7%",l.style.bottom="7%",l.style.borderRadius="5px",l.style.overflow="hidden",l.style.zIndex=99999,l.style.maxheight=window.innerHeight+"px",l.style["-webkit-transition"]="height 0.5s, width 0.5s",l.style["-moz-transition"]="height 0.5s, width 0.5s",l.style["-ms-transition"]="height 0.5s, width 0.5s",l.style["-o-transition"]="height 0.5s, width 0.5s",l.style.transition="height 0.5s, width 0.5s",l.style["-webkit-overflow-scrolling"]="touch",l.style["overflow-y"]="scroll",l.style.boxShadow="0 0 20px 0 #999";var r={insideIframe:!1};document.addEventListener("scroll",function(e){r.insideIframe&&(e.preventDefault(),window.scrollTo(0,0))});var d=document.createElement("div");d.style.height="40px",d.style.background="#ccc",d.style.width="100%",d.style.position="absolute";var a=document.createElement("div");a.style.height="40px",a.style.width="40px",a.style.float="right",a.style.fontSize="28px",a.style.lineHeight="25px",a.style.padding="5px",a.style.textAlign="center",a.style.boxSizing="border-box",a.style.color="#666",a.style.borderLeft="1px solid #bbb",a.style.cursor="pointer",a.innerHTML="&times;",d.appendChild(a);var h=document.createElement("iframe");function y(){s?(l.style.height="auto",l.style.width="auto",window.innerWidth<=480?(l.style.right=0,l.style.left=0,l.style.top=0,l.style.bottom=0,l.style.borderRadius=0):(window.innerWidth>480&&window.innerWidth<600?(l.style.left="10%",l.style.right="10%"):(l.style.left="20%",l.style.right="20%"),l.style.top="7%",l.style.bottom="7%",l.style.borderRadius="5px")):(l.style.height="0px",l.style.width="0px")}h.id="ordering_iframe",h.src="' + url + '",h.style.border=0,h.style.height="100%",h.style.width="100%",h.style.maxWidth="none",h.style.paddingTop="40px",h.style.boxSizing="border-box",h.style["-webkit-overflow-scrolling"]="touch",l.appendChild(d),l.appendChild(h),document.getElementsByTagName("body")[0].appendChild(l),window.toggleOrderingWidget=function(){(s=!s)?(t()&&(r.insideIframe=!0,document.body.style.overflow="hidden",document.body.style.height=window.innerHeight-150+"px"),r.insideIframe=!0,r.scrollX=window.scrollX,r.scrollY=window.scrollY,t()||(document.body.style.overflow="hidden")):(t()&&(r.insideIframe=!1,document.body.style.overflow="auto",document.body.style.height="auto"),r.insideIframe=!1,t()||(document.body.style.overflow="auto")),y()},y(),window.onresize=y,(t()&&o&&!(navigator.userAgent.match(/iPad/i)||(navigator.userAgent.match(/iPhone/i)||void 0))||!t()&&n)&&toggleOrderingWidget(),a.addEventListener("click",toggleOrderingWidget)};</script>';
+  var widgetBot = '<script type="text/javascript">window.onload=function(){function e(e,t){return e===!0||e===!1||void 0!=e||null!=e?e:t}function t(){return navigator.userAgent.match(/Android/i)||navigator.userAgent.match(/webOS/i)||navigator.userAgent.match(/iPhone/i)||navigator.userAgent.match(/iPad/i)||navigator.userAgent.match(/iPod/i)||navigator.userAgent.match(/BlackBerry/i)||navigator.userAgent.match(/Windows Phone/i)?!0:!1}function n(){return navigator.userAgent.match(/iPad/i)?"iPad":navigator.userAgent.match(/iPhone/i)?"iPhone":void 0}function i(){h=!h,h?(t()&&(w.insideIframe=!0,document.body.style.overflow="hidden",document.body.style.height=window.innerHeight-150+"px"),g.innerHTML=p.outerHTML):(t()&&(w.insideIframe=!1,document.body.style.overflow="auto",document.body.style.height="auto"),g.innerHTML=c.outerHTML),o(m)}function o(e){e.style.height=s(),e.style.width=r(),window.innerWidth<=480&&(e.style.top=0,e.style.left=0,e.style.right=0,e.style.bottom=0)}function s(){if(h){if(window.innerWidth<=480)return"100%";var e=window.innerHeight-70-10-20;return (e>570&&y.type=="chat")?"570px":e+"px"}return"0px"}function r(){return h?window.innerWidth<=480?"100%":"chat"==y.type?"370px":window.innerWidth-40+"px":"0px"}function l(){console.log("onresize"),window.innerWidth<=480?(m.style.position="fixed",m.style.bottom=0,m.style.right=0,m.style.borderRadius=0,f.style.display="block"):(m.style.position="fixed",m.style.bottom="80px",m.style.right="20px",m.style.borderRadius="10px",f.style.display="none"),m.style.height=s(),m.style.width=r()}var d="' + url + '";"undefined"==typeof orderingSettings&&(orderingSettings={});var a=orderingSettings,y={openOnMobile:e(a.openOnMobile,!1),openOnDesktop:e(a.openOnDesktop,!1),type:e(a.type,"chat")},h=!1,g=document.createElement("div"),c=document.createElement("img");c.src=d.split("/")[0]+"//"+d.split("/")[2]+"/templates/web/img/icon.png",c.style.width="30px",c.style.marginTop="9px",c.style.maxWidth="none";var p=document.createElement("div");p.innerHTML="&times;",p.style.display="block",p.style.color="#fff",p.style.font="Arial",p.style.fontSize="30px",p.style.margin="0 5px",p.style.borderRadius="50px",p.style.width="40px",p.style.height="40px",p.style.lineHeight="47px",p.style.fontWeight="400",g.style.position="fixed",g.style.bottom="20px",g.style.right="20px",g.style.width="50px",g.style.height="50px",g.style.background="' + color + '",g.style.borderRadius="50px",g.style.textAlign="center",g.style.cursor="pointer",g.style.outline="none",g.style.border=0,g.style.zIndex=99999,g.appendChild(c);var m=document.createElement("div");m.id="ordering_bot",m.style.height=0,m.style.width=0,m.style.position="fixed",m.style.bottom="80px",m.style.right="20px",m.style.borderRadius="10px",m.style.overflow="hidden",m.style.zIndex=99999,m.style.maxheight=window.innerHeight+"px",m.style["-webkit-transition"]="height 0.5s, width 0.5s",m.style["-moz-transition"]="height 0.5s, width 0.5s",m.style["-ms-transition"]="height 0.5s, width 0.5s",m.style["-o-transition"]="height 0.5s, width 0.5s",m.style.transition="height 0.5s, width 0.5s";var u=document.createElement("iframe");u.id="ordering_bot_iframe",u.src=d,u.setAttribute("allow", "geolocation"),u.style.border=0,u.style.height="125%",u.style.width="125%",u.style.maxWidth="none",u.style["-ms-zoom"]="0.8",u.style["-moz-transform"]="scale(0.8)",u.style["-moz-transform-origin"]="0 0",u.style["-o-transform"]="scale(0.8)",u.style["-o-transform-origin"]="0 0",u.style["-webkit-transform"]="scale(0.8)",u.style["-webkit-transform-origin"]="0 0";var w={insideIframe:!1};m.addEventListener("mouseenter",function(){w.insideIframe=!0,w.scrollX=window.scrollX,w.scrollY=window.scrollY,t()||(document.body.style.overflow="hidden")}),m.addEventListener("mouseleave",function(){w.insideIframe=!1,t()||(document.body.style.overflow="auto")}),document.addEventListener("scroll",function(e){w.insideIframe&&(e.preventDefault(),window.scrollTo(0,0))});var f=document.createElement("div");f.style.position="absolute",f.style.width="35px",f.style.height="35px",f.style.bottom="45px",f.style.left="50%",f.style.lineHeight="36px",f.style.background="transparent",f.style.borderColor="transparent";var x=document.createElement("div");x.innerHTML="&times;",x.style.position="relative",x.style.left="-50%",x.style.zIndex="999",x.style.width="40px",x.style.height="40px",x.style.background="rgba(0,0,0,0.2)",x.style.textAlign="center",x.style.border=0,x.style.borderRadius="35px",x.style.color="#fff",x.style.fontSize="30px",x.style.outline="none",x.style.cursor="pointer",f.appendChild(x),m.appendChild(f),m.appendChild(u),document.getElementsByTagName("body")[0].appendChild(g),document.getElementsByTagName("body")[0].appendChild(m),window.toggleOrderingWidget=i,g.onclick=i,f.onclick=i,l(),window.onresize=l,(t()&&y.openOnMobile&&!n()||!t()&&y.openOnDesktop)&&i(),setInterval(function(){n()&&window.innerHeight<m.clientHeight&&(u.style.height=.7*window.innerHeight+"px"),n()&&window.innerHeight==m.clientHeight&&(m.style.bottom=0,u.style.height="125%")},2e3)};</script>';
+  var widgetInline = '<script type="text/javascript">var orderingInlineSettings = {baseUrl: "/"};</script><script type="text/javascript">window.onload=function(){var i={baseUrl:orderingInlineSettings&&orderingInlineSettings.baseUrl?orderingInlineSettings.baseUrl:"/inline/"},l=location.href.split(i.baseUrl)[0],e=location.href.split(i.baseUrl)[1],a="' + url + '",r=document.createElement("iframe");r.id="ordering_iframe",r.src=(a+"/"+e).replace(/([^:]\\/)\\/+/g,"$1"),r.style.border=0,r.style.height="100%",r.style.width="100%",r.style.maxWidth="none",r.allow="geolocation";var d=document.getElementById("ordering_iframe_inline");d.appendChild(r),r.addEventListener("load",function(){t(),setInterval(function(){var e=JSON.stringify({event:"body",data:{}});r.contentWindow.postMessage(e,a)},100)});function t(){var e=document.documentElement,t=window.innerwidth||e.clientWidth,n=window.innerHeight||e.clientHeight,o=(window.pageXOffset||e.scrollLeft)-(e.clientLeft||0),i=(window.pageYOffset||e.scrollTop)-(e.clientTop||0),l=JSON.stringify({event:"scroll",data:{top:i,left:o,width:t,height:n,offsetTop:s(r).top}});r.contentWindow.postMessage(l,a)}function s(e){for(var t=0,n=0;t+=e.offsetTop||0,n+=e.offsetLeft||0,e=e.offsetParent;);return{top:t,left:n}}window.addEventListener("message",function(e){var t=e.data;if("body"==t.event)d.style.height=t.data.height+"px";else if("scroll"==t.event)t.data.enable?document.getElementsByTagName("body")[0].style.overflowY="auto":document.getElementsByTagName("body")[0].style.overflowY="hidden";else if("url"==t.event){var n=document.createElement("a");n.href=t.data;var o=((l?l+"/":"")+i.baseUrl+"/"+n.pathname).replace(/([^:]\\/)\\/+/g,"$1");window.history.pushState("","",o),"http://localhost/"!=t.data&&window.scrollTo(0,s(r).top)}},!1),window.onscroll=function(e){t()}};</script><div style="height: 1000px;" id="ordering_iframe_inline"></div>';
+  return /*#__PURE__*/_react.default.createElement(_styles.Container, null, /*#__PURE__*/_react.default.createElement(_styles.PopupContainer, null, /*#__PURE__*/_react.default.createElement("h2", null, t('INTEGRATION_WEBSITE', 'Integration on your website'), ": ", t('POPUP', 'Popup')), /*#__PURE__*/_react.default.createElement(_styles.FormGroup, null, /*#__PURE__*/_react.default.createElement("label", null, t('TYPE_MODAL', 'Modal style')), /*#__PURE__*/_react.default.createElement(_styles.SelectWrapper, null, /*#__PURE__*/_react.default.createElement(_Select.Select, {
+    isSecondIcon: true,
+    notAsync: true,
+    placeholder: t('SELECT_TYPE', 'Select Type'),
+    defaultValue: selectedType,
+    options: modalTypes,
+    onChange: function onChange(val) {
+      return setSelectedType(val);
+    }
+  }))), /*#__PURE__*/_react.default.createElement(_styles.FormGroup, null, /*#__PURE__*/_react.default.createElement("label", null, "1* ", t('INSERT_ON_DIV_DISPLAY', 'Insert in the div where you want to display it.')), /*#__PURE__*/_react.default.createElement(_styles2.Input, {
+    placeholder: t('CODE', 'Code'),
+    defaultValue: "<button onclick=\"toggleOrderingWidget()\">".concat(t('Online_Ordering', 'Online Ordering'), "</button>"),
+    disabled: true
+  })), /*#__PURE__*/_react.default.createElement(_styles.FormGroup, null, /*#__PURE__*/_react.default.createElement("label", null, "2* ", t('INSERT_ON_END_BODY', 'Insert at the end of the body tag'), " (", t('IF_USED_PAYPALEXPRESS', 'Use only if Paypal Express is used'), ")"), /*#__PURE__*/_react.default.createElement(_styles2.Input, {
+    placeholder: t('CODE', 'Code'),
+    defaultValue: "<script src=\"https://www.paypalobjects.com/api/checkout.js\"></script>",
+    disabled: true
+  })), /*#__PURE__*/_react.default.createElement(_styles.FormGroup, null, /*#__PURE__*/_react.default.createElement("label", null, "3* ", t('INSERT_ON_END_BODY', 'Insert at the end of the body tag')), /*#__PURE__*/_react.default.createElement(_styles2.TextArea, {
+    placeholder: t('CODE', 'Code'),
+    value: selectedType === 'modal' ? widgetPopup : widgetBot,
+    disabled: true
+  }))), /*#__PURE__*/_react.default.createElement(_styles.InlineContainer, null, /*#__PURE__*/_react.default.createElement("h2", null, t('INTEGRATION_WEBSITE', 'Integration on your website'), ": ", t('INLINE', 'Inline')), /*#__PURE__*/_react.default.createElement(_styles.FormGroup, null, /*#__PURE__*/_react.default.createElement("label", null, "1* ", t('INSERT_ON_END_BODY', 'Insert at the end of the body tag'), " (", t('IF_USED_PAYPALEXPRESS', 'Use only if Paypal Express is used'), ")"), /*#__PURE__*/_react.default.createElement(_styles2.Input, {
+    placeholder: t('CODE', 'Code'),
+    defaultValue: "<script src=\"https://www.paypalobjects.com/api/checkout.js\"></script>",
+    disabled: true
+  })), /*#__PURE__*/_react.default.createElement(_styles.FormGroup, null, /*#__PURE__*/_react.default.createElement("label", null, "2* ", t('INSERT_ON_DIV_DISPLAY', 'Insert in the div where you want to display it.')), /*#__PURE__*/_react.default.createElement(_styles2.TextArea, {
+    placeholder: t('CODE', 'Code'),
+    defaultValue: widgetInline,
+    disabled: true
+  })), /*#__PURE__*/_react.default.createElement(_styles.FormGroup, null, /*#__PURE__*/_react.default.createElement("label", null, "3* .htaccess"), /*#__PURE__*/_react.default.createElement(_styles2.TextArea, {
+    placeholder: t('CODE', 'Code'),
+    defaultValue: "RewriteEngine On RewriteRule ^inline/(.+)$ /inline/ [NC,L] #where inline is the folder",
+    disabled: true
+  }))), /*#__PURE__*/_react.default.createElement(_styles.GuideLink, null, /*#__PURE__*/_react.default.createElement(_styles2.Button, {
+    outline: true,
+    color: "primary",
+    onClick: function onClick() {
+      return window.open('https://support.ordering.co/hc/en-us/articles/360043529971-Widget-Integration', '_blank');
+    }
+  }, t('LEARN_HOW_TO_DO_IT', 'Learn how to do it'))));
+};
+
+exports.BusinessWidgets = BusinessWidgets;

package/_modules/components/Stores/BusinessWidgets/styles.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SelectWrapper = exports.PopupContainer = exports.InlineContainer = exports.GuideLink = exports.FormGroup = exports.Container = void 0;
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+var Container = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
+
+exports.Container = Container;
+
+var PopupContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  h2 {\n    font-weight: 600;\n    font-size: 16px;\n    line-height: 24px;\n    margin-top: 0px;\n    margin-bottom: 20px;\n  }\n"])));
+
+exports.PopupContainer = PopupContainer;
+
+var FormGroup = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  margin-bottom: 30px;\n  label {\n    display: block;\n    font-weight: 400;\n    font-size: 14px;\n    line-height: 24px;\n    margin-bottom: 11px;\n  }\n  input, textarea {\n    width: 100%;\n  }\n"])));
+
+exports.FormGroup = FormGroup;
+
+var SelectWrapper = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  font-size: 14px;\n  .select {\n    border: none;\n    background: ", ";\n    padding: 11px 0;\n  }\n"])), function (props) {
+  return props.theme.colors.secundary;
+});
+
+exports.SelectWrapper = SelectWrapper;
+
+var InlineContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  h2 {\n    font-weight: 600;\n    font-size: 16px;\n    line-height: 24px;\n    margin-top: 0px;\n    margin-bottom: 20px;\n  }\n"])));
+
+exports.InlineContainer = InlineContainer;
+
+var GuideLink = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  button {\n    border-radius: 8px;\n    height: 44px;\n  }\n"])));
+
+exports.GuideLink = GuideLink;

package/_modules/components/Stores/EditTaxManager/index.js

@@ -13,6 +13,8 @@ var _orderingComponentsAdminExternal = require("ordering-components-admin-extern
 
 var _reactHookForm = require("react-hook-form");
 
+var _Shared = require("../../Shared");
+
 var _styles = require("./styles");
 
 var _FirstSelect = require("../../../styles/Select/FirstSelect");
@@ -45,14 +47,22 @@ var EditTaxManager = function EditTaxManager(props) {
       data = props.data,
       formChanges = props.formChanges,
       _onChange = props.onChange,
-      onClose = props.onClose,
-      setAlertState = props.setAlertState;
+      onClose = props.onClose;
 
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
       _useLanguage2 = _slicedToArray(_useLanguage, 2),
       t = _useLanguage2[1];
 
+  var _useState = (0, _react.useState)({
+    open: false,
+    content: []
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      alertState = _useState2[0],
+      setAlertState = _useState2[1];
+
   var formMethods = (0, _reactHookForm.useForm)();
+  var positiveNumberFields = ['rate', 'fixed', 'percentage'];
   var defaultInputs = [{
     field: 'name',
     placeholder: t('NAME', 'Name'),
@@ -62,30 +72,58 @@ var EditTaxManager = function EditTaxManager(props) {
     placeholder: t('DESCRIPTION', 'Description'),
     required: t('DESCRIPTION_REQUIRED', 'The Description is required')
   }];
+
+  var rateValidationNumber = function rateValidationNumber(value) {
+    if (!isNaN(Number(value))) {
+      return true;
+    } else {
+      return t('VALIDATION_ERROR_NUMERIC', 'The _attribute_ must be a number.').replace('_attribute_', t('RATE', 'Rate'));
+    }
+  };
+
+  var feeValidationNumber = function feeValidationNumber(value) {
+    if (!isNaN(Number(value))) {
+      return true;
+    } else {
+      return t('VALIDATION_ERROR_NUMERIC', 'The _attribute_ must be a number.').replace('_attribute_', t('FIXED', 'Fixed'));
+    }
+  };
+
+  var percentageValidationNumber = function percentageValidationNumber(value) {
+    if (Number(value) <= 100) {
+      return true;
+    } else {
+      return t('VALIDATION_MUST_SMALLER_HUNDRED', 'The precentage must be not bigger than 100').replace('_attribute_', t('PERCENTAGE', 'Percentage'));
+    }
+  };
+
   var inputs = [].concat(defaultInputs, [type === 'taxes' ? [{
     field: 'rate',
     placeholder: t('RATE', 'Rate'),
     required: t('TAX_RATE_REQUIRED', 'Tax rate is required'),
     pattern: {
-      value: /^-?\d+\.?\d*$/,
-      message: t('ERROR_TAX_RATE_INTEGER', 'The tax rate must be an integer.')
-    }
+      value: /^\d*\.?\d*$/,
+      message: t('VALIDATION_ERROR_NUMERIC', 'The _attribute_ must be a number.').replace('_attribute_', t('RATE', 'Rate'))
+    },
+    validate: rateValidationNumber
   }] : [{
     field: 'fixed',
     placeholder: t('FIXED', 'Fixed'),
     required: t('FEE_FIXED_REQUIRED', 'Fee fixed is required'),
     pattern: {
-      value: /^-?\d+\.?\d*$/,
-      message: t('ERROR_FEE_FIXED_INTEGER', 'The fee fixed must be an integer.')
-    }
+      value: /^\d*\.?\d*$/,
+      message: t('VALIDATION_ERROR_NUMERIC', 'The _attribute_ must be a number.').replace('_attribute_', t('FIXED', 'Fixed'))
+    },
+    validate: feeValidationNumber
   }, {
     field: 'percentage',
     placeholder: t('PERCENTAGE', 'Percentage'),
     required: t('FEE_PERCENTAGE_REQUIRED', 'Fee percentage is required'),
     pattern: {
-      value: /^-?\d+\.?\d*$/,
-      message: t('ERROR_FEE_PERCENTAGE_INTEGER', 'The fee percentage must be an integer.')
-    }
+      value: /^\d*\.?\d*$/,
+      message: t('VALIDATION_ERROR_NUMERIC', 'The _attribute_ must be a number.').replace('_attribute_', t('PERCENTAGE', 'Percentage'))
+    },
+    validate: percentageValidationNumber
   }]]);
   (0, _react.useEffect)(function () {
     if (Object.keys(formMethods.errors).length > 0) {
@@ -119,8 +157,15 @@ var EditTaxManager = function EditTaxManager(props) {
       },
       ref: formMethods.register({
         required: input.required,
-        pattern: input.pattern
-      })
+        pattern: input.pattern,
+        validate: input.validate
+      }),
+      onKeyPress: function onKeyPress(e) {
+        if (positiveNumberFields.includes(input.field) && !/^[0-9.]$/.test(e.key)) {
+          e.preventDefault();
+        }
+      },
+      autoComplete: "off"
     }));
   }), type === 'taxes' && /*#__PURE__*/_react.default.createElement(_styles.InputContainer, null, /*#__PURE__*/_react.default.createElement(_styles.LabelCustom, {
     htmlFor: "type"
@@ -150,7 +195,25 @@ var EditTaxManager = function EditTaxManager(props) {
     onClick: function onClick() {
       return onClose();
     }
-  }, t('CLOSE', 'Close'))));
+  }, t('CLOSE', 'Close'))), /*#__PURE__*/_react.default.createElement(_Shared.Alert, {
+    title: t('ERROR'),
+    content: alertState.content,
+    acceptText: t('ACCEPT', 'Accept'),
+    open: alertState.open,
+    onClose: function onClose() {
+      return setAlertState({
+        open: false,
+        content: []
+      });
+    },
+    onAccept: function onAccept() {
+      return setAlertState({
+        open: false,
+        content: []
+      });
+    },
+    closeOnBackdrop: false
+  }));
 };
 
 exports.EditTaxManager = EditTaxManager;

package/_modules/components/Stores/ProductDetails/index.js

@@ -79,7 +79,8 @@ var ProductDetailsUI = function ProductDetailsUI(props) {
       handleUpdateClick = props.handleUpdateClick,
       handleChangeFormState = props.handleChangeFormState,
       handleSuccessUpdate = props.handleSuccessUpdate,
-      handleChangeRibbon = props.handleChangeRibbon;
+      handleChangeRibbon = props.handleChangeRibbon,
+      cleanFormState = props.cleanFormState;
 
   var _useWindowSize = (0, _useWindowSize2.useWindowSize)(),
       width = _useWindowSize.width;
@@ -201,7 +202,8 @@ var ProductDetailsUI = function ProductDetailsUI(props) {
     taxes: taxes,
     setTaxes: setTaxes,
     fees: fees,
-    setFees: setFees
+    setFees: setFees,
+    cleanFormState: cleanFormState
   }), showOption === 'service_details' && /*#__PURE__*/_react.default.createElement(_ServiceDetail.ServiceDetail, {
     product: productState === null || productState === void 0 ? void 0 : productState.product,
     formState: formState,

package/_modules/components/Stores/ProductDetailsAdvanced/index.js

@@ -636,8 +636,7 @@ var ProductDetailsAdvancedUI = function ProductDetailsAdvancedUI(props) {
         payload: null
       });
     },
-    handleSave: handleSaveTax,
-    setAlertState: setAlertState
+    handleSave: handleSaveTax
   })), /*#__PURE__*/_react.default.createElement(_Shared.Alert, {
     title: taxToDelete.action ? t("DELETE_".concat(getTaxOrFeeString(taxToDelete === null || taxToDelete === void 0 ? void 0 : taxToDelete.action).toUpperCase()), "Delete ".concat(getTaxOrFeeString(taxToDelete === null || taxToDelete === void 0 ? void 0 : taxToDelete.action))) : t('ERROR'),
     content: alertState.content,

package/_modules/components/Stores/ProductMainDetails/index.js

@@ -56,7 +56,8 @@ var ProductMainDetails = function ProductMainDetails(props) {
       taxes = props.taxes,
       setTaxes = props.setTaxes,
       fees = props.fees,
-      setFees = props.setFees;
+      setFees = props.setFees,
+      cleanFormState = props.cleanFormState;
 
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
       _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -127,7 +128,8 @@ var ProductMainDetails = function ProductMainDetails(props) {
     handleUpdateClick: handleUpdateClick,
     handlechangeImageProductCategory: handlechangeImage,
     handleProductCategoryChangeInput: handleChangeInput,
-    isProductSeo: true
+    isProductSeo: true,
+    cleanFormState: cleanFormState
   }));
 };
 

package/_modules/components/Stores/SeoOptions/index.js

@@ -58,7 +58,8 @@ var SeoOptions = function SeoOptions(props) {
       handlechangeImageProductCategory = props.handlechangeImageProductCategory,
       isBusinessSeo = props.isBusinessSeo,
       isProductSeo = props.isProductSeo,
-      isCategorySeo = props.isCategorySeo;
+      isCategorySeo = props.isCategorySeo,
+      cleanFormState = props.cleanFormState;
 
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
       _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -87,6 +88,14 @@ var SeoOptions = function SeoOptions(props) {
       cropState = _useState4[0],
       setCropState = _useState4[1];
 
+  var _useState5 = (0, _react.useState)(false),
+      _useState6 = _slicedToArray(_useState5, 2),
+      isSameInfo = _useState6[0],
+      setIsSameInfo = _useState6[1];
+
+  var titleRef = (0, _react.useRef)(null);
+  var descriptionRef = (0, _react.useRef)(null);
+
   var handleClickImage = function handleClickImage() {
     productImageInputRef.current.click();
   };
@@ -178,6 +187,22 @@ var SeoOptions = function SeoOptions(props) {
     });
   };
 
+  (0, _react.useEffect)(function () {
+    if (!isSameInfo || !isProductSeo) return;
+    setFormState({
+      seo_title: data === null || data === void 0 ? void 0 : data.name,
+      seo_description: data === null || data === void 0 ? void 0 : data.description
+    });
+    titleRef.current.value = data === null || data === void 0 ? void 0 : data.name;
+    descriptionRef.current.value = data === null || data === void 0 ? void 0 : data.description;
+  }, [isSameInfo, isProductSeo]);
+  (0, _react.useEffect)(function () {
+    return function () {
+      cleanFormState && cleanFormState({
+        changes: {}
+      });
+    };
+  }, []);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.Container, null, /*#__PURE__*/_react.default.createElement(_styles2.WrapperImage, null, /*#__PURE__*/_react.default.createElement("label", null, t('SEO_IMAGE', 'SEO Image')), /*#__PURE__*/_react.default.createElement(_styles2.SEOImage, {
     onClick: function onClick() {
       return handleClickImage();
@@ -207,8 +232,14 @@ var SeoOptions = function SeoOptions(props) {
     loading: "lazy"
   }), /*#__PURE__*/_react.default.createElement(_styles2.UploadImageIconContainer, {
     isImage: (formState === null || formState === void 0 ? void 0 : (_formState$changes4 = formState.changes) === null || _formState$changes4 === void 0 ? void 0 : _formState$changes4.seo_image) || data.seo_image
-  }, /*#__PURE__*/_react.default.createElement(_styles2.CameraWrapper, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Camera, null)), /*#__PURE__*/_react.default.createElement(_styles2.UploadImageIcon, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Image, null), /*#__PURE__*/_react.default.createElement("span", null, t('DRAG_DROP', 'Drag and Drop')))))))), /*#__PURE__*/_react.default.createElement(_styles2.WrapperShortDescription, null, /*#__PURE__*/_react.default.createElement("label", null, t('SEO_TITLE', 'SEO Title')), /*#__PURE__*/_react.default.createElement(_styles.Input, {
+  }, /*#__PURE__*/_react.default.createElement(_styles2.CameraWrapper, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Camera, null)), /*#__PURE__*/_react.default.createElement(_styles2.UploadImageIcon, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Image, null), /*#__PURE__*/_react.default.createElement("span", null, t('DRAG_DROP', 'Drag and Drop')))))))), isProductSeo && /*#__PURE__*/_react.default.createElement(_styles2.UseSameInfoWrapper, null, /*#__PURE__*/_react.default.createElement("label", null, t('USE_SAME_PRODUCT_INFORMATION', 'Use the same as main product information')), /*#__PURE__*/_react.default.createElement(_styles.Switch, {
+    defaultChecked: isSameInfo || false,
+    onChange: function onChange(val) {
+      return setIsSameInfo(val);
+    }
+  })), /*#__PURE__*/_react.default.createElement(_styles2.WrapperShortDescription, null, /*#__PURE__*/_react.default.createElement("label", null, t('SEO_TITLE', 'SEO Title')), /*#__PURE__*/_react.default.createElement(_styles.Input, {
     name: "seo_title",
+    ref: titleRef,
     defaultValue: formState !== null && formState !== void 0 && (_formState$result2 = formState.result) !== null && _formState$result2 !== void 0 && _formState$result2.result ? formState === null || formState === void 0 ? void 0 : (_formState$result3 = formState.result) === null || _formState$result3 === void 0 ? void 0 : (_formState$result3$re = _formState$result3.result) === null || _formState$result3$re === void 0 ? void 0 : _formState$result3$re.seo_title : (_ref = (_formState$changes$se = formState === null || formState === void 0 ? void 0 : (_formState$changes5 = formState.changes) === null || _formState$changes5 === void 0 ? void 0 : _formState$changes5.seo_title) !== null && _formState$changes$se !== void 0 ? _formState$changes$se : data === null || data === void 0 ? void 0 : data.seo_title) !== null && _ref !== void 0 ? _ref : '',
     onChange: function onChange(e) {
       if (isBusinessSeo) handleChangeInput(e);
@@ -217,6 +248,7 @@ var SeoOptions = function SeoOptions(props) {
     placeholder: t('SEO_TITLE', 'SEO Title')
   })), /*#__PURE__*/_react.default.createElement(_styles2.WrapperDescription, null, /*#__PURE__*/_react.default.createElement("label", null, t('SEO_DESCRIPTION', 'SEO Description')), /*#__PURE__*/_react.default.createElement(_styles.TextArea, {
     name: "seo_description",
+    ref: descriptionRef,
     rows: 4,
     defaultValue: formState !== null && formState !== void 0 && (_formState$result4 = formState.result) !== null && _formState$result4 !== void 0 && _formState$result4.result ? formState === null || formState === void 0 ? void 0 : (_formState$result5 = formState.result) === null || _formState$result5 === void 0 ? void 0 : (_formState$result5$re = _formState$result5.result) === null || _formState$result5$re === void 0 ? void 0 : _formState$result5$re.seo_description : (_ref2 = (_formState$changes$se2 = formState === null || formState === void 0 ? void 0 : (_formState$changes6 = formState.changes) === null || _formState$changes6 === void 0 ? void 0 : _formState$changes6.seo_description) !== null && _formState$changes$se2 !== void 0 ? _formState$changes$se2 : data === null || data === void 0 ? void 0 : data.seo_description) !== null && _ref2 !== void 0 ? _ref2 : '',
     onChange: function onChange(e) {

package/_modules/components/Stores/SeoOptions/styles.js

@@ -5,11 +5,11 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.WrapperShortDescription = exports.WrapperImage = exports.WrapperDescription = exports.UploadImageIconContainer = exports.UploadImageIcon = exports.SkipButton = exports.SkeletonWrapper = exports.SEOImage = exports.Container = exports.CameraWrapper = exports.ActionButtons = void 0;
+exports.WrapperShortDescription = exports.WrapperImage = exports.WrapperDescription = exports.UseSameInfoWrapper = exports.UploadImageIconContainer = exports.UploadImageIcon = exports.SkipButton = exports.SkeletonWrapper = exports.SEOImage = exports.Container = exports.CameraWrapper = exports.ActionButtons = void 0;
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23;
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -89,4 +89,10 @@ exports.SkipButton = SkipButton;
 
 var ActionButtons = _styledComponents.default.div(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n  position: sticky;\n  top: 100%;\n  display: flex;\n  align-items: center;\n\n  > button {\n    height: 42px;\n  }\n"])));
 
-exports.ActionButtons = ActionButtons;
+exports.ActionButtons = ActionButtons;
+
+var UseSameInfoWrapper = _styledComponents.default.div(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-bottom: 20px;\n\n  label {\n    &:first-child {\n      font-weight: 400;\n      font-size: 14px;\n      margin: 0px;\n      margin-right: 10px;\n      ", "\n    }\n    &:last-child {\n      min-width: 25px;\n    }\n  }\n"])), function (props) {
+  return props.theme.rtl && (0, _styledComponents.css)(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n        margin-right: 0px;\n        margin-left: 10px;\n      "])));
+});
+
+exports.UseSameInfoWrapper = UseSameInfoWrapper;

package/_modules/components/Stores/index.js

@@ -345,6 +345,12 @@ Object.defineProperty(exports, "BusinessWebhooks", {
     return _BusinessWebhooks.BusinessWebhooks;
   }
 });
+Object.defineProperty(exports, "BusinessWidgets", {
+  enumerable: true,
+  get: function get() {
+    return _BusinessWidgets.BusinessWidgets;
+  }
+});
 Object.defineProperty(exports, "BusinessesList", {
   enumerable: true,
   get: function get() {
@@ -648,6 +654,8 @@ var _BusinessVideos = require("./BusinessVideos");
 
 var _BusinessWebhooks = require("./BusinessWebhooks");
 
+var _BusinessWidgets = require("./BusinessWidgets");
+
 var _SeoOptions = require("./SeoOptions");
 
 var _AddBusinessForm = require("./AddBusinessForm");

package/_modules/index.js

@@ -513,6 +513,12 @@ Object.defineProperty(exports, "BusinessWebhooks", {
     return _Stores.BusinessWebhooks;
   }
 });
+Object.defineProperty(exports, "BusinessWidgets", {
+  enumerable: true,
+  get: function get() {
+    return _Stores.BusinessWidgets;
+  }
+});
 Object.defineProperty(exports, "BusinessesList", {
   enumerable: true,
   get: function get() {

package/_modules/utils/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.verifyDecimals = exports.sortInputFields = exports.shape = exports.setStorageItem = exports.scrollTo = exports.ribbonValues = exports.reviewCommentList = exports.removeStorageItem = exports.orderRejectCommentList = exports.optimizeImage = exports.getStorageItem = exports.getStarWidth = exports.getSeconds = exports.getMinutes = exports.getIconCard = exports.getHours = exports.getAgoMinutes = exports.formatUrlVideo = exports.fieldsToSort = exports.convertHoursToMinutes = exports.convertHMS = exports.capitalize = exports.bytesConverter = exports.DriverTipsOptions = void 0;
+exports.widgetURL = exports.verifyDecimals = exports.sortInputFields = exports.shape = exports.setStorageItem = exports.scrollTo = exports.ribbonValues = exports.reviewCommentList = exports.removeStorageItem = exports.orderRejectCommentList = exports.optimizeImage = exports.getStorageItem = exports.getStarWidth = exports.getSeconds = exports.getMinutes = exports.getIconCard = exports.getHours = exports.getAgoMinutes = exports.formatUrlVideo = exports.fieldsToSort = exports.convertHoursToMinutes = exports.convertHMS = exports.capitalize = exports.bytesConverter = exports.DriverTipsOptions = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -592,4 +592,6 @@ var orderRejectCommentList = function orderRejectCommentList(status) {
   return list;
 };
 
-exports.orderRejectCommentList = orderRejectCommentList;
+exports.orderRejectCommentList = orderRejectCommentList;
+var widgetURL = 'https://orderingweb.ordering.co/';
+exports.widgetURL = widgetURL;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-admin-external",
-  "version": "1.3.7",
+  "version": "1.4.0",
   "description": "Ordering UI Admin Components",
   "main": "./_modules/index.js",
   "exports": {
@@ -83,7 +83,7 @@
     "lodash": "^4.17.20",
     "moment": "^2.29.1",
     "moment-range": "^4.0.2",
-    "ordering-components-admin-external": "1.3.1",
+    "ordering-components-admin-external": "1.4.0",
     "polished": "^3.6.7",
     "prop-types": "^15.7.2",
     "react-big-calendar": "^1.4.2",

package/src/components/Marketing/EnterprisePromotionDetails/index.js

@@ -7,7 +7,7 @@ import { Dropdown, DropdownButton } from 'react-bootstrap'
 import { ThreeDots } from 'react-bootstrap-icons'
 import { useTheme } from 'styled-components'
 import { Switch } from '../../../styles'
-import { DragScroll, Alert, Confirm, SelectBusinesses, SelectSites } from '../../Shared'
+import { DragScroll, Alert, Confirm, SelectBusinesses, SelectSites, SelectUsers, SelectLoyaltyLevels } from '../../Shared'
 import { EnterprisePromotionGeneralDetails } from '../EnterprisePromotionGeneralDetails'
 import { EnterprisePromotionRules } from '../EnterprisePromotionRules'
 
@@ -37,7 +37,13 @@ const EnterprisePromotionDetailsUI = (props) => {
     businessesList,
     handleSelectBusiness,
     handleSelectAllBusiness,
-    handleDeletePromotion
+    handleDeletePromotion,
+    selectedUserIds,
+    handleSelectUser,
+
+    selectedLoyaltyLevelIds,
+    handleSelectLoyaltyLevel,
+    handleSelectAllLoyaltyLevels
   } = props
 
   const theme = useTheme()
@@ -50,6 +56,8 @@ const EnterprisePromotionDetailsUI = (props) => {
     { key: 'general', content: t('GENERAL', 'General') },
     { key: 'sites', content: t('SITES', 'Sites') },
     { key: 'businesses', content: t('CONTROL_PANEL_BUSINESS', 'Business') },
+    { key: 'users', content: t('USERS', '') },
+    { key: 'loyalty_levels', content: t('LOYALTY_LEVELS', 'Loyalty Levels') },
     { key: 'rules', content: t('RULES', 'Rules') }
   ]
 
@@ -165,6 +173,7 @@ const EnterprisePromotionDetailsUI = (props) => {
         )}
         {selectedOption === 'sites' && (
           <SelectSites
+            isAllChecked={selectedSitesIds.length === 0}
             isAddMode={isAddMode}
             allSites={sitesState.sites}
             selectedSitesIds={selectedSitesIds}
@@ -189,6 +198,27 @@ const EnterprisePromotionDetailsUI = (props) => {
             handleAddClick={handleAddPromotion}
           />
         )}
+        {selectedOption === 'users' && (
+          <SelectUsers
+            isAddMode={isAddMode}
+            isDisabled={Object.keys(formState.changes).length === 0 || actionState.loading}
+            selectedUserIds={selectedUserIds}
+            handleSelectUser={handleSelectUser}
+            handleUpdateClick={handleUpdateClick}
+            handleAddPromotion={handleAddPromotion}
+          />
+        )}
+        {selectedOption === 'loyalty_levels' && (
+          <SelectLoyaltyLevels
+            isAddMode={isAddMode}
+            isDisabled={Object.keys(formState.changes).length === 0 || actionState.loading}
+            selectedLoyaltyLevelIds={selectedLoyaltyLevelIds}
+            handleSelectLoyaltyLevel={handleSelectLoyaltyLevel}
+            handleSelectAllLoyaltyLevels={handleSelectAllLoyaltyLevels}
+            handleUpdateClick={handleUpdateClick}
+            handleAddPromotion={handleAddPromotion}
+          />
+        )}
         {selectedOption === 'rules' && (
           <EnterprisePromotionRules
             {...props}

package/src/components/Marketing/EnterprisePromotionListing/index.js

@@ -42,7 +42,7 @@ const EnterprisePromotionListingUI = (props) => {
   const [moveDistance, setMoveDistance] = useState(0)
 
   const handleOpenDetails = (promotion) => {
-    setMoveDistance(0)
+    setMoveDistance(0) 
     setSelectedPromotion(promotion)
     setOpenDetails(true)
   }