ordering-ui-admin-external 1.33.1 → 1.35.0

package/_modules/components/Orders/OrderDetails/index.js

@@ -66,7 +66,6 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
     register = _useForm.register,
     handleSubmit = _useForm.handleSubmit,
     errors = _useForm.formState.errors;
-  var history = (0, _reactRouterDom.useHistory)();
   var query = new URLSearchParams((0, _reactRouterDom.useLocation)().search);
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -119,10 +118,13 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
     _useState14 = _slicedToArray(_useState13, 2),
     alertState = _useState14[0],
     setAlertState = _useState14[1];
-  var _useState15 = (0, _react.useState)(false),
+  var _useState15 = (0, _react.useState)({
+      open: false,
+      driverId: null
+    }),
     _useState16 = _slicedToArray(_useState15, 2),
-    isCommentPopup = _useState16[0],
-    setIsCommentPopup = _useState16[1];
+    commentInfoState = _useState16[0],
+    setCommentInfostate = _useState16[1];
   var placeSpotEnabled = [3, 4];
   var _props$order = props.order,
     order = _props$order.order,
@@ -212,8 +214,9 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
     }
     setExtraOpen(true);
     if (!isInitialRender) {
-      var orderId = query.get('id');
-      history.replace("".concat(location.pathname, "?id=").concat(orderId, "&section=").concat(option));
+      (0, _utils.addQueryToUrl)({
+        section: option
+      });
     }
   };
   (0, _react.useEffect)(function () {
@@ -315,12 +318,16 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
       history: false
     });
     setShowOption(null);
