ordering-ui-admin-external 1.7.0 → 1.7.2

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

@@ -8,8 +8,7 @@ exports.AnalyticsBusinessFilter = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
 var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
-var _RiCheckboxBlankLine = _interopRequireDefault(require("@meronex/icons/ri/RiCheckboxBlankLine"));
-var _RiCheckboxFill = _interopRequireDefault(require("@meronex/icons/ri/RiCheckboxFill"));
+var _reactBootstrapIcons = require("react-bootstrap-icons");
 var _Shared = require("../../Shared");
 var _styles = require("../../../styles");
 var _styles2 = require("./styles");
@@ -70,16 +69,6 @@ var AnalyticsBusinessFilterUI = function AnalyticsBusinessFilterUI(props) {
     setCurrentPage(expectedPage);
     setPagesPerPage(pageSize);
   };
-  var isCheckEnableSate = function isCheckEnableSate(id) {
-    var found = businessIds === null || businessIds === void 0 ? void 0 : businessIds.find(function (businessId) {
-      return businessId === id;
-    });
-    var valid = false;
-    if (found) {
-      valid = true;
-    }
-    return valid;
-  };
   (0, _react.useEffect)(function () {
     if (businessList.loading) return;
     var _totalPages;
@@ -104,25 +93,25 @@ var AnalyticsBusinessFilterUI = function AnalyticsBusinessFilterUI(props) {
     return /*#__PURE__*/_react.default.createElement(_styles2.BusinessFilterOption, {
       key: i
     }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
-      width: 15,
-      height: 15
+      width: 18,
+      height: 18
     }), /*#__PURE__*/_react.default.createElement(_styles2.BusinessName, null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
       width: 120,
       height: 24
     })));
   }) : /*#__PURE__*/_react.default.createElement("div", null, currentPages.length > 0 && /*#__PURE__*/_react.default.createElement(_styles2.BusinessFilterOption, {
     onClick: handleChangeAllCheck
-  }, isAllCheck ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
+  }, isAllCheck ? /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.CheckSquareFill, {
     className: "fill"
-  }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles2.BusinessName, null, t('ALL', 'All'))), currentPages.map(function (business, i) {
+  }) : /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Square, null), /*#__PURE__*/_react.default.createElement(_styles2.BusinessName, null, t('ALL', 'All'))), currentPages.map(function (business, i) {
     return /*#__PURE__*/_react.default.createElement(_styles2.BusinessFilterOption, {
       key: i,
       onClick: function onClick() {
         return handleChangeBusinessId(business === null || business === void 0 ? void 0 : business.id);
       }
-    }, isCheckEnableSate(business.id) ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
+    }, businessIds !== null && businessIds !== void 0 && businessIds.includes(business.id) ? /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.CheckSquareFill, {
       className: "fill"
-    }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles2.BusinessName, null, business === null || business === void 0 ? void 0 : business.name));
+    }) : /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Square, null), /*#__PURE__*/_react.default.createElement(_styles2.BusinessName, null, business === null || business === void 0 ? void 0 : business.name));
   }), (businessList === null || businessList === void 0 ? void 0 : (_businessList$busines = businessList.businesses) === null || _businessList$busines === void 0 ? void 0 : _businessList$busines.length) > 0 && /*#__PURE__*/_react.default.createElement(_Shared.Pagination, {
     currentPage: currentPage,
     totalPages: totalPages,

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

@@ -12,7 +12,11 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 var AnalyticsBusinessFilterContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
 exports.AnalyticsBusinessFilterContainer = AnalyticsBusinessFilterContainer;
-var BusinessFilterOption = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  border-bottom: 1px solid #E9ECEF;\n  padding: 10px 0;\n  cursor: pointer;\n\n  svg {\n    font-size: 24px;\n    color: #B1BCCC;\n\n    &.fill {\n      color: ", ";\n    }\n  }\n"])), function (props) {
+var BusinessFilterOption = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  border-bottom: 1px solid ", ";\n  padding: 10px 0;\n  cursor: pointer;\n\n  svg {\n    font-size: 18px;\n    color: ", ";\n\n    &.fill {\n      color: ", ";\n    }\n  }\n"])), function (props) {
+  return props.theme.colors.borderColor;
+}, function (props) {
+  return props.theme.colors.secundaryLight;
+}, function (props) {
   return props.theme.colors.primary;
 });
 exports.BusinessFilterOption = BusinessFilterOption;

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

