ordering-ui-admin-external 1.7.0 → 1.7.2

package/_modules/components/Settings/LalamoveConnect/index.js

@@ -0,0 +1,176 @@
+"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.LalaMoveConnect = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
+var _styles = require("../../../styles");
+var _Shared = require("../../Shared");
+var _BsArrowRight = _interopRequireDefault(require("@meronex/icons/bs/BsArrowRight"));
+var _reactBootstrapIcons = require("react-bootstrap-icons");
+var _useWindowSize2 = require("../../../hooks/useWindowSize");
+var _styles2 = require("./styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+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 LalaMoveConnectUI = function LalaMoveConnectUI(props) {
+  var actionState = props.actionState,
+    onClose = props.onClose;
+  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
+    _useLanguage2 = _slicedToArray(_useLanguage, 2),
+    t = _useLanguage2[1];
+  var _useWindowSize = (0, _useWindowSize2.useWindowSize)(),
+    width = _useWindowSize.width;
+  var _useState = (0, _react.useState)({
+      open: false,
+      content: []
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    alertState = _useState2[0],
+    setAlertState = _useState2[1];
+  var _useState3 = (0, _react.useState)({
+      open: false,
+      content: null,
+      handleOnAccept: null
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    confirm = _useState4[0],
+    setConfirm = _useState4[1];
+  var _useState5 = (0, _react.useState)(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    settingsOpen = _useState6[0],
+    setSettingsOpen = _useState6[1];
+  var toggleMainContent = function toggleMainContent() {
+    if (width <= 500) {
+      document.getElementById('catDescription').style.width = '100vw';
+    } else {
+      if (settingsOpen && width >= 1000) {
+        document.getElementById('catDescription').style.width = '1000px';
+      } else {
+        document.getElementById('catDescription').style.width = '500px';
+      }
+    }
+  };
+  var handleGoToLink = function handleGoToLink(link) {
+    window.open(link, '_blank');
+  };
+  (0, _react.useEffect)(function () {
+    if (!(actionState !== null && actionState !== void 0 && actionState.error)) return;
+    setAlertState({
+      open: true,
+      content: actionState === null || actionState === void 0 ? void 0 : actionState.error
+    });
+  }, [actionState === null || actionState === void 0 ? void 0 : actionState.error]);
+  (0, _react.useEffect)(function () {
+    if (width < 1000) return;
+    if (settingsOpen) {
+      document.getElementById('catDescription').style.width = '1000px';
+    } else {
+      toggleMainContent();
+    }
+  }, [settingsOpen]);
+  (0, _react.useEffect)(function () {
+    toggleMainContent();
+  }, [width]);
+  var LalaMoveConnectDescription = function LalaMoveConnectDescription() {
+    return /*#__PURE__*/_react.default.createElement(_styles2.CategoryExtraContent, null, /*#__PURE__*/_react.default.createElement(_styles.IconButton, {
+      color: "black",
+      onClick: function onClick() {
+        return setSettingsOpen(false);
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.XLg, null)), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_styles2.Header, null, /*#__PURE__*/_react.default.createElement("h1", null, t('MORE_INFO', 'More Info'))), /*#__PURE__*/_react.default.createElement(_styles2.SettingListConatiner, null, /*#__PURE__*/_react.default.createElement(_Shared.DragScroll, null, /*#__PURE__*/_react.default.createElement(_styles2.Tab, {
+      active: true
+    }, t('GENERAL', 'General')))), /*#__PURE__*/_react.default.createElement(_styles2.Paragraph, null, /*#__PURE__*/_react.default.createElement("h2", null, t('REQUIREMENTS', 'Requirements')), /*#__PURE__*/_react.default.createElement("p", null, t('LALAMOVE_CONNECT_REQUIREMENTS', 'For this integration to work you need: \n' + '1.- LalaMove account. \n' + '2.- The advanced logistics module must be active. \n' + '3.- Package of Ordering.'))), /*#__PURE__*/_react.default.createElement(_styles2.Paragraph, null, /*#__PURE__*/_react.default.createElement("h2", null, t('ARTICLE', 'Article')), /*#__PURE__*/_react.default.createElement("p", null, t('LALAMOVE_CONNECT_ARTICLE', 'To connect with LalaMove, you’ll have to use plugins, put in your LalaMove credentials, connect your LalaMove account, and create a driver company inside this dashboard; follow the next article step by step and get this connected in less than 5 minutes.')), /*#__PURE__*/_react.default.createElement("a", {
+      onClick: function onClick() {
+        return handleGoToLink(t('LALAMOVE_CONNECT_ARTICLE_LINK', 'https://support.ordering.co/hc/en-us/articles/10673894748941'));
+      }
+    }, t('VIEW_ARTICLE', 'View Article'))), /*#__PURE__*/_react.default.createElement(_styles2.Paragraph, null, /*#__PURE__*/_react.default.createElement("h2", null, t('SUPPORT', 'Support')), /*#__PURE__*/_react.default.createElement("p", null, t('LALAMOVE_CONNECT_SUPPORT', 'Are you having trouble connecting this?')), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement("a", {
+      onClick: function onClick() {
+        return handleGoToLink(t('LALAMOVE_CONNECT_SUPPORT_LINK', 'https://www.ordering.co/contact-ordering'));
+      }
+    }, t('CONTACT_US', 'Contact us')), "; ", /*#__PURE__*/_react.default.createElement("span", null, t('WE_ARE_HAPPY_TO_HELP', 'we are happy to help.')))), /*#__PURE__*/_react.default.createElement(_styles2.Paragraph, null, /*#__PURE__*/_react.default.createElement("h2", null, t('PRICE_INSTALATION', 'Price and installation time.')), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement("span", {
+      className: "bold"
+    }, t('DOORDASH_CONNECT_PRICE', '$99 monthly')), " | ", t('DOORDASH_CONNECT_INSTALLATION', 'less than 24 hrs to get it installed in your project.'))), /*#__PURE__*/_react.default.createElement(_styles2.PurchaseWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Button, {
+      outline: true,
+      color: "primary",
+      onClick: function onClick() {
+        return handleGoToLink(t('PURCHASE_INTEGRATION_LINK', 'https://www.ordering.co/ordering-sales'));
+      }
+    }, t('PURCHASE_INTEGRATION', 'Purchase Integration')))));
+  };
+  return /*#__PURE__*/_react.default.createElement(_styles2.Container, {
+    id: "catDescription"
+  }, /*#__PURE__*/_react.default.createElement(_styles2.LalaMoveConnectContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.DescriptionHeader, null, /*#__PURE__*/_react.default.createElement(_styles2.HeaderIcons, null, /*#__PURE__*/_react.default.createElement(_styles.IconButton, {
+    color: "black",
+    onClick: onClose
+  }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.XLg, null)))), /*#__PURE__*/_react.default.createElement(_styles2.Header, null, /*#__PURE__*/_react.default.createElement("h1", null, t('CONNECT_WITH_LALAMOVE', 'Connect with Lalamove')), /*#__PURE__*/_react.default.createElement(_styles.Button, {
+    color: "lightPrimary"
+  }, t('NEW', 'New'))), /*#__PURE__*/_react.default.createElement(_styles2.Description, null, t('CONNECT_WITH_LALAMOVE_DESCRIPTION', 'If you have already worked with LalaMove or are running your business with LalaMove and Ordering simultaneously, this integration will help you connect both platforms and assign orders through them, making your job easy and automated.')), /*#__PURE__*/_react.default.createElement(_styles2.AllSetting, {
+    onClick: function onClick() {
+      return setSettingsOpen(true);
+    }
+  }, /*#__PURE__*/_react.default.createElement("span", null, t('SETTINGS', 'All settings')), /*#__PURE__*/_react.default.createElement(_BsArrowRight.default, null))), settingsOpen && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, width >= 1000 ? /*#__PURE__*/_react.default.createElement(LalaMoveConnectDescription, null) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Shared.Modal, {
+    width: "70%",
+    height: "90vh",
+    open: true,
+    padding: "0px",
+    onClose: function onClose() {
+      return setSettingsOpen(false);
+    },
+    hideCloseDefault: true
+  }, /*#__PURE__*/_react.default.createElement(LalaMoveConnectDescription, null)))), /*#__PURE__*/_react.default.createElement(_Shared.Alert, {
+    title: t('WEB_APPNAME', 'Ordering'),
+    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
+  }), /*#__PURE__*/_react.default.createElement(_Shared.Confirm, {
+    title: t('WEB_APPNAME', 'Ordering'),
+    content: confirm.content,
+    acceptText: t('ACCEPT', 'Accept'),
+    open: confirm.open,
+    onClose: function onClose() {
+      return setConfirm(_objectSpread(_objectSpread({}, confirm), {}, {
+        open: false
+      }));
+    },
+    onCancel: function onCancel() {
+      return setConfirm(_objectSpread(_objectSpread({}, confirm), {}, {
+        open: false
+      }));
+    },
+    onAccept: confirm.handleOnAccept,
+    closeOnBackdrop: false
+  }));
+};
+var LalaMoveConnect = function LalaMoveConnect(props) {
+  var apiKeysProps = _objectSpread(_objectSpread({}, props), {}, {
+    UIComponent: LalaMoveConnectUI
+  });
+  return /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.ApiKeysList, apiKeysProps);
+};
+exports.LalaMoveConnect = LalaMoveConnect;