-    var orderId = query.get('id');
-    history.replace("".concat(location.pathname, "?id=").concat(orderId));
+    (0, _utils.removeQueryToUrl)(['section', 'tab']);
   };
   var onSubmit = function onSubmit(data) {
-    handleUpdateComment(data === null || data === void 0 ? void 0 : data.manual_driver_assignment_comment);
-    setIsCommentPopup(false);
+    handleUpdateComment({
+      comment: data === null || data === void 0 ? void 0 : data.manual_driver_assignment_comment,
+      driverId: commentInfoState === null || commentInfoState === void 0 ? void 0 : commentInfoState.driverId
+    });
+    setCommentInfostate(_objectSpread(_objectSpread({}, commentInfoState), {}, {
+      open: false
+    }));
   };
   (0, _react.useEffect)(function () {
     if (!open) return;
@@ -428,7 +435,8 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
     setCurrentTourStep: setCurrentTourStep,
     setAddressState: setAddressState,
     handleShowOption: handleShowOption,
-    setIsCommentPopup: setIsCommentPopup
+    setCommentInfostate: setCommentInfostate,
+    commentInfoState: commentInfoState
   }), /*#__PURE__*/_react.default.createElement(_styles2.OrderProducts, null, /*#__PURE__*/_react.default.createElement("h2", null, t('EXPORT_SUMMARY', 'Summary')), (order === null || order === void 0 || (_order$products = order.products) === null || _order$products === void 0 ? void 0 : _order$products.length) && (order === null || order === void 0 ? void 0 : order.products.map(function (product) {
     return /*#__PURE__*/_react.default.createElement(_ProductItemAccordion.ProductItemAccordion, {
       key: product.id,
@@ -551,10 +559,13 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
     closeOnBackdrop: false
   }), /*#__PURE__*/_react.default.createElement(_Shared.Modal, {
     width: "500px",
-    open: isCommentPopup,
+    open: commentInfoState === null || commentInfoState === void 0 ? void 0 : commentInfoState.open,
     title: t('ORDERING', 'Ordering'),
     onClose: function onClose() {
-      return setIsCommentPopup(false);
+      return setCommentInfostate({
+        driverId: null,
+        open: false
+      });
     }
   }, /*#__PURE__*/_react.default.createElement(_styles2.AssigmentCommentContainer, {
     onSubmit: handleSubmit(onSubmit)

package/_modules/components/Orders/OrderStatusFilterBar/index.js

@@ -1,15 +1,20 @@
 "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.OrderStatusFilterBar = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
 var _Shared = require("../../Shared");
 var _CgSpinnerTwoAlt = _interopRequireDefault(require("@meronex/icons/cg/CgSpinnerTwoAlt"));
+var _reactRouterDom = require("react-router-dom");
+var _utils = require("../../../utils");
 var _styles = 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 _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); }
@@ -18,16 +23,34 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var OrderStatusFilterBar = function OrderStatusFilterBar(props) {
   var _ordersAmountByStatus, _ordersAmountByStatus2, _ordersAmountByStatus3, _ordersAmountByStatus4;
-  var selectedOrderStatus = props.selectedOrderStatus,
+  var isUseQuery = props.isUseQuery,
+    selectedOrderStatus = props.selectedOrderStatus,
     changeOrderStatus = props.changeOrderStatus,
     ordersAmountByStatus = props.ordersAmountByStatus;
+  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
+    _useLanguage2 = _slicedToArray(_useLanguage, 2),
+    t = _useLanguage2[1];
+  var query = new URLSearchParams((0, _reactRouterDom.useLocation)().search);
+  var defaultStatus = query.get('status');
   var changeSelectedOrderStatus = function changeSelectedOrderStatus(orderStatus) {
     window.scrollTo(0, 0);
     changeOrderStatus(orderStatus);
+    if (isUseQuery) {
+      (0, _utils.addQueryToUrl)({
+        status: orderStatus
+      });
+    }
   };
-  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
-    _useLanguage2 = _slicedToArray(_useLanguage, 2),
-    t = _useLanguage2[1];
+  (0, _react.useEffect)(function () {
+    if (!isUseQuery) return;
+    if (defaultStatus) {
+      changeOrderStatus(defaultStatus);
+      return;
+    }
+    (0, _utils.addQueryToUrl)({
+      status: 'pending'
+    });
+  }, []);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.OrderStatusFilterContainer, {
     className: "order_status_filter"
   }, /*#__PURE__*/_react.default.createElement(_Shared.DragScroll, null, /*#__PURE__*/_react.default.createElement(_styles.Tab, {

package/_modules/components/Orders/OrdersCards/index.js

@@ -13,6 +13,7 @@ var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skelet
 var _FaUserAlt = _interopRequireDefault(require("@meronex/icons/fa/FaUserAlt"));
 var _Shared = require("../../Shared");
 var _useWindowSize2 = require("../../../hooks/useWindowSize");
+var _utils = require("../../../utils");
 var _styles = 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); }
@@ -43,7 +44,8 @@ var OrdersCards = function OrdersCards(props) {
     handleOrderCardClick = props.handleOrderCardClick,
     handleUpdateDriverLocation = props.handleUpdateDriverLocation,
     slaSettingTime = props.slaSettingTime,
-    isDelivery = props.isDelivery;
+    isDelivery = props.isDelivery,
+    isUseQuery = props.isUseQuery;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -224,6 +226,13 @@ var OrdersCards = function OrdersCards(props) {
       slaBar: slaSettings
     }));
   }, [configState.loading]);
+  (0, _react.useEffect)(function () {
+    if (!isUseQuery || !(pagination !== null && pagination !== void 0 && pagination.currentPage) || !(pagination !== null && pagination !== void 0 && pagination.pageSize) || !(pagination !== null && pagination !== void 0 && pagination.total)) return;
+    (0, _utils.addQueryToUrl)({
+      page: pagination.currentPage,
+      pageSize: pagination.pageSize
+    });
+  }, [pagination === null || pagination === void 0 ? void 0 : pagination.currentPage, pagination === null || pagination === void 0 ? void 0 : pagination.pageSize, pagination === null || pagination === void 0 ? void 0 : pagination.total]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.OrdersListContainer, null, orderList.loading ? _toConsumableArray(Array(10).keys()).map(function (i) {
     return /*#__PURE__*/_react.default.createElement(_styles.OrderCard, {
       key: i

package/_modules/components/Orders/OrdersDashboardControls/index.js

@@ -24,7 +24,9 @@ var OrdersDashboardControls = function OrdersDashboardControls(props) {
     handleDeleteMultiOrders = props.handleDeleteMultiOrders,
     handleChangeMultiOrdersStatus = props.handleChangeMultiOrdersStatus,
     handleOpenCustomOrderDetail = props.handleOpenCustomOrderDetail,
-    handleOpenOrderDetail = props.handleOpenOrderDetail;
+    handleOpenOrderDetail = props.handleOpenOrderDetail,
+    ordersStatusGroup = props.ordersStatusGroup,
+    selectedSubOrderStatus = props.selectedSubOrderStatus;
   var _useSession = (0, _orderingComponentsAdminExternal.useSession)(),
     _useSession2 = _slicedToArray(_useSession, 1),
     user = _useSession2[0].user;
@@ -32,7 +34,9 @@ var OrdersDashboardControls = function OrdersDashboardControls(props) {
     handleOpenCustomOrderDetail: handleOpenCustomOrderDetail,
     handleOpenOrderDetail: handleOpenOrderDetail
   }), /*#__PURE__*/_react.default.createElement(_OrdersExportCSV.OrdersExportCSV, {
-    filterValues: filterValues
+    filterValues: filterValues,
+    ordersStatusGroup: ordersStatusGroup,
+    selectedSubOrderStatus: selectedSubOrderStatus
   }), selectedOrderNumber > 0 && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (user === null || user === void 0 ? void 0 : user.level) !== 5 && /*#__PURE__*/_react.default.createElement(_OrderDelete.OrderDelete, {
     handleDeleteMultiOrders: handleDeleteMultiOrders
   }), /*#__PURE__*/_react.default.createElement(_styles.WrapOrderStatusTypeSelector, null, /*#__PURE__*/_react.default.createElement(_OrderStatusTypeSelector.OrderStatusTypeSelector, {

package/_modules/components/Orders/OrdersDashboardList/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.OrdersDashboardList = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _reactRouterDom = require("react-router-dom");
 var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
 var _OrdersListing = require("../OrdersListing");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -19,7 +20,12 @@ var OrdersDashboardList = function OrdersDashboardList(props) {
   var selectedSubOrderStatus = props.selectedSubOrderStatus,
     isMessagesView = props.isMessagesView,
     orderByOption = props.orderByOption,
-    setOrdersAmountByStatus = props.setOrdersAmountByStatus;
+    setOrdersAmountByStatus = props.setOrdersAmountByStatus,
+    isUseQuery = props.isUseQuery;
+  var query = new URLSearchParams((0, _reactRouterDom.useLocation)().search);
+  var defaultStatus = query.get('status');
+  var defaultPage = query.get('page') || 1;
+  var defaultPageSize = query.get('pageSize') || 10;
   var OrdersCommonControlProps = _objectSpread(_objectSpread({}, props), {}, {
     UIComponent: _OrdersListing.OrdersListing,
     useDefualtSessionManager: true,
@@ -36,10 +42,19 @@ var OrdersDashboardList = function OrdersDashboardList(props) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isMessagesView ? /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DashboardOrdersList, _extends({
     isMessagesView: true
   }, OrdersCommonControlProps, {
+    paginationSettings: {
+      initialPage: isUseQuery && !isNaN(defaultPage) ? Number(defaultPage) : 1,
+      pageSize: isUseQuery && !isNaN(defaultPage) ? Number(defaultPageSize) : 10,
+      controlType: 'pages'
+    },
     orderStatus: selectedSubOrderStatus === null || selectedSubOrderStatus === void 0 ? void 0 : selectedSubOrderStatus.all
-  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DashboardOrdersList, _extends({
-    groupStatus: "pending"
-  }, OrdersCommonControlProps, {
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DashboardOrdersList, _extends({}, OrdersCommonControlProps, {
+    paginationSettings: {
+      initialPage: isUseQuery && defaultStatus === 'pending' && !isNaN(defaultPage) ? Number(defaultPage) : 1,
+      pageSize: isUseQuery && defaultStatus === 'pending' && !isNaN(defaultPage) ? Number(defaultPageSize) : 10,
+      controlType: 'pages'
+    },
+    groupStatus: "pending",
     orderStatus: selectedSubOrderStatus === null || selectedSubOrderStatus === void 0 ? void 0 : selectedSubOrderStatus.pending,
     setOrdersTotalAmount: function setOrdersTotalAmount(total) {
       return setOrdersAmountByStatus(function (prevState) {
@@ -51,6 +66,11 @@ var OrdersDashboardList = function OrdersDashboardList(props) {
   })), /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DashboardOrdersList, _extends({
     groupStatus: "inProgress"
   }, OrdersCommonControlProps, {
+    paginationSettings: {
+      initialPage: isUseQuery && defaultStatus === 'inProgress' && !isNaN(defaultPage) ? Number(defaultPage) : 1,
+      pageSize: isUseQuery && defaultStatus === 'inProgress' && !isNaN(defaultPage) ? Number(defaultPageSize) : 10,
+      controlType: 'pages'
+    },
     orderStatus: selectedSubOrderStatus === null || selectedSubOrderStatus === void 0 ? void 0 : selectedSubOrderStatus.inProgress,
     setOrdersTotalAmount: function setOrdersTotalAmount(total) {
       return setOrdersAmountByStatus(function (prevState) {
@@ -62,6 +82,11 @@ var OrdersDashboardList = function OrdersDashboardList(props) {
   })), /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DashboardOrdersList, _extends({
     groupStatus: "completed"
   }, OrdersCommonControlProps, {
+    paginationSettings: {
+      initialPage: isUseQuery && defaultStatus === 'completed' && !isNaN(defaultPage) ? Number(defaultPage) : 1,
+      pageSize: isUseQuery && defaultStatus === 'completed' && !isNaN(defaultPage) ? Number(defaultPageSize) : 10,
+      controlType: 'pages'
+    },
     orderStatus: selectedSubOrderStatus === null || selectedSubOrderStatus === void 0 ? void 0 : selectedSubOrderStatus.completed,
     setOrdersTotalAmount: function setOrdersTotalAmount(total) {
       return setOrdersAmountByStatus(function (prevState) {
@@ -73,6 +98,11 @@ var OrdersDashboardList = function OrdersDashboardList(props) {
   })), /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DashboardOrdersList, _extends({
     groupStatus: "cancelled"
   }, OrdersCommonControlProps, {
+    paginationSettings: {
+      initialPage: isUseQuery && defaultStatus === 'cancelled' && !isNaN(defaultPage) ? Number(defaultPage) : 1,
+      pageSize: isUseQuery && defaultStatus === 'cancelled' && !isNaN(defaultPage) ? Number(defaultPageSize) : 10,
+      controlType: 'pages'
+    },
     orderStatus: selectedSubOrderStatus === null || selectedSubOrderStatus === void 0 ? void 0 : selectedSubOrderStatus.cancelled,
     setOrdersTotalAmount: function setOrdersTotalAmount(total) {
       return setOrdersAmountByStatus(function (prevState) {

package/_modules/components/Orders/OrdersFilterGroup/styles.js

@@ -43,7 +43,7 @@ var Option = _styledComponents.default.div(_templateObject11 || (_templateObject
   return props.theme.colors.secundaryContrast;
 });
 exports.Option = Option;
-var WarningMessage = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  align-items: center;\n  z-index: 2000;\n  top: 100%;\n  background: ", ";\n  border: 1px solid ", ";\n  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n  border-radius: 7.6px;\n  padding: 6px 15px;\n  box-sizing: border-box;\n  margin: 10px 0px 0px 0px !important;\n\n  right: 0px;\n  ", "\n\n  svg {\n    font-size: 20px;\n    color: ", ";\n  }\n\n  span {\n    font-size: 12px;\n    line-height: 18px;\n    color: ", ";\n    margin: 0 10px;\n    flex: 1;\n  }\n\n  a {\n    font-size: 12px;\n    white-space: nowrap;\n  }\n\n  @media (min-width: 768px) {\n    padding: 8px 20px;\n    font-size: 14px;\n    line-height: 24px;\n    right: 0px;\n    ", "\n\n    span {\n      white-space: nowrap;\n    }\n  }\n"])), function (props) {
+var WarningMessage = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  position: absolute;\n  display: flex;\n  align-items: center;\n  z-index: 10;\n  top: 100%;\n  background: ", ";\n  border: 1px solid ", ";\n  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n  border-radius: 7.6px;\n  padding: 6px 15px;\n  box-sizing: border-box;\n  margin: 10px 0px 0px 0px !important;\n\n  right: 0px;\n  ", "\n\n  svg {\n    font-size: 20px;\n    color: ", ";\n  }\n\n  span {\n    font-size: 12px;\n    line-height: 18px;\n    color: ", ";\n    margin: 0 10px;\n    flex: 1;\n  }\n\n  a {\n    font-size: 12px;\n    white-space: nowrap;\n  }\n\n  @media (min-width: 768px) {\n    padding: 8px 20px;\n    font-size: 14px;\n    line-height: 24px;\n    right: 0px;\n    ", "\n\n    span {\n      white-space: nowrap;\n    }\n  }\n"])), function (props) {
   return props.theme.colors.warning100;
 }, function (props) {
   return props.theme.colors.warning;

package/_modules/components/Orders/OrdersListing/index.js

@@ -57,7 +57,8 @@ var OrdersListing = function OrdersListing(props) {
     setAllowColumns = props.setAllowColumns,
     handleDrop = props.handleDrop,
     isDelivery = props.isDelivery,
-    saveUserSettings = props.saveUserSettings;
+    saveUserSettings = props.saveUserSettings,
+    isUseQuery = props.isUseQuery;
   var theme = (0, _styledComponents.useTheme)();
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
@@ -128,7 +129,8 @@ var OrdersListing = function OrdersListing(props) {
     allowColumns: allowColumns,
     setAllowColumns: setAllowColumns,
     handleDrop: handleDrop,
-    saveUserSettings: saveUserSettings
+    saveUserSettings: saveUserSettings,
+    isUseQuery: isUseQuery
   }) : /*#__PURE__*/_react.default.createElement(_OrdersCards.OrdersCards, {
     isMessagesView: isMessagesView,
     orderList: orderList,
@@ -143,7 +145,8 @@ var OrdersListing = function OrdersListing(props) {
     handleOrderCardClick: handleOrderCardClick,
     handleUpdateDriverLocation: handleUpdateDriverLocation,
     slaSettingTime: slaSettingTime,
-    isDelivery: isDelivery
+    isDelivery: isDelivery,
+    isUseQuery: isUseQuery
   }))));
 };
 exports.OrdersListing = OrdersListing;

package/_modules/components/Orders/OrdersManager/index.js

@@ -58,7 +58,8 @@ var OrdersManagerUI = function OrdersManagerUI(props) {
     allowColumns = props.allowColumns,
     setAllowColumns = props.setAllowColumns,
     timeStatus = props.timeStatus,
-    setTimeStatus = props.setTimeStatus;
+    setTimeStatus = props.setTimeStatus,
+    isUseQuery = props.isUseQuery;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -225,6 +226,7 @@ var OrdersManagerUI = function OrdersManagerUI(props) {
     setTimeStatus: setTimeStatus,
     setSlaSettingTime: setSlaSettingTime
   }), /*#__PURE__*/_react.default.createElement(_OrderStatusFilterBar.OrderStatusFilterBar, {
+    isUseQuery: isUseQuery,
     selectedOrderStatus: ordersStatusGroup,
     changeOrderStatus: handleOrdersStatusGroupFilter,
     ordersAmountByStatus: ordersAmountByStatus
@@ -243,10 +245,13 @@ var OrdersManagerUI = function OrdersManagerUI(props) {
       setOrderDetailId(id);
       setIsOpenOrderDetail(true);
     },
-    handleOpenOrderDetail: handleOpenOrderDetail
+    handleOpenOrderDetail: handleOpenOrderDetail,
+    ordersStatusGroup: ordersStatusGroup,
+    selectedSubOrderStatus: selectedSubOrderStatus
   })), /*#__PURE__*/_react.default.createElement(_styles.OrdersContent, null, /*#__PURE__*/_react.default.createElement(_styles.OrdersInnerContent, {
     className: "order-content"
   }, /*#__PURE__*/_react.default.createElement(_styles.WrapItemView, null, /*#__PURE__*/_react.default.createElement(_OrdersDashboard.OrdersDashboard, {
+    isUseQuery: isUseQuery,
     isSelectedOrders: isSelectedOrders,
     driverId: props.driverId,
     customerId: props.customerId,

package/_modules/components/Orders/OrdersManager/styles.js

@@ -10,12 +10,12 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 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 OrdersListContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  padding: 20px;\n  box-sizing: border-box;\n  transition: all 0.5s;\n  overflow: hidden;\n  ", "\n  @media print {\n    display: none;\n  }\n"])), function (_ref) {
+var OrdersListContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  padding: 20px;\n  box-sizing: border-box;\n  transition: all 0.5s;\n  overflow: auto;\n  max-height: 100vh;\n  ", "\n  @media print {\n    display: none;\n  }\n"])), function (_ref) {
   var isSelectedOrders = _ref.isSelectedOrders;
   return isSelectedOrders && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    margin-top: 0px;\n    padding: 20px 0 0 0;\n  "])));
 });
 exports.OrdersListContainer = OrdersListContainer;
-var OrdersContent = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\n"])));
+var OrdersContent = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  margin-top: 10px;\n"])));
 exports.OrdersContent = OrdersContent;
 var OrdersInnerContent = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n"])));
 exports.OrdersInnerContent = OrdersInnerContent;
@@ -23,7 +23,7 @@ var WrapperIndicator = _styledComponents.default.div(_templateObject5 || (_templ
 exports.WrapperIndicator = WrapperIndicator;
 var WrapItemView = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: 100%;\n"])));
 exports.WrapItemView = WrapItemView;
-var OrderSubFilterControls = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  flex-direction: row;\n  justify-content: space-between;\n"])));
+var OrderSubFilterControls = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  flex-wrap: wrap;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n  flex-direction: row;\n  justify-content: space-between;\n"])));
 exports.OrderSubFilterControls = OrderSubFilterControls;
 var OrderStatusSubFilterWrapper = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  width: 50%;\n  display: inline-block;\n  flex: 1;\n  margin-right: 20px;\n"])));
 exports.OrderStatusSubFilterWrapper = OrderStatusSubFilterWrapper;

package/_modules/components/Orders/OrdersTable/index.js

@@ -55,7 +55,8 @@ var OrdersTable = function OrdersTable(props) {
     allowColumns = props.allowColumns,
     setAllowColumns = props.setAllowColumns,
     handleDrop = props.handleDrop,
-    saveUserSettings = props.saveUserSettings;
+    saveUserSettings = props.saveUserSettings,
+    isUseQuery = props.isUseQuery;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -362,6 +363,13 @@ var OrdersTable = function OrdersTable(props) {
       return document.removeEventListener('keydown', handleChangeKeyboard);
     };
   }, [isTourOpen, currentTourStep]);
+  (0, _react.useEffect)(function () {
+    if (!isUseQuery || !(pagination !== null && pagination !== void 0 && pagination.currentPage) || !(pagination !== null && pagination !== void 0 && pagination.pageSize) || !(pagination !== null && pagination !== void 0 && pagination.total)) return;
+    (0, _utils.addQueryToUrl)({
+      page: pagination.currentPage,
+      pageSize: pagination.pageSize
+    });
+  }, [pagination === null || pagination === void 0 ? void 0 : pagination.currentPage, pagination === null || pagination === void 0 ? void 0 : pagination.pageSize, pagination === null || pagination === void 0 ? void 0 : pagination.total]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.OrdersContainer, {
     id: "orderTable",
     isSelectedOrders: isSelectedOrders,

package/_modules/components/Orders/OrdersTable/styles.js

@@ -10,7 +10,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 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 OrdersContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  overflow: auto;\n\n  ", "\n\n  @media (min-width: 768px) {\n    max-height: calc(var(--vh, 1vh) * 100 - 385px);\n  }\n\n  @media (min-width: 992px) {\n    max-height: calc(var(--vh, 1vh) * 100 - 305px);\n    ", "\n  }\n\n  @media (min-width: 1200px) {\n    max-height: calc(var(--vh, 1vh) * 100 - 275px);\n    ", "\n  }\n"])), function (_ref) {
+var OrdersContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  overflow: auto;\n\n  ", "\n\n  @media (min-width: 992px) {\n    ", "\n  }\n\n  @media (min-width: 1200px) {\n    ", "\n  }\n"])), function (_ref) {
   var noScroll = _ref.noScroll;
   return noScroll && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    overflow: hidden;\n  "])));
 }, function (_ref2) {

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

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Cms = void 0;
 var _react = _interopRequireWildcard(require("react"));
+var _reactRouterDom = require("react-router-dom");
 var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
 var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
 var _styles = require("../../../styles");
@@ -16,6 +17,7 @@ var _styledComponents = require("styled-components");
 var _InfoShareContext = require("../../../contexts/InfoShareContext");
 var _reactBootstrapIcons = require("react-bootstrap-icons");
 var _PageForm = require("../PageForm");
+var _utils = require("../../../utils");
 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); }
@@ -60,13 +62,15 @@ var CmsUI = function CmsUI(props) {
     _useState6 = _slicedToArray(_useState5, 2),
     curPageId = _useState6[0],
     setCurPageId = _useState6[1];
-
+  var query = new URLSearchParams((0, _reactRouterDom.useLocation)().search);
+  var defaultPage = query.get('page') || 1;
+  var defaultPageSize = query.get('pageSize') || 10;
   // Change page
-  var _useState7 = (0, _react.useState)(1),
+  var _useState7 = (0, _react.useState)(Number(defaultPage) || 1),
     _useState8 = _slicedToArray(_useState7, 2),
     currentPage = _useState8[0],
     setCurrentPage = _useState8[1];
-  var _useState9 = (0, _react.useState)(10),
+  var _useState9 = (0, _react.useState)(Number(defaultPageSize) || 10),
     _useState10 = _slicedToArray(_useState9, 2),
     pagesPerPage = _useState10[0],
     setPagesPerPage = _useState10[1];
@@ -115,6 +119,13 @@ var CmsUI = function CmsUI(props) {
     setCurPageId(pageId);
     setOpenModal(true);
   };
+  (0, _react.useEffect)(function () {
+    if (!currentPage || !pagesPerPage || !totalPages) return;
+    (0, _utils.addQueryToUrl)({
+      page: currentPage,
+      pageSize: pagesPerPage
+    });
+  }, [currentPage, pagesPerPage, totalPages]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.StaticPageListContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.Header, null, /*#__PURE__*/_react.default.createElement(_styles2.HeaderLeft, null, isCollapse && /*#__PURE__*/_react.default.createElement(_styles.IconButton, {
     color: "black",
     onClick: function onClick() {

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

@@ -14,6 +14,7 @@ var _styles2 = require("./styles");
 var _Shared = require("../../Shared");
 var _LanguageTransTable = require("../LanguageTransTable");
 var _LanguageTransSpread = require("../LanguageTransSpread");
+var _utils = require("../../../utils");
 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; }
@@ -62,7 +63,8 @@ var LanguageManagerUI = function LanguageManagerUI(props) {
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.ViewList, null)), /*#__PURE__*/_react.default.createElement(_styles2.ViewIconWrapper, {
     active: viewMode === 'spread',
     onClick: function onClick() {
-      return setViewMode('spread');
+      setViewMode('spread');
+      (0, _utils.removeQueryToUrl)(['page', 'pageSize']);
     }
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Table, null)))), viewMode === 'table' && /*#__PURE__*/_react.default.createElement(_LanguageTransTable.LanguageTransTable, props), viewMode === 'spread' && /*#__PURE__*/_react.default.createElement(_LanguageTransSpread.LanguageTransSpread, props)));
 };

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

@@ -6,10 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.LanguageTransTable = void 0;
 var _react = _interopRequireWildcard(require("react"));
+var _reactRouterDom = require("react-router-dom");
 var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
 var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
 var _Shared = require("../../Shared");
 var _styles = require("../../../styles");
+var _utils = require("../../../utils");
 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); }
@@ -53,13 +55,15 @@ var LanguageTransTableUI = function LanguageTransTableUI(props) {
     isShowCreation = _useState4[0],
     setIsShowCreation = _useState4[1];
   var translationCreateRef = (0, _react.useRef)(null);
-
+  var query = new URLSearchParams((0, _reactRouterDom.useLocation)().search);
+  var defaultPage = query.get('page') || 1;
+  var defaultPageSize = query.get('pageSize') || 10;
   // Change page
-  var _useState5 = (0, _react.useState)(1),
+  var _useState5 = (0, _react.useState)(Number(defaultPage) || 1),
     _useState6 = _slicedToArray(_useState5, 2),
     currentPage = _useState6[0],
     setCurrentPage = _useState6[1];
-  var _useState7 = (0, _react.useState)(10),
+  var _useState7 = (0, _react.useState)(Number(defaultPageSize) || 10),
     _useState8 = _slicedToArray(_useState7, 2),
     translationPerPage = _useState8[0],
     setTranslationPerPage = _useState8[1];
@@ -144,6 +148,13 @@ var LanguageTransTableUI = function LanguageTransTableUI(props) {
   (0, _react.useEffect)(function () {
     if (searchValue) setCurrentPage(1);
   }, [searchValue]);
+  (0, _react.useEffect)(function () {
+    if (!currentPage || !translationPerPage || !totalPages) return;
+    (0, _utils.addQueryToUrl)({
+      page: currentPage,
+      pageSize: translationPerPage
+    });
+  }, [currentPage, translationPerPage, totalPages]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.TranslationTableContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.TranslationTable, null, /*#__PURE__*/_react.default.createElement(_styles2.TableHeader, null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", null, t('KEY', 'Key')), /*#__PURE__*/_react.default.createElement("th", null, t('TEXT', 'Text')))), translationList !== null && translationList !== void 0 && translationList.loading ? _toConsumableArray(Array(5).keys()).map(function (i) {
     return /*#__PURE__*/_react.default.createElement(_styles2.TableBody, {
       key: i

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

@@ -43,7 +43,6 @@ var SettingsListUI = function SettingsListUI(props) {
     handleInputChange = props.handleInputChange,
     handleClickUpdate = props.handleClickUpdate,
     saveConfig = props.saveConfig;
-  var settingsNotAllowed = [''];
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -156,7 +155,7 @@ var SettingsListUI = function SettingsListUI(props) {
     height: 44
   })), !settingsState.error && !settingsState.loading && configs && !settingsState.API && /*#__PURE__*/_react.default.createElement(_styles2.GeneralContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.FormContainer, null, configs.length > 0 && configs.map(function (config, i) {
     var _config$options, _config$options2, _config$options3, _config$options4;
-    return !settingsNotAllowed.includes(config.key) && /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", {
       key: i
     }, config.type === 1 && /*#__PURE__*/_react.default.createElement(_styles2.FormGroupText, {
       className: "form-group"

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

@@ -39,6 +39,9 @@ var WebhookDelaySelector = function WebhookDelaySelector(props) {
   }, {
     value: 'pickup_time',
     content: /*#__PURE__*/_react.default.createElement(_styles.Option, null, t('PICKUP_TIME', 'Pickup time'))
+  }, {
+    value: 'preparation_time',
+    content: /*#__PURE__*/_react.default.createElement(_styles.Option, null, t('PREPARATION_TIME', 'Preparation time'))
   }];
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Select.Select, {
     options: delayOptions,

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

@@ -48,7 +48,7 @@ var DropdownButtonWrapper = _styledComponents.default.div(_templateObject12 || (
   return props.theme.colors.headingColor;
 });
 exports.DropdownButtonWrapper = DropdownButtonWrapper;
-var SelectorWrapper = _styledComponents.default.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  width: 100%;\n\n  .select {\n    border: none;\n  }\n"])));
+var SelectorWrapper = _styledComponents.default.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  width: 100%;\n\n  .select {\n    border: none;\n    > div {\n      padding: 0;\n    }\n  }\n"])));
 exports.SelectorWrapper = SelectorWrapper;
 var PagesBottomContainer = _styledComponents.default.div(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  flex-wrap: wrap;\n  row-gap: 10px;\n  margin: 15px 0;\n\n  > button {\n    height: 44px;\n  }\n"])));
 exports.PagesBottomContainer = PagesBottomContainer;

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

@@ -66,6 +66,9 @@ var WebhookListSelector = function WebhookListSelector(props) {
   }, {
     value: 'orders_delivery_failed_driver',
     content: /*#__PURE__*/_react.default.createElement(_styles.Option, null, t('ORDERS_DELIVERY_FAILED_DRIVER', 'Order delivery failed by driver'))
+  }, {
+    value: 'orders_unassigned_driver',
+    content: /*#__PURE__*/_react.default.createElement(_styles.Option, null, t('ORDERS_UNASSIGNED_DRIVER', 'Order unassigned driver'))
   }, {
     value: 'preorder_updated',
     content: /*#__PURE__*/_react.default.createElement(_styles.Option, null, t('PREORDER_UPDATED', 'Preorder updated'))

package/_modules/components/Shared/Pagination/index.js

@@ -82,7 +82,7 @@ var Pagination = function Pagination(props) {
     setActivePage(currentPage);
     var _visiblePages = getVisiblePages(currentPage, totalPages);
     setVisiblePages(filterPages(_visiblePages, totalPages));
-  }, [currentPage]);
+  }, [currentPage, totalPages]);
   return /*#__PURE__*/_react.default.createElement(_styles.PaginationContainer, null, /*#__PURE__*/_react.default.createElement(_styles.PaginationButtonContainer, null, /*#__PURE__*/_react.default.createElement(_styles.PageButton, {
     disabled: activePage === 1,
     onClick: function onClick() {