@@ -87,6 +87,7 @@ var AnalyticsCalendar = function AnalyticsCalendar(props) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.Button, {
     onClick: handleOpenCalendar
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Calendar4, null), dateRange[0].startDate ? dateFormat(dateRange[0].startDate, dateRange[0].endDate) : t('SELECT_DATE_RANGE', 'Select Date Range')), isShowCalendar && /*#__PURE__*/_react.default.createElement(_styles3.AnalyticsCalendarContainer, {
+    className: "ordering-calendar",
     ref: calendarRef,
     leftAlign: leftAlign
   }, /*#__PURE__*/_react.default.createElement(_reactDateRange.DateRange, {

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

@@ -28,7 +28,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var AnalyticsDriverOrders = function AnalyticsDriverOrders(props) {
   var _chartDataList$data17, _chartDataList$data18, _chartDataList$data19, _chartDataList$data20, _chartDataList$data21, _chartDataList$data22;
   var isOrders = props.isOrders,
-    chartDataList = props.chartDataList;
+    chartDataList = props.chartDataList,
+    countryCode = props.countryCode;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -125,7 +126,7 @@ var AnalyticsDriverOrders = function AnalyticsDriverOrders(props) {
   var TotalSales = function TotalSales() {
     var _chartDataList$data5, _chartDataList$data5$, _chartDataList$data5$2, _chartDataList$data6, _chartDataList$data6$, _chartDataList$data6$2, _chartDataList$data7, _chartDataList$data7$, _chartDataList$data7$2;
     var sales = 0;
-    if (!(chartDataList !== null && chartDataList !== void 0 && (_chartDataList$data5 = chartDataList.data) !== null && _chartDataList$data5 !== void 0 && (_chartDataList$data5$ = _chartDataList$data5.dataset) !== null && _chartDataList$data5$ !== void 0 && (_chartDataList$data5$2 = _chartDataList$data5$.dataset[0]) !== null && _chartDataList$data5$2 !== void 0 && _chartDataList$data5$2.data) || (chartDataList === null || chartDataList === void 0 ? void 0 : (_chartDataList$data6 = chartDataList.data) === null || _chartDataList$data6 === void 0 ? void 0 : (_chartDataList$data6$ = _chartDataList$data6.dataset) === null || _chartDataList$data6$ === void 0 ? void 0 : (_chartDataList$data6$2 = _chartDataList$data6$.dataset[0]) === null || _chartDataList$data6$2 === void 0 ? void 0 : _chartDataList$data6$2.data.length) === 0) return sales;
+    if (!(chartDataList !== null && chartDataList !== void 0 && (_chartDataList$data5 = chartDataList.data) !== null && _chartDataList$data5 !== void 0 && (_chartDataList$data5$ = _chartDataList$data5.dataset) !== null && _chartDataList$data5$ !== void 0 && (_chartDataList$data5$2 = _chartDataList$data5$.dataset[0]) !== null && _chartDataList$data5$2 !== void 0 && _chartDataList$data5$2.data) || (chartDataList === null || chartDataList === void 0 ? void 0 : (_chartDataList$data6 = chartDataList.data) === null || _chartDataList$data6 === void 0 ? void 0 : (_chartDataList$data6$ = _chartDataList$data6.dataset) === null || _chartDataList$data6$ === void 0 ? void 0 : (_chartDataList$data6$2 = _chartDataList$data6$.dataset[0]) === null || _chartDataList$data6$2 === void 0 ? void 0 : _chartDataList$data6$2.data.length) === 0) return getFormattedValue(sales, countryCode);
     var _iterator3 = _createForOfIteratorHelper(chartDataList === null || chartDataList === void 0 ? void 0 : (_chartDataList$data7 = chartDataList.data) === null || _chartDataList$data7 === void 0 ? void 0 : (_chartDataList$data7$ = _chartDataList$data7.dataset) === null || _chartDataList$data7$ === void 0 ? void 0 : (_chartDataList$data7$2 = _chartDataList$data7$.dataset[0]) === null || _chartDataList$data7$2 === void 0 ? void 0 : _chartDataList$data7$2.data),
       _step3;
     try {
@@ -138,9 +139,13 @@ var AnalyticsDriverOrders = function AnalyticsDriverOrders(props) {
     } finally {
       _iterator3.f();
     }
-    return parsePrice(sales.toFixed(2), {
+    return getFormattedValue(sales, countryCode);
+  };
+  var getFormattedValue = function getFormattedValue(value, flag) {
+    var formattedValue = flag ? parsePrice(value.toFixed(2), {
       separator: '.'
-    });
+    }) : value.toFixed(2);
+    return formattedValue;
   };
   var downloadCSV = function downloadCSV() {
     var _chartDataList$data8, _chartDataList$data8$, _chartDataList$data8$2;

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

@@ -30,8 +30,10 @@ var ActionBlock = _styledComponents.default.div(_templateObject4 || (_templateOb
   });
 });
 exports.ActionBlock = ActionBlock;
-var ChartFooterContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n\n  h2 {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    margin: 0;\n  }\n\n  p {\n    font-size: 14px;\n    color: #909BA9;\n    margin: 0;\n  }\n"])), function (props) {
+var ChartFooterContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n\n  h2 {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    margin: 0;\n  }\n\n  p {\n    font-size: 14px;\n    color: ", ";\n    margin: 0;\n  }\n"])), function (props) {
   return props.theme.colors.headingColor;
+}, function (props) {
+  return props.theme.colors.lightGray;
 });
 exports.ChartFooterContainer = ChartFooterContainer;
 var EmptyContent = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  padding: 10px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"])));

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

@@ -16,7 +16,9 @@ var FilterBtnWrapper = _styledComponents.default.div(_templateObject2 || (_templ
 exports.FilterBtnWrapper = FilterBtnWrapper;
 var TreeViewItemContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral([""])));
 exports.TreeViewItemContainer = TreeViewItemContainer;
-var TreeViewParentItem = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-top: 16px;\n\n  svg {\n    font-size: 24px;\n    color: #B1BCCC;\n    &.fill {\n      color: ", ";\n    }\n  }\n"])), function (props) {
+var TreeViewParentItem = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-top: 16px;\n\n  svg {\n    font-size: 24px;\n    color: ", ";\n    &.fill {\n      color: ", ";\n    }\n  }\n"])), function (props) {
+  return props.theme.colors.secundaryLight;
+}, function (props) {
   var _props$theme;
   return (_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.colors.primary;
 });
@@ -28,9 +30,11 @@ var TreeViewParentLabel = _styledComponents.default.span(_templateObject5 || (_t
   return ((_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.rtl) && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    margin-right: 10px;\n    margin-left: 0;\n  "])));
 });
 exports.TreeViewParentLabel = TreeViewParentLabel;
-var TreeViewChildrenItem = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-top: 16px;\n  margin-left: 40px;\n  ", "\n\n  svg {\n    font-size: 24px;\n    color: #B1BCCC;\n    &.fill {\n      color: ", ";\n    }\n  }\n"])), function (props) {
+var TreeViewChildrenItem = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin-top: 16px;\n  margin-left: 40px;\n  ", "\n\n  svg {\n    font-size: 24px;\n    color: ", ";\n    &.fill {\n      color: ", ";\n    }\n  }\n"])), function (props) {
   var _props$theme3;
   return ((_props$theme3 = props.theme) === null || _props$theme3 === void 0 ? void 0 : _props$theme3.rtl) && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    margin-right: 40px;\n    margin-left: 0;\n  "])));
+}, function (props) {
+  return props.theme.colors.secundaryLight;
 }, function (props) {
   var _props$theme4;
   return (_props$theme4 = props.theme) === null || _props$theme4 === void 0 ? void 0 : _props$theme4.colors.primary;

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

@@ -10,18 +10,24 @@ 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 AnalyticsTimeZoneContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n\n  > button {\n    background: #F8F9FA;\n    border-radius: 7.6px;\n    padding: 7px 12px;\n    font-size: 14px;\n    color: #748194;\n    border: none;\n  }\n"])));
+var AnalyticsTimeZoneContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n\n  > button {\n    background: #F8F9FA;\n    border-radius: 7.6px;\n    padding: 7px 12px;\n    font-size: 14px;\n    color: ", ";\n    border: none;\n    width: 100%;\n  }\n"])), function (props) {
+  return props.theme.colors.secundaryContrast;
+});
 exports.AnalyticsTimeZoneContainer = AnalyticsTimeZoneContainer;
-var TimeZoneSelectWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: absolute;\n  width: 300px;\n  top: 100%;\n  right: -60px;\n  padding: 25px;\n  background: ", ";\n  border: 1px solid #E9ECEF;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n  border-radius: 7.6px;\n  z-index: 100;\n  margin-top: 18px;\n\n  @media (min-width: 576px) {\n    right: 0;\n  }\n"])), function (props) {
+var TimeZoneSelectWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: absolute;\n  width: 300px;\n  top: 100%;\n  right: 0;\n  padding: 25px;\n  background: ", ";\n  border: 1px solid ", ";\n  box-sizing: border-box;\n  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n  border-radius: 7.6px;\n  z-index: 100;\n  margin-top: 18px;\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) {
+  return props.theme.colors.borderColor;
 });
 exports.TimeZoneSelectWrapper = TimeZoneSelectWrapper;
 var TimeZoneSearchWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: relative;\n"])));
 exports.TimeZoneSearchWrapper = TimeZoneSearchWrapper;
-var SearchIconWrapper = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  display: flex;\n  align-items: center;\n  height: 100%;\n\n  ", "\n\n  svg {\n    font-size: 16px;\n    color: #B1BCCC;\n  }\n"])), function (props) {
+var SearchIconWrapper = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  display: flex;\n  align-items: center;\n  height: 100%;\n\n  ", "\n\n  svg {\n    font-size: 16px;\n    color: ", ";\n  }\n"])), function (props) {
   var _props$theme;
   return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.rtl ? (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    left: 10px;\n  "]))) : (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    right: 10px;\n  "])));
+}, function (props) {
+  return props.theme.colors.secundaryLight;
 });
 exports.SearchIconWrapper = SearchIconWrapper;
 var TimeZoneSearchInput = _styledComponents.default.input(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  border: 1px solid #DEE2E6;\n  box-sizing: border-box;\n  border-radius: 7.6px;\n  font-size: 13px;\n  padding: 8px 30px 8px 14px;\n  width: 100%;\n  outline: none;\n\n  ", "\n"])), function (props) {

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

@@ -15,7 +15,9 @@ var OrdersAcceptSpendHeader = _styledComponents.default.div(_templateObject2 ||
   return (_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.colors.headingColor;
 });
 exports.OrdersAcceptSpendHeader = OrdersAcceptSpendHeader;
-var ReviewContentWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n\n  p {\n    margin: 0;\n    font-size: 14px;\n    color: #909BA9;\n    text-align: center;\n  }\n"])));
+var ReviewContentWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n\n  p {\n    margin: 0;\n    font-size: 14px;\n    color: ", ";\n    text-align: center;\n  }\n"])), function (props) {
+  return props.theme.colors.lightGray;
+});
 exports.ReviewContentWrapper = ReviewContentWrapper;
 var TimeContentWrapper = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  \n  h1{\n    font-weight: 500;\n    font-size: 52px;\n    margin: 0;\n    color: ", "\n  }\n  p {\n    margin: 0;\n    font-size: 14px;\n    color: ", ";\n  }\n"])), function (props) {
   var _props$theme2;

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

