ordering-ui-admin-external 1.39.9 → 1.40.0

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

@@ -0,0 +1,174 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SettingsLogs = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _orderingComponentsAdminExternal = require("ordering-components-admin-external");
+var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
+var _Shared = require("../../Shared");
+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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+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 _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+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(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var SettingsLogsUI = function SettingsLogsUI(props) {
+  var _configs$general_hour, _logsList$logs;
+  var logsList = props.logsList,
+    paginationProps = props.paginationProps,
+    getSettingsLogs = props.getSettingsLogs;
+  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
+    _useLanguage2 = _slicedToArray(_useLanguage, 2),
+    t = _useLanguage2[1];
+  var _useUtils = (0, _orderingComponentsAdminExternal.useUtils)(),
+    _useUtils2 = _slicedToArray(_useUtils, 1),
+    parseDate = _useUtils2[0].parseDate;
+  var _React$useState = _react.default.useState(false),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    open = _React$useState2[0],
+    setOpen = _React$useState2[1];
+  var _React$useState3 = _react.default.useState({
+      newSchedule: [],
+      oldSchedule: []
+    }),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    schedules = _React$useState4[0],
+    setSchedules = _React$useState4[1];
+  var _useConfig = (0, _orderingComponentsAdminExternal.useConfig)(),
+    _useConfig2 = _slicedToArray(_useConfig, 1),
+    configs = _useConfig2[0].configs;
+  var formatTime = configs === null || configs === void 0 || (_configs$general_hour = configs.general_hour_format) === null || _configs$general_hour === void 0 ? void 0 : _configs$general_hour.value;
+  var handleChangePage = function handleChangePage(page) {
+    getSettingsLogs(page, 10);
+  };
+  var handleChangePageSize = function handleChangePageSize(pageSize) {
+    var expectedPage = Math.ceil(paginationProps.from / pageSize);
+    getDriversGroupLogs(expectedPage, pageSize);
+  };
+  var getValidLogData = function getValidLogData(data) {
+    return _typeof(data) === 'object' ? Object.values(data) : typeof data === 'string' ? JSON.parse(data) : data;
+  };
+  var handleSchedules = function handleSchedules(_schedules) {
+    setSchedules({
+      newSchedule: _schedules === null || _schedules === void 0 ? void 0 : _schedules.new,
+      oldSchedule: _schedules === null || _schedules === void 0 ? void 0 : _schedules.old
+    });
+  };
+  var scheduleModalData = function scheduleModalData(_schedules) {
+    setOpen(true);
+    handleSchedules(_schedules);
+  };
+  (0, _react.useEffect)(function () {
+    if (logsList.loading || logsList.logs.length > 0 || paginationProps.totalPages <= 1) return;
+    if (paginationProps.currentPage !== paginationProps.totalPages) {
+      handleChangePage(paginationProps.currentPage);
+    } else {
+      handleChangePage(paginationProps.currentPage - 1);
+    }
+  }, [logsList.logs, paginationProps]);
+  var daysOptions = [t('DAY7', 'Sunday'), t('DAY1', 'Monday'), t('DAY2', 'Tuesday'), t('DAY3', 'Wednesday'), t('DAY4', 'Thursday'), t('DAY5', 'Friday'), t('DAY6', 'Saturday')];
+  var checkTime = function checkTime(val) {
+    return val < 10 ? "0".concat(val) : val;
+  };
+  var timeFormated = function timeFormated(time) {
+    return moment("1900-01-01 ".concat(checkTime(time.hour), ":").concat(checkTime(time.minute))).format(formatTime);
+  };
+  var getSchedule = function getSchedule(_schedules) {
+    return !(_schedules !== null && _schedules !== void 0 && _schedules.length) && (_schedules === null || _schedules === void 0 ? void 0 : _schedules.length) < 1 ? /*#__PURE__*/_react.default.createElement("p", null, t('NONE', 'None')) : _schedules === null || _schedules === void 0 ? void 0 : _schedules.map(function (schedule, i) {
+      var _schedule$lapses;
+      return /*#__PURE__*/_react.default.createElement(_styles.ScheduleDay, {
+        key: i
+      }, /*#__PURE__*/_react.default.createElement("span", null, daysOptions[i]), /*#__PURE__*/_react.default.createElement(_styles.ScheduleLapses, null, schedule === null || schedule === void 0 || (_schedule$lapses = schedule.lapses) === null || _schedule$lapses === void 0 ? void 0 : _schedule$lapses.map(function (item, i) {
+        return /*#__PURE__*/_react.default.createElement("p", {
+          key: i
+        }, "".concat(timeFormated(item === null || item === void 0 ? void 0 : item.open), " - ").concat(timeFormated(item === null || item === void 0 ? void 0 : item.close)));
+      })));
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.DriversGroupLogsContainer, null, /*#__PURE__*/_react.default.createElement(_styles.HeaderContainer, null, /*#__PURE__*/_react.default.createElement(_styles.HeaderTitleContainer, null, /*#__PURE__*/_react.default.createElement("h1", null, t('SETTINGS_LOGS', 'Settings Logs')))), /*#__PURE__*/_react.default.createElement(_styles.TableWrapper, null, logsList.loading || logsList.logs.length > 0 ? /*#__PURE__*/_react.default.createElement(_styles.Table, null, /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", null, t('CONTROL_PANEL_USERS', 'Users')), /*#__PURE__*/_react.default.createElement("th", null, t('EVENTS_TYPE', 'Events type')), /*#__PURE__*/_react.default.createElement("th", null, t('CONFIG', 'Config')), /*#__PURE__*/_react.default.createElement("th", null, t('DETAILS', 'Details')), /*#__PURE__*/_react.default.createElement("th", null, t('NEW', 'New')), /*#__PURE__*/_react.default.createElement("th", null, t('OLD', 'Old')), /*#__PURE__*/_react.default.createElement("th", null, t('EXPORT_DATE', 'Date')), /*#__PURE__*/_react.default.createElement("th", null, t('USER_AGENT', 'User agent')))), logsList.loading ? _toConsumableArray(Array(10).keys()).map(function (i) {
+    return /*#__PURE__*/_react.default.createElement("tbody", {
+      key: i
+    }, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.UserInfoContainer, null, /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 100
+    })), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 120
+    })))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.DataListTable, null, /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 100
+    })), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 20
+    })), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
+      width: 20
+    })))))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.DateTimeWrapper, null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, null))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, null))));
+  }) : !logsList.error && ((_logsList$logs = logsList.logs) === null || _logsList$logs === void 0 ? void 0 : _logsList$logs.map(function (log) {
+    var _log$author, _log$user, _log$author2, _log$user2, _log$author3, _log$user3, _log$config, _log$config2;
+    return /*#__PURE__*/_react.default.createElement("tbody", {
+      key: log.id
+    }, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.UserInfoContainer, null, /*#__PURE__*/_react.default.createElement("p", null, (log === null || log === void 0 || (_log$author = log.author) === null || _log$author === void 0 ? void 0 : _log$author.name) || (log === null || log === void 0 || (_log$user = log.user) === null || _log$user === void 0 ? void 0 : _log$user.name), " ", (log === null || log === void 0 || (_log$author2 = log.author) === null || _log$author2 === void 0 ? void 0 : _log$author2.lastname) || (log === null || log === void 0 || (_log$user2 = log.user) === null || _log$user2 === void 0 ? void 0 : _log$user2.lastname)), /*#__PURE__*/_react.default.createElement("p", null, (log === null || log === void 0 || (_log$author3 = log.author) === null || _log$author3 === void 0 ? void 0 : _log$author3.email) || (log === null || log === void 0 || (_log$user3 = log.user) === null || _log$user3 === void 0 ? void 0 : _log$user3.email)))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.EventTypeContainer, null, /*#__PURE__*/_react.default.createElement("p", null, t(((log === null || log === void 0 ? void 0 : log.event) || '').toUpperCase())))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.ConfigListTable, null, /*#__PURE__*/_react.default.createElement("p", null, t(((log === null || log === void 0 || (_log$config = log.config) === null || _log$config === void 0 ? void 0 : _log$config.key) || '').toUpperCase(), ((log === null || log === void 0 || (_log$config2 = log.config) === null || _log$config2 === void 0 ? void 0 : _log$config2.key) || '').replaceAll('_', ' '))))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.DataListTable, null, (log === null || log === void 0 ? void 0 : log.data) && getValidLogData(log === null || log === void 0 ? void 0 : log.data).map(function (item, i) {
+      return /*#__PURE__*/_react.default.createElement("tbody", {
+        key: i
+      }, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, t(item === null || item === void 0 ? void 0 : item.attribute.toUpperCase(), item === null || item === void 0 ? void 0 : item.attribute.replaceAll('_', ' ')))));
+    }))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.DataListTable, null, (log === null || log === void 0 ? void 0 : log.data) && getValidLogData(log === null || log === void 0 ? void 0 : log.data).map(function (item, i) {
+      var _item$added, _item$added2;
+      return /*#__PURE__*/_react.default.createElement("tbody", {
+        key: i
+      }, /*#__PURE__*/_react.default.createElement("tr", null, item.attribute !== 'schedule' ? /*#__PURE__*/_react.default.createElement("td", null, typeof (item === null || item === void 0 ? void 0 : item.new) !== 'undefined' && (item === null || item === void 0 ? void 0 : item.new) !== null ? "".concat(item === null || item === void 0 ? void 0 : item.new) : (item === null || item === void 0 || (_item$added = item.added) === null || _item$added === void 0 ? void 0 : _item$added.length) > 0 ? item === null || item === void 0 || (_item$added2 = item.added) === null || _item$added2 === void 0 ? void 0 : _item$added2.toString() : t('NONE', 'None')) : /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.SeeChanges, {
+        onClick: function onClick() {
+          return scheduleModalData(item, 'new');
+        }
+      }, t('SEE_CHANGES', 'See changes')))));
+    }))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.DataListTable, null, (log === null || log === void 0 ? void 0 : log.data) && getValidLogData(log === null || log === void 0 ? void 0 : log.data).map(function (item, i) {
+      var _item$removed, _item$removed2;
+      return /*#__PURE__*/_react.default.createElement("tbody", {
+        key: i
+      }, /*#__PURE__*/_react.default.createElement("tr", null, item.attribute !== 'schedule' ? /*#__PURE__*/_react.default.createElement("td", null, typeof (item === null || item === void 0 ? void 0 : item.old) !== 'undefined' && (item === null || item === void 0 ? void 0 : item.old) !== null ? "".concat(item === null || item === void 0 ? void 0 : item.old) : (item === null || item === void 0 || (_item$removed = item.removed) === null || _item$removed === void 0 ? void 0 : _item$removed.length) > 0 ? item === null || item === void 0 || (_item$removed2 = item.removed) === null || _item$removed2 === void 0 ? void 0 : _item$removed2.toString() : t('NONE', 'None')) : /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.SeeChanges, {
+        onClick: function onClick() {
+          return scheduleModalData(item, 'old');
+        }
+      }, t('SEE_CHANGES', 'See changes')))));
+    }))), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles.DateTimeWrapper, null, parseDate(log.created_at, {
+      utc: false
+    }))), /*#__PURE__*/_react.default.createElement("td", null, log === null || log === void 0 ? void 0 : log.user_agent)));
+  }))) : /*#__PURE__*/_react.default.createElement(_styles.NoData, null, t('NO_DATA', 'No Data'))), (logsList === null || logsList === void 0 ? void 0 : logsList.logs.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles.WrapperPagination, null, /*#__PURE__*/_react.default.createElement(_Shared.Pagination, {
+    isHidePagecontrol: true,
+    currentPage: paginationProps.currentPage,
+    totalPages: paginationProps.totalPages,
+    handleChangePage: handleChangePage,
+    handleChangePageSize: handleChangePageSize
+  }))), /*#__PURE__*/_react.default.createElement(_Shared.Modal, {
+    width: "40%",
+    height: "60vh",
+    style: {
+      overflowY: 'auto'
+    },
+    padding: "30px",
+    title: t('SCHEDULE_CHANGES', 'Schedule changes'),
+    open: open,
+    onClose: function onClose() {
+      return setOpen(false);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_styles.SchedulesWrapper, {
+    border: !!(schedules !== null && schedules !== void 0 && schedules.oldSchedule)
+  }, (schedules === null || schedules === void 0 ? void 0 : schedules.newSchedule) && /*#__PURE__*/_react.default.createElement(_styles.Schedules, null, /*#__PURE__*/_react.default.createElement(_styles.ScheduleTitle, null, t('NEW', 'New')), getSchedule(schedules === null || schedules === void 0 ? void 0 : schedules.newSchedule)), (schedules === null || schedules === void 0 ? void 0 : schedules.oldSchedule) && /*#__PURE__*/_react.default.createElement(_styles.Schedules, null, /*#__PURE__*/_react.default.createElement(_styles.ScheduleTitle, null, t('OLD', 'Old')), getSchedule(schedules === null || schedules === void 0 ? void 0 : schedules.oldSchedule)))));
+};
+var SettingsLogs = exports.SettingsLogs = function SettingsLogs(props) {
+  var settingsLogsProps = _objectSpread(_objectSpread({}, props), {}, {
+    UIComponent: SettingsLogsUI
+  });
+  return /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.SettingsLogs, settingsLogsProps);
+};

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