package/_modules/components/Settings/LalamoveConnect/styles.js

@@ -0,0 +1,111 @@
+"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.Tab = exports.SettingListConatiner = exports.PurchaseWrapper = exports.Paragraph = exports.LalaMoveConnectContainer = exports.HeaderIcons = exports.Header = exports.DropdownButtonWrapper = exports.DescriptionHeader = exports.Description = exports.Container = exports.CategoryExtraContent = exports.ApiKeysListTable = exports.AllSetting = exports.AddNewButton = 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, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36;
+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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var LalaMoveConnectContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  padding: 26px 20px;\n  box-sizing: border-box;\n  width: 100%;\n  overflow-x: hidden;\n  position: relative;\n\n  @media (min-width: 768px) {\n    padding: 26px 40px;\n  }\n"])));
+exports.LalaMoveConnectContainer = LalaMoveConnectContainer;
+var Header = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-bottom: 30px;\n\n  ", "\n\n  h1 {\n    font-size: 20px;\n    font-weight: 700;\n    margin: 0px;\n    text-transform: capitalize;\n  }\n\n  button {\n    line-height: 12px;\n    height: 16px;\n    font-size: 10px;\n    margin-left: 15px;\n    padding: 2px 8px;\n    border-radius: 50px;\n    ", "\n  }\n"])), function (props) {
+  var _props$theme;
+  return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.rtl ? (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    margin-left: 35px;\n  "]))) : (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    margin-right: 35px;\n  "])));
+}, function (props) {
+  return props.theme.rtl && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      margin-right: 15px;\n      margin-left: 0px;\n    "])));
+});
+exports.Header = Header;
+var ApiKeysListTable = _styledComponents.default.table(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: 100%;\n  margin-top: 25px;\n\n  thead {\n    border-bottom: 1px solid ", ";\n    th {\n      padding: 10px 0;\n      &:last-child {\n        padding-left: 20px;\n        padding-right: 20px;\n      }\n    }\n  }\n  tr {\n    width: 100%;\n    th,\n    td {\n      font-size: 12px;\n      word-break: break-all;\n\n      &:last-child {\n        width: 100px;\n        > div {\n          padding-left: 20px;\n          padding-right: 20px;\n        }\n      }\n    }\n  }\n\n  tbody {\n    border-bottom: 1px solid ", ";\n    td {\n      padding-top: 9px;\n      padding-bottom: 9px;\n\n      &:last-child {\n        > div {\n          display: flex;\n          justify-content: flex-end;\n        }\n      }\n    }\n  }\n"])), function (props) {
+  return props.theme.colors.secundaryLight;
+}, function (props) {
+  return props.theme.colors.borderColor;
+});
+exports.ApiKeysListTable = ApiKeysListTable;
+var DropdownButtonWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  ", "\n  padding: 5px 20px;\n  button {\n    background: transparent !important;\n    border: none;\n    padding: 0px;\n    &:active,\n    &:focus {\n      border-color: unset !important;\n      box-shadow: none !important;\n    }\n    svg {\n      color: ", ";\n    }\n\n    &:after {\n      display: none;\n    }\n  }\n\n  .show {\n    button {\n      background: ", " !important;\n      border-color: unset !important;\n      box-shadow: none !important;\n    }\n    >div {\n      border: 1px solid ", ";\n      box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n    }\n  }\n\n  > div {\n    > div {\n      border-radius: 8px;\n      .dropdown-item {\n        font-size: 12px;\n        color: ", ";\n      }\n      .dropdown-item:last-child {\n        color: #E63757;\n      }\n    }\n  }\n"])), function (props) {
+  var _props$theme2;
+  return props !== null && props !== void 0 && (_props$theme2 = props.theme) !== null && _props$theme2 !== void 0 && _props$theme2.rtl ? (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    border-right: 1px solid ", ";\n  "])), function (props) {
+    return props.theme.colors.borderColor;
+  }) : (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    border-left: 1px solid ", ";\n  "])), function (props) {
+    return props.theme.colors.borderColor;
+  });
+}, function (props) {
+  return props.theme.colors.headingColor;
+}, function (props) {
+  return props.theme.colors.secundary;
+}, function (props) {
+  return props.theme.colors.borderColor;
+}, function (props) {
+  return props.theme.colors.headingColor;
+});
+exports.DropdownButtonWrapper = DropdownButtonWrapper;
+var AddNewButton = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  cursor: pointer;\n  font-size: 12px;\n  color: ", ";\n  margin: 20px 0;\n  width: fit-content;\n\n  &:hover {\n    color: ", ";\n  }\n"])), function (props) {
+  return props.theme.colors.lightGray;
+}, function (props) {
+  return props.theme.colors.primary;
+});
+exports.AddNewButton = AddNewButton;
+var AllSetting = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  user-select: none;\n  cursor: pointer;\n  margin-top: 36px;\n  cursor: pointer;\n  span {\n    font-weight: 600;\n    font-size: 14px;\n    color: ", ";\n  }\n  svg {\n    color: ", ";\n    margin-left: 5px;\n    transition: 0.2s linear;\n    ", "\n  }\n  &:hover {\n    svg {\n      transform: translateX(3px);\n    }\n  }\n"])), function (props) {
+  return props.theme.colors.primary;
+}, function (props) {
+  return props.theme.colors.primary;
+}, function (props) {
+  return props.theme.rtl && (0, _styledComponents.css)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n      margin-right: 5px;\n      margin-left: 0px;\n    "])));
+});
+exports.AllSetting = AllSetting;
+var Description = _styledComponents.default.p(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  margin-top: 40px;\n  font-size: 14px;\n  margin-bottom: 0px;\n  text-align: justify;\n\n  @media (min-width: 768px) {\n    text-align: initial;\n  }\n"])));
+exports.Description = Description;
+var CategoryExtraContent = _styledComponents.default.div(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n  position: relative;\n  padding: 26px 26px 60px 26px;\n  box-sizing: border-box;\n  width: 100%;\n  overflow: auto;\n\n  ", "\n\n  > button {\n    z-index: 100;\n    position: absolute;\n    top: 25px;\n    ", "\n  }\n"])), function (props) {
+  var _props$theme3;
+  return (_props$theme3 = props.theme) !== null && _props$theme3 !== void 0 && _props$theme3.rtl ? (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n    border-right: 1px solid #E9ECEF;\n  "]))) : (0, _styledComponents.css)(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n    border-left: 1px solid #E9ECEF;\n  "])));
+}, function (props) {
+  var _props$theme4;
+  return (_props$theme4 = props.theme) !== null && _props$theme4 !== void 0 && _props$theme4.rtl ? (0, _styledComponents.css)(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n      left: 20px;\n    "]))) : (0, _styledComponents.css)(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n      right: 20px;\n    "])));
+});
+exports.CategoryExtraContent = CategoryExtraContent;
+var Container = _styledComponents.default.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 0;\n  position: fixed;\n  box-shadow: -4px 0px 7px #ccc;\n\n  ", "\n  background: ", ";\n  height: calc(var(--vh, 1vh) * 100);\n  top: 0px;\n  z-index: 1001;\n  overflow-x: hidden;\n  transition: 0.3s;\n\n  ", "\n  @media print {\n    box-shadow: none;\n  }\n"])), function (_ref) {
+  var isDriverOrders = _ref.isDriverOrders;
+  return isDriverOrders && (0, _styledComponents.css)(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n    position: absolute;\n    box-shadow: none;\n\n    ", "\n  "])), function (props) {
+    var _props$theme5;
+    return (_props$theme5 = props.theme) !== null && _props$theme5 !== void 0 && _props$theme5.rtl ? (0, _styledComponents.css)(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n      border-right: 1px solid #CCC;\n    "]))) : (0, _styledComponents.css)(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n      border-left: 1px solid #CCC;\n    "])));
+  });
+}, function (props) {
+  var _props$theme$colors;
+  return ((_props$theme$colors = props.theme.colors) === null || _props$theme$colors === void 0 ? void 0 : _props$theme$colors.backgroundPage) || '#FFF';
+}, function (props) {
+  var _props$theme6;
+  return (_props$theme6 = props.theme) !== null && _props$theme6 !== void 0 && _props$theme6.rtl ? (0, _styledComponents.css)(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n    left: 0px;\n    "]))) : (0, _styledComponents.css)(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n    right: 0px;\n  "])));
+});
+exports.Container = Container;
+var DescriptionHeader = _styledComponents.default.div(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n"])));
+exports.DescriptionHeader = DescriptionHeader;
+var HeaderIcons = _styledComponents.default.div(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n  display: flex;\n  position: absolute;\n  top: 25px;\n  right: 20px;\n\n  > button:first-child {\n    ", "\n  }\n"])), function (props) {
+  var _props$theme7;
+  return (_props$theme7 = props.theme) !== null && _props$theme7 !== void 0 && _props$theme7.rtl ? (0, _styledComponents.css)(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n      margin-left: 8px;\n    "]))) : (0, _styledComponents.css)(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n      margin-right: 8px;\n    "])));
+});
+exports.HeaderIcons = HeaderIcons;
+var SettingListConatiner = _styledComponents.default.div(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n  width: 100%;\n  margin: 20px 0;\n  border-bottom: 1px solid #E9ECEF;\n"])));
+exports.SettingListConatiner = SettingListConatiner;
+var Tab = _styledComponents.default.div(_templateObject30 || (_templateObject30 = _taggedTemplateLiteral(["\n  user-select: none;\n  padding: 10px 0px;\n  cursor: pointer;\n  color: ", ";\n  font-size: 14px;\n  white-space: nowrap;\n  ", "\n\n  ", "\n\n  ", "\n"])), function (props) {
+  var _props$theme$colors2;
+  return (_props$theme$colors2 = props.theme.colors) === null || _props$theme$colors2 === void 0 ? void 0 : _props$theme$colors2.headingColor;
+}, function (props) {
+  var _props$theme8;
+  return (_props$theme8 = props.theme) !== null && _props$theme8 !== void 0 && _props$theme8.rtl ? (0, _styledComponents.css)(_templateObject31 || (_templateObject31 = _taggedTemplateLiteral(["\n    margin-left: 30px;\n  "]))) : (0, _styledComponents.css)(_templateObject32 || (_templateObject32 = _taggedTemplateLiteral(["\n    margin-right: 30px;\n  "])));
+}, function (_ref2) {
+  var active = _ref2.active;
+  return active && (0, _styledComponents.css)(_templateObject33 || (_templateObject33 = _taggedTemplateLiteral(["\n    border-bottom: 2px solid;\n    font-weight: 500;\n  "])));
+}, function (_ref3) {
+  var active = _ref3.active;
+  return !active && (0, _styledComponents.css)(_templateObject34 || (_templateObject34 = _taggedTemplateLiteral(["\n    color: #909BA9;\n  "])));
+});
+exports.Tab = Tab;
+var Paragraph = _styledComponents.default.div(_templateObject35 || (_templateObject35 = _taggedTemplateLiteral(["\n  margin-top: 20px;\n  h2{\n    font-size: 16px;\n  }\n  p{\n    white-space: pre-line;\n    font-size: 12px;\n    margin: 0;\n  }\n  span {\n    font-size: 12px;\n  }\n  a {\n    text-decoration: underline !important;\n    cursor: pointer;\n    font-size: 12px;\n    color: ", " !important;\n  }\n  .bold {\n    font-weight: 600;\n  }\n"])), function (props) {
+  return props.theme.colors.primary;
+});
+exports.Paragraph = Paragraph;
+var PurchaseWrapper = _styledComponents.default.div(_templateObject36 || (_templateObject36 = _taggedTemplateLiteral(["\n  button {\n    border-radius: 5px;\n  }\n  margin-top: 15px;\n"])));
+exports.PurchaseWrapper = PurchaseWrapper;

package/_modules/components/Settings/index.js

@@ -75,6 +75,12 @@ Object.defineProperty(exports, "IntegrationListing", {
     return _IntegrationListing.IntegrationListing;
   }
 });