@@ -28,7 +28,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var AnalyticsOrdersOrSales = function AnalyticsOrdersOrSales(props) {
   var isOrders = props.isOrders,
     chartDataList = props.chartDataList,
-    filterList = props.filterList;
+    filterList = props.filterList,
+    countryCode = props.countryCode;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -220,9 +221,10 @@ var AnalyticsOrdersOrSales = function AnalyticsOrdersOrSales(props) {
     } finally {
       _iterator2.f();
     }
-    return parsePrice(sales.toFixed(2), {
+    var totalSales = countryCode ? parsePrice(sales.toFixed(2), {
       separator: '.'
-    });
+    }) : sales.toFixed(2);
+    return totalSales;
   };
   var downloadCSV = function downloadCSV() {
     var csv = "".concat(t('TIME', 'Time'), ", ").concat(isOrders ? t('ORDERS', 'Orders') : t('SALES', 'Sales'), "\n");

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

@@ -30,8 +30,10 @@ var ActionBlock = _styledComponents.default.div(_templateObject4 || (_templateOb
   });
 });
 exports.ActionBlock = ActionBlock;
-var ChartFooterContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n\n  h2 {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    margin: 0;\n  }\n\n  p {\n    font-size: 14px;\n    color: #909BA9;\n    margin: 0;\n  }\n"])), function (props) {
+var ChartFooterContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n\n  h2 {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    margin: 0;\n  }\n\n  p {\n    font-size: 14px;\n    color: ", ";\n    margin: 0;\n  }\n"])), function (props) {
   return props.theme.colors.headingColor;
+}, function (props) {
+  return props.theme.colors.lightGray;
 });
 exports.ChartFooterContainer = ChartFooterContainer;
 var EmptyContent = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  padding: 10px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n"])));

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