@@ -0,0 +1,80 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.WrapperPagination = exports.UserInfoContainer = exports.TableWrapper = exports.Table = exports.SeeChanges = exports.SchedulesWrapper = exports.Schedules = exports.ScheduleTitle = exports.ScheduleLapses = exports.ScheduleDay = exports.NoData = exports.HeaderTitleContainer = exports.HeaderContainer = exports.EventTypeContainer = exports.DriversGroupLogsContainer = exports.DateTimeWrapper = exports.DataListTable = exports.ConfigListTable = void 0;
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33;
+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 DriversGroupLogsContainer = exports.DriversGroupLogsContainer = _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"])));
+var TableWrapper = exports.TableWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  overflow: auto;\n  max-height: calc(100vh - 200px);\n"])));
+var SeeChanges = exports.SeeChanges = _styledComponents.default.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  color: ", ";\n  cursor: pointer;\n  &:hover {\n    text-decoration: underline;\n  }\n"])), function (props) {
+  return props.theme.colors.primary;
+});
+var Table = exports.Table = _styledComponents.default.table(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  width: 100%;\n  min-width: 1000px;\n  color: ", ";\n\n  thead {\n    tr {\n      border-bottom: solid 1px ", ";\n      th {\n        padding: 13px 0;\n        font-size: 12px;\n        &:first-child {\n          width: 10%;\n          ", "\n          box-sizing: border-box;\n        }\n        &:nth-child(4) {\n          ", "\n          box-sizing: border-box;\n        }\n      }\n    }\n  }\n\n  > tbody {\n    border-bottom: 1px solid ", ";\n    td {\n      padding: 13px 0;\n      font-size: 12px;\n      &:first-child {\n        width: 10%;\n        ", "\n        box-sizing: border-box;\n      }\n      &:nth-child(4) {\n        ", "\n        box-sizing: border-box;\n      }\n    }\n  }\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.headingColor;
+}, function (props) {
+  return props.theme.colors.disabled;
+}, 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            padding-left: 15px;\n          "]))) : (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n            padding-right: 15px;\n          "])));
+}, function (props) {
+  var _props$theme2;
+  return (_props$theme2 = props.theme) !== null && _props$theme2 !== void 0 && _props$theme2.rtl ? (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n            padding-right: 15px;\n          "]))) : (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n            padding-left: 15px;\n          "])));
+}, function (props) {
+  return props.theme.colors.borderColor;
+}, function (props) {
+  var _props$theme3;
+  return (_props$theme3 = props.theme) !== null && _props$theme3 !== void 0 && _props$theme3.rtl ? (0, _styledComponents.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n          padding-left: 15px;\n        "]))) : (0, _styledComponents.css)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n          padding-right: 15px;\n        "])));
+}, function (props) {
+  var _props$theme4;
+  return (_props$theme4 = props.theme) !== null && _props$theme4 !== void 0 && _props$theme4.rtl ? (0, _styledComponents.css)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n          padding-right: 15px;\n        "]))) : (0, _styledComponents.css)(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n          padding-left: 15px;\n        "])));
+});
+var UserInfoContainer = exports.UserInfoContainer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  p {\n    color: ", ";\n    margin: 0px;\n    font-size: 12px;\n    &:first-child {\n      color: ", ";\n      font-weight: 500;\n    }\n  }\n"])), function (props) {
+  return props.theme.colors.lightGray;
+}, function (props) {
+  return props.theme.colors.headingColor;
+});
+var DateTimeWrapper = exports.DateTimeWrapper = _styledComponents.default.div(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n  white-space: nowrap;\n  font-size: 12px;\n  min-height: 36px;\n  display: flex;\n  align-items: center;\n\n  ", "\n"])), function (props) {
+  var _props$theme5;
+  return (_props$theme5 = props.theme) !== null && _props$theme5 !== void 0 && _props$theme5.rtl ? (0, _styledComponents.css)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n    padding-left: 15px;\n    margin-left: 15px;\n    border-left: 1px solid ", ";\n  "])), function (props) {
+    return props.theme.colors.borderColor;
+  }) : (0, _styledComponents.css)(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n    padding-right: 15px;\n    margin-right: 15px;\n    border-right: 1px solid ", ";\n  "])), function (props) {
+    return props.theme.colors.borderColor;
+  });
+});
+var NoData = exports.NoData = _styledComponents.default.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  font-size: 16px;\n"])));
+var WrapperPagination = exports.WrapperPagination = _styledComponents.default.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  padding: 20px 0;\n  justify-content: flex-end;\n"])));
+var DataListTable = exports.DataListTable = _styledComponents.default.table(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n  width: 100%;\n  border-right: 1px solid ", ";\n\n  tbody {\n    border-bottom: none;\n    td {\n      box-sizing: border-box;\n      &:first-child {\n        width: 50% !important;\n        padding-left: 15px;\n        padding-right: 15px;\n        box-sizing: border-box;\n      }\n      &:not(:first-child) {\n        width: initial !important;\n      }\n      white-space: nowrap;\n      padding-top: 10px;\n      padding-bottom: 10px;\n      ", "\n    }\n  }\n"])), function (props) {
+  return props.theme.colors.borderColor;
+}, function (props) {
+  var _props$theme6;
+  return (_props$theme6 = props.theme) !== null && _props$theme6 !== void 0 && _props$theme6.rtl ? (0, _styledComponents.css)(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n        padding-left: 15px;\n      "]))) : (0, _styledComponents.css)(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n        padding-right: 15px;\n      "])));
+});
+var ConfigListTable = exports.ConfigListTable = _styledComponents.default.table(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n  width: 100%;\n  border-right: 1px solid ", ";\n  text-transform: capitalize;\n\n  tbody {\n    border-bottom: none;\n    td {\n      box-sizing: border-box;\n      &:first-child {\n        width: 50% !important;\n        padding-left: 15px;\n        padding-right: 15px;\n        box-sizing: border-box;\n      }\n      &:not(:first-child) {\n        width: initial !important;\n      }\n      white-space: nowrap;\n      padding-top: 10px;\n      padding-bottom: 10px;\n      ", "\n    }\n  }\n"])), function (props) {
+  return props.theme.colors.borderColor;
+}, function (props) {
+  var _props$theme7;
+  return (_props$theme7 = props.theme) !== null && _props$theme7 !== void 0 && _props$theme7.rtl ? (0, _styledComponents.css)(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n        padding-left: 15px;\n      "]))) : (0, _styledComponents.css)(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n        padding-right: 15px;\n      "])));
+});
+var EventTypeContainer = exports.EventTypeContainer = _styledComponents.default.div(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n  white-space: nowrap;\n  font-size: 12px;\n  min-height: 36px;\n  display: flex;\n  align-items: center;\n  padding-right: 15px;\n  padding-left: 15px;\n  margin-left: 15px;\n  margin-right: 10px;\n  border-right: 1px solid ", ";\n  border-left: 1px solid ", ";\n  p{\n    margin-bottom: 0px;\n  }\n"])), function (props) {
+  return props.theme.colors.borderColor;
+}, function (props) {
+  return props.theme.colors.borderColor;
+});
+var SchedulesWrapper = exports.SchedulesWrapper = _styledComponents.default.div(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  gap: 30px;\n  justify-content: center;\n\n  ", "\n"])), function (props) {
+  return (props === null || props === void 0 ? void 0 : props.border) && (0, _styledComponents.css)(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n    div:first-child {\n    border-right: 1px solid #E9ECEF;\n    padding-right: 30px;\n    "])));
+});
+var Schedules = exports.Schedules = _styledComponents.default.div(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n"])));
+var ScheduleDay = exports.ScheduleDay = _styledComponents.default.div(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  justify-content: space-between;\n"])));
+var ScheduleLapses = exports.ScheduleLapses = _styledComponents.default.div(_templateObject30 || (_templateObject30 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  border-left: 1px solid #E9ECEF;\n  padding-left: 10px;\n\n  p  {\n    margin: 0px;\n  }\n"])));
+var ScheduleTitle = exports.ScheduleTitle = _styledComponents.default.h2(_templateObject31 || (_templateObject31 = _taggedTemplateLiteral(["\n  text-align: center;\n"])));
+var HeaderContainer = exports.HeaderContainer = _styledComponents.default.div(_templateObject32 || (_templateObject32 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  margin-bottom: 20px;\n\n  input {\n    border: none;\n    background: #F8F9FA;\n    border-radius: 50px;\n  }\n\n  @media (min-width: 992px) {\n    flex-direction: row;\n    align-items: center;\n    justify-content: space-between;\n  }\n"])));
+var HeaderTitleContainer = exports.HeaderTitleContainer = _styledComponents.default.div(_templateObject33 || (_templateObject33 = _taggedTemplateLiteral(["\n  flex: 1;\n  display: flex;\n  align-items: center;\n  h1 {\n    font-size: 20px;\n    margin: 10px 0 0 0;\n    font-weight: bold;\n    color: ", ";\n  }\n"])), function (props) {
+  return props.theme.colors.headingColor;
+});

package/_modules/components/Settings/index.js

@@ -183,6 +183,12 @@ Object.defineProperty(exports, "SettingsList", {
     return _SettingsList.SettingsList;
   }
 });
+Object.defineProperty(exports, "SettingsLogs", {
+  enumerable: true,
+  get: function get() {
+    return _SettingsLogs.SettingsLogs;
+  }
+});
 Object.defineProperty(exports, "SettingsSelectUI", {
   enumerable: true,
   get: function get() {
@@ -226,6 +232,7 @@ var _LalaMoveConnect = require("./LalaMoveConnect");
 var _SettingsDetail = require("./SettingsDetail");
 var _EmailSetting = require("./EmailSetting");
 var _SettingsList = require("./SettingsList");
+var _SettingsLogs = require("./SettingsLogs");
 var _NotificationSetting = require("./NotificationSetting");
 var _SettingsSelectUI = require("./SettingsSelectUI");
 var _SettingsCountryFilter = require("./SettingsCountryFilter");

package/_modules/components/SidebarMenu/index.js

@@ -253,6 +253,11 @@ var SidebarMenuUI = function SidebarMenuUI(props) {
     title: t('LANGUAGE_MANAGER', 'Language manager'),
     pageName: 'language',
     url: '/settings/language'
+  }, {
+    id: 8,
+    title: t('SETTINGS_LOGS', 'Settings logs'),
+    pageName: 'logs',
+    url: '/settings/logs'
   }];
   var businessIntelligenceSubMenus = [{
     id: 1,
@@ -581,7 +586,7 @@ var SidebarMenuUI = function SidebarMenuUI(props) {
     className: "d-flex flex-column mt-4"
   }, /*#__PURE__*/_react.default.createElement(_styles.LanguageSelectorContainer, null, /*#__PURE__*/_react.default.createElement(_LanguageSelector.LanguageSelector, null)), (sessionState === null || sessionState === void 0 || (_sessionState$user33 = sessionState.user) === null || _sessionState$user33 === void 0 ? void 0 : _sessionState$user33.level) === 0 && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Accordion, null, /*#__PURE__*/_react.default.createElement(_styles.MenuContainer, null, /*#__PURE__*/_react.default.createElement(ContextAwareToggle, {
     eventKey: "5",
-    active: location.pathname === '/settings/basic' || location.pathname === '/settings/operation' || location.pathname === '/settings/plugin' || location.pathname === '/settings/pages' || location.pathname === '/settings/integrations' || location.pathname === '/settings/places' || location.pathname === '/settings/advanced' || location.pathname === '/settings/language'
+    active: location.pathname === '/settings/basic' || location.pathname === '/settings/operation' || location.pathname === '/settings/plugin' || location.pathname === '/settings/pages' || location.pathname === '/settings/integrations' || location.pathname === '/settings/places' || location.pathname === '/settings/advanced' || location.pathname === '/settings/language' || location.pathname === '/settings/logs'
   }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Gear, null), /*#__PURE__*/_react.default.createElement("span", null, t('SETTINGS', 'Settings'))), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Accordion.Collapse, {
     eventKey: "5"
   }, /*#__PURE__*/_react.default.createElement(_styles.MenuContent, null, settingsSubMenus.map(function (item) {

package/_modules/components/Stores/BusinessAdd/BusinessDetails/index.js

@@ -17,7 +17,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var BusinessDetails = exports.BusinessDetails = function BusinessDetails(props) {
-  var _configs$google_maps_, _formState$changes$na, _formState$changes, _formState$changes$ad, _formState$changes2, _configs$country_auto, _configs$google_maps_2, _configs$google_maps_3, _formState$changes$lo, _formState$changes3, _formState$changes$ce, _formState$changes4;
+  var _configs$google_maps_, _formState$changes$na, _formState$changes, _formState$changes$ad, _formState$changes2, _configs$country_auto, _configs$google_maps_2, _configs$google_maps_3, _formState$changes$lo, _formState$changes3, _formState$changes$sl, _formState$changes4, _formState$changes$ce, _formState$changes5;
   var formState = props.formState,
     handleChangeAddress = props.handleChangeAddress,
     handleChangeInput = props.handleChangeInput,
@@ -80,12 +80,17 @@ var BusinessDetails = exports.BusinessDetails = function BusinessDetails(props)
     // handleChangeCenter={handleChangeCenter}
     ,
     isFitCenter: true
-  }))), /*#__PURE__*/_react.default.createElement(_styles.FormControl, {
+  }))), /*#__PURE__*/_react.default.createElement(_styles.FormControl, null, /*#__PURE__*/_react.default.createElement("label", null, t('SLUG', 'Slug')), /*#__PURE__*/_react.default.createElement(_styles2.Input, {
+    name: "slug",
+    placeholder: t('SLUG', 'Slug'),
+    value: (_formState$changes$sl = formState === null || formState === void 0 || (_formState$changes4 = formState.changes) === null || _formState$changes4 === void 0 ? void 0 : _formState$changes4.slug) !== null && _formState$changes$sl !== void 0 ? _formState$changes$sl : '',
+    onChange: handleChangeInput
+  })), /*#__PURE__*/_react.default.createElement(_styles.FormControl, {
     noBottom: true
   }, /*#__PURE__*/_react.default.createElement("label", null, t('PHONE_NUMBER', 'Phone number')), /*#__PURE__*/_react.default.createElement(_styles2.Input, {
     name: "cellphone",
     placeholder: t('PHONE_NUMBER', 'Phone number'),
-    value: (_formState$changes$ce = formState === null || formState === void 0 || (_formState$changes4 = formState.changes) === null || _formState$changes4 === void 0 ? void 0 : _formState$changes4.cellphone) !== null && _formState$changes$ce !== void 0 ? _formState$changes$ce : '',
+    value: (_formState$changes$ce = formState === null || formState === void 0 || (_formState$changes5 = formState.changes) === null || _formState$changes5 === void 0 ? void 0 : _formState$changes5.cellphone) !== null && _formState$changes$ce !== void 0 ? _formState$changes$ce : '',
     onChange: handleChangeInput
   }))));
 };

package/_modules/index.js

@@ -2157,6 +2157,12 @@ Object.defineProperty(exports, "SettingsList", {
     return _Settings.SettingsList;
   }
 });
+Object.defineProperty(exports, "SettingsLogs", {
+  enumerable: true,
+  get: function get() {
+    return _Settings.SettingsLogs;
+  }
+});
 Object.defineProperty(exports, "SettingsSelectUI", {
   enumerable: true,
   get: function get() {

package/index-template.js

@@ -298,7 +298,7 @@ if (!(window?.location?.hostname === 'localhost')) {
     integrations: [
       new Integrations.BrowserTracing()
     ],
-    release: process.env.npm_package_version ? 'ordering-ui-admin-release@' + process.env.npm_package_version : 'ordering-ui-admin-release@' + '1.1.2',
+    release: process.env.npm_package_version ? 'ordering-ui-admin-release@' + process.env.npm_package_version : 'ordering-ui-admin-release@' + '1.1.3',
     // Release health
     autoSessionTracking: true,
     ignoreErrors: [

package/package.json

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

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

@@ -181,7 +181,7 @@ export const InvoiceDriverPdf = (props) => {
               <tr key={i}>
                 <td style={styles.table.tbody.tr.td}>{order.id}</td>
                 <td style={styles.table.tbody.tr.td}>{parseDate(order.delivery_datetime, { utc: false })}</td>
-                <td style={styles.table.tbody.tr.td}>{getOrderStatus(order.status).value}</td>
+                <td style={styles.table.tbody.tr.td}>{getOrderStatus(order.status)?.value}</td>
                 <td style={styles.table.tbody.tr.tdNumber}>{parsePrice(getSubtotal(order))}</td>
                 <td style={styles.table.tbody.tr.tdNumber}>{parsePrice(getTotal(order))}</td>
               </tr>

package/src/components/BusinessIntelligence/Reports/ReportsSlaOrders/index.js

@@ -1,4 +1,4 @@
-import React, { useRef } from 'react'
+import React, { useRef, useState } from 'react'
 import {
   useLanguage,
   useUtils,
@@ -9,6 +9,11 @@ import { AnalyticsCalendar } from '../../AnalyticsCalendar'
 import { Download } from 'react-bootstrap-icons'
 import Skeleton from 'react-loading-skeleton'
 import { AnalyticsFilterTimeZone } from '../../AnalyticsFilterTimeZone'
+import { Button } from '../../../../styles'
+import { Modal } from '../../../Shared'
+import { ReportsDriverGroupFilter } from '../../ReportsDriverGroupFilter'
+import { ReportsDriverFilter } from '../../ReportsDriverFilter'
+import { AnalyticsBusinessFilter } from '../../AnalyticsBusinessFilter'
 
 import {
   ReportsContainer,
@@ -24,7 +29,8 @@ import {
   Tbody,
   Tfoot,
   AnalyticsTimeZoneWrapper,
-  TimeZoneAndCalendar
+  TimeZoneAndCalendar,
+  BrandBusinessWrapper
 } from './styles'
 
 const ReportsSlaOrdersUI = (props) => {
@@ -36,6 +42,10 @@ const ReportsSlaOrdersUI = (props) => {
 
   const [, t] = useLanguage()
   const [{ parsePrice }] = useUtils()
+  const [isDriverGroupFilter, setIsDriverGroupFilter] = useState(false)
+  const [isDriverFilter, setIsDriverFilter] = useState(false)
+  const [isBusinessFilter, setIsBusinessFilter] = useState(false)
+  const [availableDriverIds, setAvailableDriverIds] = useState(null)
 
   const tableRef = useRef(null)
 
@@ -110,6 +120,23 @@ const ReportsSlaOrdersUI = (props) => {
     <ReportsContainer>
       <Title>{t('SLA_ORDERS', 'SLA orders')}</Title>
       <ButtonActionList>
+        <BrandBusinessWrapper>
+          <Button
+            onClick={() => setIsDriverGroupFilter(true)}
+          >
+            {t('DRIVER_GROUP', 'Driver group')} ({filterList?.driver_groups_ids ? filterList?.driver_groups_ids.length : t('ALL', 'All')})
+          </Button>
+          <Button
+              onClick={() => setIsDriverFilter(true)}
+            >
+              {t('DRIVER', 'Driver')} ({filterList?.drivers_ids ? filterList?.drivers_ids.length : t('ALL', 'All')})
+            </Button>
+            <Button
+            onClick={() => setIsBusinessFilter(true)}
+          >
+            {t('BUSINESS', 'Business')} ({filterList?.businessIds ? filterList?.businessIds.length : t('ALL', 'All')})
+          </Button>
+        </BrandBusinessWrapper>
         <TimeZoneAndCalendar>
           <AnalyticsTimeZoneWrapper>
             <AnalyticsFilterTimeZone {...props} />
@@ -186,6 +213,48 @@ const ReportsSlaOrdersUI = (props) => {
           </TableWrapper>
         )}
       </ReportsTableContainer>
+      <Modal
+          width='50%'
+          height='80vh'
+          padding='30px'
+          title={t('DRIVER_GROUP', 'Driver group')}
+          open={isDriverGroupFilter}
+          onClose={() => setIsDriverGroupFilter(false)}
+        >
+          <ReportsDriverGroupFilter
+            {...props}
+            onClose={() => setIsDriverGroupFilter(false)}
+            setAvailableDriverIds={setAvailableDriverIds}
+          />
+        </Modal>
+        <Modal
+          width='50%'
+          height='80vh'
+          padding='30px'
+          title={t('DRIVER', 'Driver')}
+          open={isDriverFilter}
+          onClose={() => setIsDriverFilter(false)}
+        >
+          <ReportsDriverFilter
+            {...props}
+            onClose={() => setIsDriverFilter(false)}
+            availableDriverIds={availableDriverIds}
+          />
+        </Modal>
+        <Modal
+        width='50%'
+        height='80vh'
+        padding='30px'
+        title={t('BUSINESSES', 'Businesses')}
+        open={isBusinessFilter}
+        onClose={() => setIsBusinessFilter(false)}
+      >
+        <AnalyticsBusinessFilter
+          {...props}
+          onClose={() => setIsBusinessFilter(false)}
+          isFranchise
+        />
+      </Modal>
     </ReportsContainer>
   )
 }

package/src/components/BusinessIntelligence/Reports/ReportsSlaOrders/styles.js

@@ -27,7 +27,7 @@ export const ButtonActionList = styled.div`
   display: flex;
   flex-wrap: wrap;
   align-items: center;
-  justify-content: flex-end;
+  justify-content: space-between;
 `
 
 export const CalendarWrapper = styled.div`
@@ -237,3 +237,17 @@ export const TimeZoneAndCalendar = styled.div`
     width: fit-content;
   }
 `
+
+export const BrandBusinessWrapper = styled(CalendarWrapper)`
+  display: flex;
+
+  > button {
+    margin-right: 10px;
+    margin-left: 0;
+
+  ${props => props.theme?.rtl && css`
+    margin-left: 10px;
+    margin-right: 0;
+  `}
+  }
+`