+Object.defineProperty(exports, "LalaMoveConnect", {
+  enumerable: true,
+  get: function get() {
+    return _LalaMoveConnect.LalaMoveConnect;
+  }
+});
 Object.defineProperty(exports, "LanguageManager", {
   enumerable: true,
   get: function get() {
@@ -192,6 +198,7 @@ var _SettingItemUI = require("./SettingItemUI");
 var _AddressFieldsSetting = require("./AddressFieldsSetting");
 var _CheckoutFieldsSetting = require("./CheckoutFieldsSetting");
 var _LanguageSetting = require("./LanguageSetting");
+var _LalaMoveConnect = require("./LalaMoveConnect");
 var _SettingsDetail = require("./SettingsDetail");
 var _EmailSetting = require("./EmailSetting");
 var _SettingsList = require("./SettingsList");

package/index-template.js

@@ -38,6 +38,7 @@ import googlePlay from './template/assets/images/google-play.png'
 import deliverect from './template/assets/images/deliverect.png'
 import ItsaCheckmateLogo from './template/assets/images/ItsaCheckmateLogo.png'
 import doordash from './template/assets/images/door-dash.png'
+import lalamove from './template/assets/images/lala-move.png'
 /**
  * project statuses
  */
@@ -220,7 +221,8 @@ theme.images = {
     googlePlay,
     deliverect,
     ItsaCheckmateLogo,
-    doordash
+    doordash,
+    lalamove
   },
   project: {
     active: projectActive,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-admin-external",
-  "version": "1.7.0",
+  "version": "1.7.2",
   "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.7.0",
+    "ordering-components-admin-external": "1.7.1",
     "polished": "^3.6.7",
     "prop-types": "^15.7.2",
     "react-big-calendar": "^1.4.2",

package/src/components/BusinessIntelligence/AnalyticsBusinessFilter/index.js

@@ -1,8 +1,7 @@
 import React, { useState, useEffect } from 'react'
 import { useLanguage, AnalyticsBusinessFilter as AnalyticsBusinessFilterController } from 'ordering-components-admin-external'
 import Skeleton from 'react-loading-skeleton'
-import RiCheckboxBlankLine from '@meronex/icons/ri/RiCheckboxBlankLine'
-import RiCheckboxFill from '@meronex/icons/ri/RiCheckboxFill'
+import { CheckSquareFill as Checked, Square as UnChecked } from 'react-bootstrap-icons'
 import { SearchBar, Pagination } from '../../Shared'
 import { Button } from '../../../styles'
 import {
@@ -45,15 +44,6 @@ const AnalyticsBusinessFilterUI = (props) => {
     setPagesPerPage(pageSize)
   }
 
-  const isCheckEnableSate = (id) => {
-    const found = businessIds?.find(businessId => businessId === id)
-    let valid = false
-    if (found) {
-      valid = true
-    }
-    return valid
-  }
-
   useEffect(() => {
     if (businessList.loading) return
     let _totalPages
@@ -82,7 +72,7 @@ const AnalyticsBusinessFilterUI = (props) => {
         {businessList.loading ? (
           [...Array(10).keys()].map(i => (
             <BusinessFilterOption key={i}>
-              <Skeleton width={15} height={15} />
+              <Skeleton width={18} height={18} />
               <BusinessName>
                 <Skeleton width={120} height={24} />
               </BusinessName>
@@ -95,9 +85,9 @@ const AnalyticsBusinessFilterUI = (props) => {
                 onClick={handleChangeAllCheck}
               >
                 {isAllCheck ? (
-                  <RiCheckboxFill className='fill' />
+                  <Checked className='fill' />
                 ) : (
-                  <RiCheckboxBlankLine />
+                  <UnChecked />
                 )}
                 <BusinessName>{t('ALL', 'All')}</BusinessName>
               </BusinessFilterOption>
@@ -107,10 +97,10 @@ const AnalyticsBusinessFilterUI = (props) => {
                 key={i}
                 onClick={() => handleChangeBusinessId(business?.id)}
               >
-                {isCheckEnableSate(business.id) ? (
-                  <RiCheckboxFill className='fill' />
+                {businessIds?.includes(business.id) ? (
+                  <Checked className='fill' />
                 ) : (
-                  <RiCheckboxBlankLine />
+                  <UnChecked />
                 )}
                 <BusinessName>{business?.name}</BusinessName>
               </BusinessFilterOption>

package/src/components/BusinessIntelligence/AnalyticsBusinessFilter/styles.js

@@ -5,13 +5,13 @@ export const AnalyticsBusinessFilterContainer = styled.div``
 export const BusinessFilterOption = styled.div`
   display: flex;
   align-items: center;
-  border-bottom: 1px solid #E9ECEF;
+  border-bottom: 1px solid ${props => props.theme.colors.borderColor};
   padding: 10px 0;
   cursor: pointer;
 
   svg {
-    font-size: 24px;
-    color: #B1BCCC;
+    font-size: 18px;
+    color: ${props => props.theme.colors.secundaryLight};
 
     &.fill {
       color: ${props => props.theme.colors.primary};

package/src/components/BusinessIntelligence/AnalyticsCalendar/index.js

@@ -82,7 +82,7 @@ export const AnalyticsCalendar = (props) => {
       </Button>
       {
         isShowCalendar && (
-          <AnalyticsCalendarContainer ref={calendarRef} leftAlign={leftAlign}>
+          <AnalyticsCalendarContainer className='ordering-calendar' ref={calendarRef} leftAlign={leftAlign}>
             <DateRange
               editableDateInputs
               onChange={item => handleChangeDates(item)}

package/src/components/BusinessIntelligence/AnalyticsDriverOrders/index.js

@@ -19,7 +19,8 @@ import {
 export const AnalyticsDriverOrders = (props) => {
   const {
     isOrders,
-    chartDataList
+    chartDataList,
+    countryCode
   } = props
 
   const [, t] = useLanguage()
@@ -91,11 +92,18 @@ export const AnalyticsDriverOrders = (props) => {
 
   const TotalSales = () => {
     let sales = 0
-    if (!chartDataList?.data?.dataset?.dataset[0]?.data || chartDataList?.data?.dataset?.dataset[0]?.data.length === 0) return sales
+    if (!chartDataList?.data?.dataset?.dataset[0]?.data || chartDataList?.data?.dataset?.dataset[0]?.data.length === 0) return getFormattedValue(sales, countryCode)
     for (const data of chartDataList?.data?.dataset?.dataset[0]?.data) {
       sales += data.y
     }
-    return parsePrice(sales.toFixed(2), { separator: '.' })
+    return getFormattedValue(sales, countryCode)
+  }
+
+  const getFormattedValue = (value, flag) => {
+    const formattedValue = flag
+      ? parsePrice(value.toFixed(2), { separator: '.' })
+      : value.toFixed(2)
+    return formattedValue
   }
 
   const downloadCSV = () => {

package/src/components/BusinessIntelligence/AnalyticsDriverOrders/styles.js

@@ -61,7 +61,7 @@ export const ChartFooterContainer = styled.div`
 
   p {
     font-size: 14px;
-    color: #909BA9;
+    color: ${props => props.theme.colors.lightGray};
     margin: 0;
   }
 `

package/src/components/BusinessIntelligence/AnalyticsDriversFilter/styles.js

@@ -17,7 +17,7 @@ export const TreeViewParentItem = styled.div`
 
   svg {
     font-size: 24px;
-    color: #B1BCCC;
+    color: ${props => props.theme.colors.secundaryLight};
     &.fill {
       color: ${props => props.theme?.colors.primary};
     }
@@ -49,7 +49,7 @@ export const TreeViewChildrenItem = styled.div`
 
   svg {
     font-size: 24px;
-    color: #B1BCCC;
+    color: ${props => props.theme.colors.secundaryLight};
     &.fill {
       color: ${props => props.theme?.colors.primary};
     }

package/src/components/BusinessIntelligence/AnalyticsFilterTimeZone/styles.js

@@ -8,8 +8,9 @@ export const AnalyticsTimeZoneContainer = styled.div`
     border-radius: 7.6px;
     padding: 7px 12px;
     font-size: 14px;
-    color: #748194;
+    color: ${props => props.theme.colors.secundaryContrast};
     border: none;
+    width: 100%;
   }
 `
 
@@ -17,19 +18,15 @@ export const TimeZoneSelectWrapper = styled.div`
   position: absolute;
   width: 300px;
   top: 100%;
-  right: -60px;
+  right: 0;
   padding: 25px;
   background: ${props => props.theme.colors?.backgroundPage || '#FFF'};
-  border: 1px solid #E9ECEF;
+  border: 1px solid ${props => props.theme.colors.borderColor};
   box-sizing: border-box;
   box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);
   border-radius: 7.6px;
   z-index: 100;
   margin-top: 18px;
-
-  @media (min-width: 576px) {
-    right: 0;
-  }
 `
 export const TimeZoneSearchWrapper = styled.div`
   position: relative;
@@ -50,7 +47,7 @@ export const SearchIconWrapper = styled.div`
 
   svg {
     font-size: 16px;
-    color: #B1BCCC;
+    color: ${props => props.theme.colors.secundaryLight};
   }
 `
 

package/src/components/BusinessIntelligence/AnalyticsOrdersAcceptSpend/styles.js

@@ -25,7 +25,7 @@ export const ReviewContentWrapper = styled.div`
   p {
     margin: 0;
     font-size: 14px;
-    color: #909BA9;
+    color: ${props => props.theme.colors.lightGray};
     text-align: center;
   }
 `

package/src/components/BusinessIntelligence/AnalyticsOrdersOrSales/index.js

@@ -20,7 +20,8 @@ export const AnalyticsOrdersOrSales = (props) => {
   const {
     isOrders,
     chartDataList,
-    filterList
+    filterList,
+    countryCode
   } = props
 
   const [, t] = useLanguage()
@@ -182,7 +183,10 @@ export const AnalyticsOrdersOrSales = (props) => {
     for (const data of chartDataList?.data) {
       sales += data.sales
     }
-    return parsePrice(sales.toFixed(2), { separator: '.' })
+    const totalSales = countryCode
+      ? parsePrice(sales.toFixed(2), { separator: '.' })
+      : sales.toFixed(2)
+    return totalSales
   }
 
   const downloadCSV = () => {

package/src/components/BusinessIntelligence/AnalyticsOrdersOrSales/styles.js

@@ -61,7 +61,7 @@ export const ChartFooterContainer = styled.div`
 
   p {
     font-size: 14px;
-    color: #909BA9;
+    color: ${props => props.theme.colors.lightGray};
     margin: 0;
   }
 `

package/src/components/BusinessIntelligence/AnalyticsOrdersStatus/styles.js

@@ -52,7 +52,7 @@ export const OrderStatusFooter = styled.div`
 
   p {
     font-size: 14px;
-    color: #909BA9;
+    color: ${props => props.theme.colors.lightGray};
     margin: 0;
   }
 `