@@ -27,8 +27,10 @@ var ActionBlock = _styledComponents.default.div(_templateObject3 || (_templateOb
 exports.ActionBlock = ActionBlock;
 var BarChartWrapper = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  min-height: 350px;\n"])));
 exports.BarChartWrapper = BarChartWrapper;
-var OrderStatusFooter = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n\n  h2 {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    margin: 0;\n  }\n\n  p {\n    font-size: 14px;\n    color: #909BA9;\n    margin: 0;\n  }\n"])), function (props) {
+var OrderStatusFooter = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin-top: 25px;\n\n  h2 {\n    font-weight: 500;\n    font-size: 20px;\n    color: ", ";\n    margin: 0;\n  }\n\n  p {\n    font-size: 14px;\n    color: ", ";\n    margin: 0;\n  }\n"])), function (props) {
   return props.theme.colors.headingColor;
+}, function (props) {
+  return props.theme.colors.lightGray;
 });
 exports.OrderStatusFooter = OrderStatusFooter;
 var EmptyContent = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  padding: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])));

package/_modules/components/BusinessIntelligence/BusinessAnalytics/index.js

@@ -25,6 +25,7 @@ var _AnalyticsOrdersAcceptSpend = require("../AnalyticsOrdersAcceptSpend");
 var _AnalyticsSpendList = require("../AnalyticsSpendList");
 var _styles2 = require("./styles");
 var _ReportsBrandFilter = require("../ReportsBrandFilter");
+var _CountryFilter = require("../CountryFilter");
 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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -49,7 +50,8 @@ var BusinessAnalyticsUI = function BusinessAnalyticsUI(props) {
     customerSatisfactionList = props.customerSatisfactionList,
     ordersAcceptSpendList = props.ordersAcceptSpendList,
     arrivedPickUpSpendList = props.arrivedPickUpSpendList,
-    orderLocationList = props.orderLocationList;
+    orderLocationList = props.orderLocationList,
+    countryCode = props.countryCode;
   var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
@@ -65,6 +67,10 @@ var BusinessAnalyticsUI = function BusinessAnalyticsUI(props) {
     _useState4 = _slicedToArray(_useState3, 2),
     isBrandFilter = _useState4[0],
     setIsBrandFilter = _useState4[1];
+  var _useState5 = (0, _react.useState)(true),
+    _useState6 = _slicedToArray(_useState5, 2),
+    openCountryFilter = _useState6[0],
+    setOpenCountryFilter = _useState6[1];
   var handleChangeDate = function handleChangeDate(date1, date2) {
     handleChangeFilterList(_objectSpread(_objectSpread({}, filterList), {}, {
       lapse: "".concat(date1, ",").concat(date2)
@@ -76,6 +82,10 @@ var BusinessAnalyticsUI = function BusinessAnalyticsUI(props) {
       return handleMenuCollapse(false);
     }
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.List, null)), /*#__PURE__*/_react.default.createElement("h1", null, t('BUSINESS_ANALYTICS', 'Business Analytics'))), /*#__PURE__*/_react.default.createElement(_styles2.HeaderFilterContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.BusinessFilterWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Button, {
+    onClick: function onClick() {
+      return setOpenCountryFilter(true);
+    }
+  }, t('COUNTRY', 'Country'))), /*#__PURE__*/_react.default.createElement(_styles2.BusinessFilterWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Button, {
     onClick: function onClick() {
       return setIsBrandFilter(true);
     }
@@ -94,12 +104,14 @@ var BusinessAnalyticsUI = function BusinessAnalyticsUI(props) {
   }, /*#__PURE__*/_react.default.createElement(_AnalyticsOrdersOrSales.AnalyticsOrdersOrSales, {
     isOrders: true,
     filterList: filterList,
-    chartDataList: ordersList
+    chartDataList: ordersList,
+    countryCode: countryCode
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: "col-md-12 col-lg-6"
   }, /*#__PURE__*/_react.default.createElement(_AnalyticsOrdersOrSales.AnalyticsOrdersOrSales, {
     filterList: filterList,
-    chartDataList: salesList
+    chartDataList: salesList,
+    countryCode: countryCode
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: "col-md-12 col-lg-6"
   }, /*#__PURE__*/_react.default.createElement(_AnalyticsProductCategories.AnalyticsProductCategories, {
@@ -161,6 +173,18 @@ var BusinessAnalyticsUI = function BusinessAnalyticsUI(props) {
     onClose: function onClose() {
       return setIsBrandFilter(false);
     }
+  }))), /*#__PURE__*/_react.default.createElement(_Shared.Modal, {
+    width: "450px",
+    height: "650px",
+    padding: "25px",
+    open: openCountryFilter,
+    onClose: function onClose() {
+      return setOpenCountryFilter(false);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_CountryFilter.CountryFilter, _extends({}, props, {
+    onClose: function onClose() {
+      return setOpenCountryFilter(false);
+    }
   }))));
 };
 var BusinessAnalytics = function BusinessAnalytics(props) {

package/_modules/components/BusinessIntelligence/BusinessAnalytics/styles.js

@@ -12,7 +12,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 var BusinessAnalyticsContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex: 1;\n  transition: all 0.5s;\n  padding: 20px;\n  box-sizing: border-box;\n  max-height: 100vh;\n  overflow: auto;\n"])));
 exports.BusinessAnalyticsContainer = BusinessAnalyticsContainer;
-var BusinessAnalyticsHeader = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n\n  @media (min-width: 769px) {\n    flex-direction: row;\n    align-items: center;\n    justify-content: space-between;\n  }\n"])));
+var BusinessAnalyticsHeader = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n\n  @media (min-width: 1024px) {\n    flex-direction: row;\n    align-items: center;\n    justify-content: space-between;\n  }\n"])));
 exports.BusinessAnalyticsHeader = BusinessAnalyticsHeader;
 var HeaderTitleContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  flex: 1;\n  display: flex;\n  align-items: center;\n\n  h1 {\n    font-weight: 700;\n    font-size: 20px;\n    color: ", ";\n    margin: 0px;\n  }\n\n  > button {\n    ", "\n\n    svg {\n      width: 25px;\n      height: 25px;\n    }\n  }\n"])), function (props) {
   return props.theme.colors.headingColor;
@@ -21,10 +21,12 @@ var HeaderTitleContainer = _styledComponents.default.div(_templateObject3 || (_t
   return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.rtl ? (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      margin-left: 8px;\n      margin-right: -8px;\n    "]))) : (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      margin-right: 8px;\n      margin-left: -8px;\n    "])));
 });
 exports.HeaderTitleContainer = HeaderTitleContainer;
-var HeaderFilterContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
+var HeaderFilterContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n  > div {\n    width: 100%;\n    margin-top: 10px;\n    > button {\n      width: 100%;\n    }\n  }\n\n  @media (min-width: 600px) {\n    flex-direction: row;\n    > div {\n      margin-top: 0px;\n      width: auto;\n    }\n  }\n"])));
 exports.HeaderFilterContainer = HeaderFilterContainer;
-var BusinessFilterWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  margin-left: 25px;\n  ", "\n  > button {\n    background: #F8F9FA;\n    border-radius: 7.6px;\n    padding: 7px 12px;\n    font-size: 14px;\n    color: #748194;\n    border: none;\n  }\n"])), function (props) {
-  return props.theme.rtl && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    margin-right: 25px;\n    margin-left: 0;\n  "])));
+var BusinessFilterWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  > button {\n    background: #F8F9FA;\n    border-radius: 7.6px;\n    padding: 7px 12px;\n    font-size: 14px;\n    color: ", ";\n    border: none;\n  }\n\n  @media (min-width: 600px) {\n    margin-left: 25px;\n    ", "\n  }\n"])), function (props) {
+  return props.theme.colors.secundaryContrast;
+}, function (props) {
+  return props.theme.rtl && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      margin-right: 25px;\n      margin-left: 0;\n    "])));
 });
 exports.BusinessFilterWrapper = BusinessFilterWrapper;
 var BusinessCalendarWrapper = (0, _styledComponents.default)(BusinessFilterWrapper)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  position: relative;\n  margin-left: 25px;\n  ", "\n\n  > button {\n    svg {\n      font-size: 16px;\n      margin-right: 12px;\n      ", "\n    }\n  }\n"])), function (props) {

package/_modules/components/BusinessIntelligence/CountryFilter/index.js

@@ -0,0 +1,134 @@
+"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.CountryFilter = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
+var _styles = require("../../../styles");
+var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
+var _Shared = require("../../Shared");
+var _reactBootstrapIcons = require("react-bootstrap-icons");
+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 _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+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 CountryFilterUI = function CountryFilterUI(props) {
+  var _countriesState$count;
+  var countriesState = props.countriesState,
+    searchValue = props.searchValue,
+    _onSearch = props.onSearch,
+    handleClickFilterButton = props.handleClickFilterButton,
+    countryCode = props.countryCode,
+    handleChangeCode = props.handleChangeCode;
+  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
+    _useLanguage2 = _slicedToArray(_useLanguage, 2),
+    t = _useLanguage2[1];
+
+  // Change page
+  var _useState = (0, _react.useState)(1),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentPage = _useState2[0],
+    setCurrentPage = _useState2[1];
+  var _useState3 = (0, _react.useState)(10),
+    _useState4 = _slicedToArray(_useState3, 2),
+    pagesPerPage = _useState4[0],
+    setPagesPerPage = _useState4[1];
+
+  // Get current products
+  var _useState5 = (0, _react.useState)([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    currentPages = _useState6[0],
+    setCurrentPages = _useState6[1];
+  var _useState7 = (0, _react.useState)(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    totalPages = _useState8[0],
+    setTotalPages = _useState8[1];
+  var handleChangePage = function handleChangePage(page) {
+    setCurrentPage(page);
+  };
+  var handleChangePageSize = function handleChangePageSize(pageSize) {
+    var expectedPage = Math.ceil(((currentPage - 1) * pagesPerPage + 1) / pageSize);
+    setCurrentPage(expectedPage);
+    setPagesPerPage(pageSize);
+  };
+  (0, _react.useEffect)(function () {
+    if (countriesState.loading) return;
+    var _totalPages;
+    if (countriesState.countries.length > 0) {
+      _totalPages = Math.ceil(countriesState.countries.length / pagesPerPage);
+    }
+    var indexOfLastPost = currentPage * pagesPerPage;
+    var indexOfFirstPost = indexOfLastPost - pagesPerPage;
+    var _currentBusinessList = countriesState.countries.slice(indexOfFirstPost, indexOfLastPost);
+    setTotalPages(_totalPages);
+    setCurrentPages(_currentBusinessList);
+  }, [countriesState, currentPage, pagesPerPage]);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.Container, null, /*#__PURE__*/_react.default.createElement("h2", null, t('CHOOSE_A_COUNTRY', 'Choose a country')), /*#__PURE__*/_react.default.createElement(_styles2.SearchWrapper, null, /*#__PURE__*/_react.default.createElement(_Shared.SearchBar, {
+    search: searchValue,
+    isCustomLayout: true,
+    lazyLoad: true,
+    onSearch: function onSearch(value) {
+      return _onSearch(value);
+    },
+    placeholder: t('SEARCH', 'Search')
+  })), /*#__PURE__*/_react.default.createElement(_styles2.CountryListWrapper, null, countriesState !== null && countriesState !== void 0 && countriesState.loading ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, _toConsumableArray(Array(10).keys()).map(function (i) {
+    return /*#__PURE__*/_react.default.createElement(_styles2.CountryItem, {
+      key: i
+    }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 18,
+      height: 18,
+      circle: true
+    }), /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 200,
+      height: 20,
+      style: {
+        marginLeft: 10
+      }
+    }));
+  })) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, currentPages === null || currentPages === void 0 ? void 0 : currentPages.map(function (country) {
+    return /*#__PURE__*/_react.default.createElement(_styles2.CountryItem, {
+      key: country === null || country === void 0 ? void 0 : country.id,
+      onClick: function onClick() {
+        return handleChangeCode(country === null || country === void 0 ? void 0 : country.code);
+      }
+    }, countryCode === (country === null || country === void 0 ? void 0 : country.code) ? /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.RecordCircleFill, {
+      className: "checked"
+    }) : /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Circle, null), /*#__PURE__*/_react.default.createElement("span", {
+      className: "name"
+    }, country === null || country === void 0 ? void 0 : country.name));
+  }))), /*#__PURE__*/_react.default.createElement(_styles2.PaginationWrapper, null, (countriesState === null || countriesState === void 0 ? void 0 : (_countriesState$count = countriesState.countries) === null || _countriesState$count === void 0 ? void 0 : _countriesState$count.length) > 0 && /*#__PURE__*/_react.default.createElement(_Shared.Pagination, {
+    currentPage: currentPage,
+    totalPages: totalPages,
+    handleChangePage: handleChangePage,
+    defaultPageSize: pagesPerPage,
+    handleChangePageSize: handleChangePageSize
+  }))), /*#__PURE__*/_react.default.createElement(_styles2.ButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Button, {
+    color: "primary",
+    disabled: countriesState.loading,
+    onClick: handleClickFilterButton
+  }, t('FILTER', 'Filter'))));
+};
+var CountryFilter = function CountryFilter(props) {
+  var countryFilterProps = _objectSpread(_objectSpread({}, props), {}, {
+    UIComponent: CountryFilterUI,
+    isSearchByName: true
+  });
+  return /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.CountryList, countryFilterProps);
+};
+exports.CountryFilter = CountryFilter;

package/_modules/components/BusinessIntelligence/CountryFilter/styles.js

@@ -0,0 +1,30 @@
+"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.SearchWrapper = exports.PaginationWrapper = exports.CountryListWrapper = exports.CountryItem = exports.Container = exports.ButtonWrapper = void 0;
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+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 Container = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  h2 {\n    font-weight: 700;\n    font-size: 20px;\n    line-height: 30px;\n    margin-top: 0px;\n    margin-bottom: 24px;\n  }\n"])));
+exports.Container = Container;
+var SearchWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  input {\n    width: 100%;\n  }\n"])));
+exports.SearchWrapper = SearchWrapper;
+var CountryListWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  padding-top: 17px;\n"])));
+exports.CountryListWrapper = CountryListWrapper;
+var CountryItem = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin: 10px 0px;\n  cursor: pointer;\n  width: fit-content;\n\n  span.name {\n    font-weight: 500;\n    font-size: 14px;\n    line-height: 18px;\n    margin-left: 10px;\n    user-select: none;\n    ", "\n  }\n\n  svg {\n    font-size: 16px;\n    color: ", ";\n    &.checked {\n      color: ", ";\n    }\n  }\n"])), function (props) {
+  return props.theme.rtl && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      margin-right: 10px;\n      margin-left: 0px;\n    "])));
+}, function (props) {
+  return props.theme.colors.secundaryLight;
+}, function (props) {
+  return props.theme.colors.primary;
+});
+exports.CountryItem = CountryItem;
+var ButtonWrapper = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n  position: sticky;\n  top: 100%;\n  button {\n    border-radius: 8px;\n    height: 44px;\n  }\n"])));
+exports.ButtonWrapper = ButtonWrapper;
+var PaginationWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: flex-end;\n"])));
+exports.PaginationWrapper = PaginationWrapper;