ordering-ui-admin-external 1.43.31 → 1.43.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/_bundles/{ordering-ui-admin.631d4ac82d8f20108a58.js → ordering-ui-admin.55456c42d67a694c43d5.js} +2 -2
  2. package/_modules/components/Delivery/DriverGroupSelectorHeader/index.js +14 -13
  3. package/_modules/components/Delivery/DriversTimeDisplay/UserList.js +10 -18
  4. package/_modules/components/Delivery/DriversTimeDisplay/index.js +63 -16
  5. package/_modules/components/Delivery/DriversTimeDisplay/styles.js +7 -6
  6. package/_modules/components/Orders/DriverMultiSelector/index.js +46 -17
  7. package/_modules/styles/MultiSelect/index.js +56 -10
  8. package/_modules/styles/MultiSelect/styles.js +16 -5
  9. package/_modules/styles/Selects/index.js +62 -51
  10. package/package.json +2 -2
  11. package/src/components/Delivery/DriverGroupSelectorHeader/index.js +21 -21
  12. package/src/components/Delivery/DriversTimeDisplay/UserList.js +35 -41
  13. package/src/components/Delivery/DriversTimeDisplay/index.js +89 -34
  14. package/src/components/Delivery/DriversTimeDisplay/styles.js +22 -4
  15. package/src/components/Orders/DriverMultiSelector/index.js +46 -10
  16. package/src/styles/MultiSelect/index.js +104 -33
  17. package/src/styles/MultiSelect/styles.js +16 -1
  18. package/src/styles/Selects/index.js +14 -10
  19. /package/_bundles/{ordering-ui-admin.631d4ac82d8f20108a58.js.LICENSE.txt → ordering-ui-admin.55456c42d67a694c43d5.js.LICENSE.txt} +0 -0
package/_modules/components/Delivery/DriverGroupSelectorHeader/index.js CHANGED
@@ -33,7 +33,7 @@ var DriverGroupsListingUI = function DriverGroupsListingUI(props) {
33
33
  pagination = props.pagination,
34
34
  searchValue = props.searchValue,
35
35
  onSearch = props.onSearch,
36
- getPageBusinesses = props.getPageBusinesses,
36
+ getHeaderDriversGroups = props.getHeaderDriversGroups,
37
37
  isOpen = props.isOpen,
38
38
  close = props.close,
39
39
  changeDriverGroupState = props.changeDriverGroupState;
@@ -42,11 +42,11 @@ var DriverGroupsListingUI = function DriverGroupsListingUI(props) {
42
42
  t = _useLanguage2[1];
43
43
  var dropdownReference = (0, _react.useRef)();
44
44
  var handleChangePage = function handleChangePage(page) {
45
- getPageBusinesses(pagination.pageSize, page);
45
+ getHeaderDriversGroups(page, pagination.pageSize);
46
46
  };
47
47
  var handleChangePageSize = function handleChangePageSize(pageSize) {
48
48
  var expectedPage = Math.ceil(pagination.from / pageSize);
49
- getPageBusinesses(pageSize, expectedPage);
49
+ getHeaderDriversGroups(expectedPage, pageSize);
50
50
  };
51
51
  var closeSelect = function closeSelect(e) {
52
52
  if (isOpen) {
@@ -96,19 +96,19 @@ var DriverGroupsListingUI = function DriverGroupsListingUI(props) {
96
96
  marginTop: '7px'
97
97
  }
98
98
  })));
99
- }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, driversGroupsState.groups.map(function (driver_group) {
100
- var _driver_group$drivers;
99
+ }) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, driversGroupsState.groups.map(function (driverGroup) {
100
+ var _driverGroup$drivers;
101
101
  return /*#__PURE__*/_react.default.createElement(_styles.OptionItem, {
102
- key: driver_group.id,
102
+ key: driverGroup.id,
103
103
  onClick: function onClick() {
104
- return changeDriverGroupState(driver_group);
104
+ return changeDriverGroupState(driverGroup);
105
105
  }
106
- }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("b", null, driver_group === null || driver_group === void 0 ? void 0 : driver_group.name), /*#__PURE__*/_react.default.createElement("p", null, t('DRIVERS', 'Drivers:'), " ", driver_group === null || driver_group === void 0 || (_driver_group$drivers = driver_group.drivers) === null || _driver_group$drivers === void 0 ? void 0 : _driver_group$drivers.length)));
107
- }))), pagination && (pagination === null || pagination === void 0 ? void 0 : pagination.total) > 0 && /*#__PURE__*/_react.default.createElement(_styles.WrapperPagination, {
106
+ }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("b", null, driverGroup === null || driverGroup === void 0 ? void 0 : driverGroup.name), /*#__PURE__*/_react.default.createElement("p", null, t('DRIVERS', 'Drivers:'), " ", driverGroup === null || driverGroup === void 0 || (_driverGroup$drivers = driverGroup.drivers) === null || _driverGroup$drivers === void 0 ? void 0 : _driverGroup$drivers.length)));
107
+ }))), pagination && (pagination === null || pagination === void 0 ? void 0 : pagination.totalPages) > 0 && /*#__PURE__*/_react.default.createElement(_styles.WrapperPagination, {
108
108
  className: "pagination-container"
109
- }, (pagination === null || pagination === void 0 ? void 0 : pagination.total) && /*#__PURE__*/_react.default.createElement(_Shared.Pagination, {
109
+ }, /*#__PURE__*/_react.default.createElement(_Shared.Pagination, {
110
110
  currentPage: pagination.currentPage,
111
- totalPages: Math.ceil((pagination === null || pagination === void 0 ? void 0 : pagination.total) / pagination.pageSize),
111
+ totalPages: pagination === null || pagination === void 0 ? void 0 : pagination.totalPages,
112
112
  handleChangePage: handleChangePage,
113
113
  defaultPageSize: pagination.pageSize,
114
114
  handleChangePageSize: handleChangePageSize,
@@ -122,9 +122,10 @@ var DriverGroupSelectHeader = exports.DriverGroupSelectHeader = function DriverG
122
122
  isHeaderComponent: true,
123
123
  paginationSettings: {
124
124
  initialPage: 1,
125
- pageSize: 6,
125
+ pageSize: 5,
126
126
  controlType: 'pages'
127
- }
127
+ },
128
+ propsToFetch: ['id', 'enabled', 'drivers', 'name']
128
129
  });
129
130
  return /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DriversGroupsList, driverGroupsListingProps);
130
131
  };
package/_modules/components/Delivery/DriversTimeDisplay/UserList.js CHANGED
@@ -34,7 +34,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
34
34
  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; } }
35
35
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
36
36
  var DeliveryUsersListing = exports.DeliveryUsersListing = function DeliveryUsersListing(props) {
37
- var _configs$general_hour, _configs$general_hour2, _driversList$users2, _driversList$users3;
37
+ var _configs$general_hour, _configs$general_hour2, _driversList$users, _driversList$users2;
38
38
  var date = props.date,
39
39
  driversList = props.driversList,
40
40
  paginationProps = props.paginationProps,
@@ -67,9 +67,9 @@ var DeliveryUsersListing = exports.DeliveryUsersListing = function DeliveryUsers
67
67
  var expectedPage = Math.ceil(paginationProps.from / pageSize);
68
68
  getDrivers(expectedPage, pageSize, selectedGroup === null || selectedGroup === void 0 ? void 0 : selectedGroup.id);
69
69
  };
70
- var getDatesInRange = function getDatesInRange(date_range) {
71
- var start = (0, _moment.default)(date_range[0]);
72
- var end = (0, _moment.default)(date_range[1]);
70
+ var getDatesInRange = function getDatesInRange(dateRange) {
71
+ var start = (0, _moment.default)(dateRange[0]);
72
+ var end = (0, _moment.default)(dateRange[1]);
73
73
  var dates = [];
74
74
  var current = start;
75
75
  while (current <= end) {
@@ -94,6 +94,7 @@ var DeliveryUsersListing = exports.DeliveryUsersListing = function DeliveryUsers
94
94
  return width;
95
95
  };
96
96
  var handleBlockHourToShow = function handleBlockHourToShow(block, user) {
97
+ var _user$name, _user$lastname;
97
98
  if (!block) return;
98
99
  return block.start && block.end && /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles2.Block, {
99
100
  innerWidth: handleHourBlockWidth(block),
@@ -104,7 +105,7 @@ var DeliveryUsersListing = exports.DeliveryUsersListing = function DeliveryUsers
104
105
  onClick: function onClick() {
105
106
  return handleSelectDriver(user, block);
106
107
  }
107
- }, /*#__PURE__*/_react.default.createElement(_styles2.UserName, null, "".concat(!!(user !== null && user !== void 0 && user.name) ? user === null || user === void 0 ? void 0 : user.name : '', " ").concat(!!(user !== null && user !== void 0 && user.lastname) ? user === null || user === void 0 ? void 0 : user.lastname : '')), /*#__PURE__*/_react.default.createElement("p", null, (0, _moment.default)(block.start).format(hourFormat), " - ", (0, _moment.default)(block.end).format(hourFormat))));
108
+ }, /*#__PURE__*/_react.default.createElement(_styles2.UserName, null, "".concat((_user$name = user === null || user === void 0 ? void 0 : user.name) !== null && _user$name !== void 0 ? _user$name : '', " ").concat((_user$lastname = user === null || user === void 0 ? void 0 : user.lastname) !== null && _user$lastname !== void 0 ? _user$lastname : '')), /*#__PURE__*/_react.default.createElement("p", null, (0, _moment.default)(block.start).format(hourFormat), " - ", (0, _moment.default)(block.end).format(hourFormat))));
108
109
  };
109
110
  var handleBlockWeekToShow = function handleBlockWeekToShow(block, user, allBlocks, blockByDay) {
110
111
  if (!block) return;
@@ -140,15 +141,6 @@ var DeliveryUsersListing = exports.DeliveryUsersListing = function DeliveryUsers
140
141
  return objDate.date() === (0, _moment.default)(_date).date();
141
142
  });
142
143
  };
143
- (0, _react.useEffect)(function () {
144
- var _driversList$users;
145
- if (driversList.loading || (driversList === null || driversList === void 0 || (_driversList$users = driversList.users) === null || _driversList$users === void 0 ? void 0 : _driversList$users.length) > 0 || paginationProps.totalPages <= 1) return;
146
- if (paginationProps.currentPage !== paginationProps.totalPages) {
147
- handleChangePage(paginationProps.currentPage);
148
- } else {
149
- handleChangePage(paginationProps.currentPage - 1);
150
- }
151
- }, [driversList === null || driversList === void 0 ? void 0 : driversList.users, paginationProps]);
152
144
  return /*#__PURE__*/_react.default.createElement(_styles2.UsersListingContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.UsersConatiner, null, /*#__PURE__*/_react.default.createElement(_styles2.UserTableWrapper, null, /*#__PURE__*/_react.default.createElement(_styles2.UsersTable, null, /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement(_styles2.ThId, null, t('ID', 'ID')), /*#__PURE__*/_react.default.createElement(_styles2.ThName, null, t('NAME', 'Name')), getDatesInRange(date).length === 1 && (is12hours ? _utils.TwelveHours : _utils.TwentyFourHours).map(function (hour, i) {
153
145
  return /*#__PURE__*/_react.default.createElement(_styles2.HoursHeader, {
154
146
  key: i
@@ -174,15 +166,15 @@ var DeliveryUsersListing = exports.DeliveryUsersListing = function DeliveryUsers
174
166
  })), /*#__PURE__*/_react.default.createElement("p", null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
175
167
  width: 100
176
168
  })))))));
177
- }) : driversList === null || driversList === void 0 || (_driversList$users2 = driversList.users) === null || _driversList$users2 === void 0 ? void 0 : _driversList$users2.map(function (user, i) {
178
- var _user$name, _user$lastname, _getDatesInRange, _user$delivery_blocks, _user$delivery_blocks2, _getDatesInRange2;
169
+ }) : driversList === null || driversList === void 0 || (_driversList$users = driversList.users) === null || _driversList$users === void 0 ? void 0 : _driversList$users.map(function (user, i) {
170
+ var _user$name2, _user$lastname2, _getDatesInRange, _user$delivery_blocks, _user$delivery_blocks2, _getDatesInRange2;
179
171
  return /*#__PURE__*/_react.default.createElement("tbody", {
180
172
  key: i
181
173
  }, /*#__PURE__*/_react.default.createElement(_styles2.UserRow, null, /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles2.UserIdWrapper, null, user === null || user === void 0 ? void 0 : user.id)), /*#__PURE__*/_react.default.createElement("td", null, /*#__PURE__*/_react.default.createElement(_styles2.UserMainInfo, null, /*#__PURE__*/_react.default.createElement(_styles2.WrapperImage, null, user !== null && user !== void 0 && user.photo ? /*#__PURE__*/_react.default.createElement(_styles2.Image, {
182
174
  bgimage: optimizeImage(user === null || user === void 0 ? void 0 : user.photo, 'h_50,c_limit')
183
175
  }) : /*#__PURE__*/_react.default.createElement(_FaUserAlt.default, null)), /*#__PURE__*/_react.default.createElement(_styles2.InfoBlock, null, /*#__PURE__*/_react.default.createElement("span", {
184
176
  className: "bold"
185
- }, "".concat((_user$name = user.name) !== null && _user$name !== void 0 ? _user$name : '', " ").concat((_user$lastname = user === null || user === void 0 ? void 0 : user.lastname) !== null && _user$lastname !== void 0 ? _user$lastname : '')), /*#__PURE__*/_react.default.createElement("span", null, user === null || user === void 0 ? void 0 : user.email)), ((user === null || user === void 0 ? void 0 : user.phone_verified) || (user === null || user === void 0 ? void 0 : user.email_verified)) && /*#__PURE__*/_react.default.createElement(_styles2.VerifiedItemsContainer, null, !!(user !== null && user !== void 0 && user.phone_verified) && /*#__PURE__*/_react.default.createElement(_styles2.VerifiedItem, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Phone, null), t('VERIFIED', 'Verified')), !!(user !== null && user !== void 0 && user.email_verified) && /*#__PURE__*/_react.default.createElement(_styles2.VerifiedItem, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Envelope, null), t('VERIFIED', 'Verified'))))), ((_getDatesInRange = getDatesInRange(date)) === null || _getDatesInRange === void 0 ? void 0 : _getDatesInRange.length) === 1 && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, _toConsumableArray(Array(24 - (user === null || user === void 0 || (_user$delivery_blocks = user.delivery_blocks) === null || _user$delivery_blocks === void 0 ? void 0 : _user$delivery_blocks.length)).keys()).map(function (i) {
177
+ }, "".concat((_user$name2 = user.name) !== null && _user$name2 !== void 0 ? _user$name2 : '', " ").concat((_user$lastname2 = user === null || user === void 0 ? void 0 : user.lastname) !== null && _user$lastname2 !== void 0 ? _user$lastname2 : '')), /*#__PURE__*/_react.default.createElement("span", null, user === null || user === void 0 ? void 0 : user.email)), ((user === null || user === void 0 ? void 0 : user.phone_verified) || (user === null || user === void 0 ? void 0 : user.email_verified)) && /*#__PURE__*/_react.default.createElement(_styles2.VerifiedItemsContainer, null, !!(user !== null && user !== void 0 && user.phone_verified) && /*#__PURE__*/_react.default.createElement(_styles2.VerifiedItem, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Phone, null), t('VERIFIED', 'Verified')), !!(user !== null && user !== void 0 && user.email_verified) && /*#__PURE__*/_react.default.createElement(_styles2.VerifiedItem, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.Envelope, null), t('VERIFIED', 'Verified'))))), ((_getDatesInRange = getDatesInRange(date)) === null || _getDatesInRange === void 0 ? void 0 : _getDatesInRange.length) === 1 && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, _toConsumableArray(Array(24 - (user === null || user === void 0 || (_user$delivery_blocks = user.delivery_blocks) === null || _user$delivery_blocks === void 0 ? void 0 : _user$delivery_blocks.length)).keys()).map(function (i) {
186
178
  return /*#__PURE__*/_react.default.createElement("td", {
187
179
  key: i
188
180
  }, /*#__PURE__*/_react.default.createElement(_styles2.EmptyBlock, {
@@ -208,7 +200,7 @@ var DeliveryUsersListing = exports.DeliveryUsersListing = function DeliveryUsers
208
200
  }
209
201
  })));
210
202
  })));
211
- }))), /*#__PURE__*/_react.default.createElement(_styles2.UsersBottomContainer, null, (driversList === null || driversList === void 0 || (_driversList$users3 = driversList.users) === null || _driversList$users3 === void 0 ? void 0 : _driversList$users3.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles2.WrapperPagination, null, /*#__PURE__*/_react.default.createElement(_Shared.Pagination, {
203
+ }))), /*#__PURE__*/_react.default.createElement(_styles2.UsersBottomContainer, null, (driversList === null || driversList === void 0 || (_driversList$users2 = driversList.users) === null || _driversList$users2 === void 0 ? void 0 : _driversList$users2.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles2.WrapperPagination, null, /*#__PURE__*/_react.default.createElement(_Shared.Pagination, {
212
204
  currentPage: paginationProps.currentPage,
213
205
  totalPages: paginationProps.totalPages,
214
206
  handleChangePage: handleChangePage,
package/_modules/components/Delivery/DriversTimeDisplay/index.js CHANGED
@@ -21,6 +21,7 @@ var _styles2 = require("./styles");
21
21
  var _Select = require("../../../styles/Select");
22
22
  var _DriverMultiSelector = require("../../Orders/DriverMultiSelector");
23
23
  var _TiWarningOutline = _interopRequireDefault(require("@meronex/icons/ti/TiWarningOutline"));
24
+ var _MdClose = _interopRequireDefault(require("@meronex/icons/md/MdClose"));
24
25
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
25
26
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
26
27
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -80,7 +81,10 @@ var DriversTimeDisplayUI = function DriversTimeDisplayUI(props) {
80
81
  handleSetInitialStates = props.handleSetInitialStates,
81
82
  filterValues = props.filterValues,
82
83
  handleChangeDriver = props.handleChangeDriver,
83
- handleClearFilters = props.handleClearFilters;
84
+ handleClearFilters = props.handleClearFilters,
85
+ setFiltOption = props.setFiltOption,
86
+ filtOption = props.filtOption,
87
+ handleClearDriversList = props.handleClearDriversList;
84
88
  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
85
89
  _useLanguage2 = _slicedToArray(_useLanguage, 2),
86
90
  t = _useLanguage2[1];
@@ -151,10 +155,21 @@ var DriversTimeDisplayUI = function DriversTimeDisplayUI(props) {
151
155
  value: 'from_event',
152
156
  content: t('FROM_EVENT', 'From event')
153
157
  }];
154
- var changeDriverGroupState = function changeDriverGroupState(_driverGroup) {
158
+ var handleCleanFilters = function handleCleanFilters() {
155
159
  setShowSelectHeader(false);
160
+ handleClearFilters();
161
+ };
162
+ var changeDriverGroupState = function changeDriverGroupState(_driverGroup) {
163
+ if ((_driverGroup === null || _driverGroup === void 0 ? void 0 : _driverGroup.id) === (selectedGroup === null || selectedGroup === void 0 ? void 0 : selectedGroup.id)) return;
164
+ handleCleanFilters();
156
165
  setSelectedGroup(_driverGroup);
157
166
  };
167
+ var handleCloseFiltOption = function handleCloseFiltOption() {
168
+ setSelectedGroup(null);
169
+ setFiltOption(null);
170
+ handleClearDriversList();
171
+ handleCleanFilters();
172
+ };
158
173
  var handleChangeDate = function handleChangeDate(date1, date2) {
159
174
  var diff = (0, _moment.default)(date2).diff(date1, 'days');
160
175
  if (diff > 31) {
@@ -273,6 +288,10 @@ var DriversTimeDisplayUI = function DriversTimeDisplayUI(props) {
273
288
  }));
274
289
  setScheduleOptions(_scheduleOptions);
275
290
  };
291
+ var handleChangeFiltOption = function handleChangeFiltOption(option) {
292
+ setFiltOption(option);
293
+ option === 'driver_groups' && setShowSelectHeader(true);
294
+ };
276
295
  (0, _react.useEffect)(function () {
277
296
  var isTodayOrPastDate = (0, _moment.default)(selectedDate).format('YYYY-MM-DD') <= (0, _moment.default)().format('YYYY-MM-DD');
278
297
  var date = (0, _moment.default)(selectedDate).format('YYYY-MM-DD');
@@ -370,29 +389,56 @@ var DriversTimeDisplayUI = function DriversTimeDisplayUI(props) {
370
389
  onClick: function onClick() {
371
390
  return handleMenuCollapse(false);
372
391
  }
373
- }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.List, null)), /*#__PURE__*/_react.default.createElement(_styles2.HeaderWrapper, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h1", null, t('DRIVERS_TIME_DISPLAY', 'Drivers time display')), /*#__PURE__*/_react.default.createElement(_styles2.DriverGroupSelectorWrapper, null, /*#__PURE__*/_react.default.createElement(_styles2.DriverGroupName, {
392
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.List, null)), /*#__PURE__*/_react.default.createElement(_styles2.HeaderWrapper, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h1", null, t('DRIVERS_TIME_DISPLAY', 'Drivers time display')), /*#__PURE__*/_react.default.createElement(_styles2.DriverGroupSelectorWrapper, null, /*#__PURE__*/_react.default.createElement("span", {
393
+ className: "calendar"
394
+ }, t('CALENDAR', 'Calendar')), /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.ChevronRight, null), !filtOption ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.DriverGroupName, {
395
+ className: "calendar",
396
+ onClick: function onClick() {
397
+ return handleChangeFiltOption('driver_groups');
398
+ }
399
+ }, t('SELECT_DRIVER_GROUPS', 'Select driver groups')), /*#__PURE__*/_react.default.createElement("span", null, " ", t('OR', 'Or'), " "), /*#__PURE__*/_react.default.createElement(_styles2.DriverGroupName, {
400
+ className: "calendar",
401
+ onClick: function onClick() {
402
+ return handleChangeFiltOption('drivers');
403
+ }
404
+ }, t('SELECT_DRIVERS', 'Select drivers'))) : /*#__PURE__*/_react.default.createElement(_styles2.FiltContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.DriverGroupName, {
405
+ className: "calendar",
374
406
  onClick: function onClick() {
375
- return setShowSelectHeader(!showSelectHeader);
407
+ return filtOption === 'driver_groups' ? setShowSelectHeader(!showSelectHeader) : {};
376
408
  }
377
- }, t('SELECT_DRIVER_GROUP', 'Select a driver group')), showSelectHeader && /*#__PURE__*/_react.default.createElement(_DriverGroupSelectorHeader.DriverGroupSelectHeader, {
409
+ }, filtOption === 'driver_groups' ? t('DRIVER_GROUPS', 'driver groups') : t('DRIVERS', 'drivers')), /*#__PURE__*/_react.default.createElement(_styles.Button, {
410
+ circle: true,
411
+ outline: true,
412
+ color: "primary",
413
+ type: "reset",
414
+ className: "remove_option",
415
+ onClick: function onClick() {
416
+ return handleCloseFiltOption();
417
+ }
418
+ }, /*#__PURE__*/_react.default.createElement(_MdClose.default, null))), /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.ChevronRight, null), (selectedGroup || filtOption === 'drivers') && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, selectedGroup && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", null, selectedGroup === null || selectedGroup === void 0 ? void 0 : selectedGroup.name), /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.ChevronRight, null), /*#__PURE__*/_react.default.createElement("span", null, t('DRIVERS', 'DRIVERS')), /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.ChevronRight, null)), /*#__PURE__*/_react.default.createElement(_DriverMultiSelector.DriverMultiSelector, {
419
+ isSearchByName: true,
420
+ useDriversByProps: selectedGroup,
421
+ drivers: selectedGroup === null || selectedGroup === void 0 ? void 0 : selectedGroup.drivers,
422
+ disableSocketRoomDriver: true,
423
+ useTextStyle: true,
424
+ hideChevronIcon: true,
425
+ autoOpen: filtOption === 'drivers',
426
+ filterValues: filterValues,
427
+ handleChangeDriver: handleChangeDriver,
428
+ andText: t('AND', 'And'),
429
+ textClassnames: "calendar",
430
+ optionsPosition: "left"
431
+ })), showSelectHeader && /*#__PURE__*/_react.default.createElement(_DriverGroupSelectorHeader.DriverGroupSelectHeader, {
378
432
  close: function close() {
379
433
  return setShowSelectHeader(false);
380
434
  },
381
435
  isOpen: showSelectHeader,
382
436
  changeDriverGroupState: changeDriverGroupState
383
- }), /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.ChevronRight, null), /*#__PURE__*/_react.default.createElement("span", {
384
- className: "calendar"
385
- }, t('CALENDAR', 'Calendar')), selectedGroup && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.ChevronRight, null), /*#__PURE__*/_react.default.createElement("span", null, selectedGroup === null || selectedGroup === void 0 ? void 0 : selectedGroup.name)))), (filterValues === null || filterValues === void 0 || (_filterValues$driverI = filterValues.driverIds) === null || _filterValues$driverI === void 0 ? void 0 : _filterValues$driverI.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles2.WarningMessage, null, /*#__PURE__*/_react.default.createElement(_TiWarningOutline.default, null), /*#__PURE__*/_react.default.createElement("span", null, t('WARNING_FILTER_APPLIED', 'Filters applied. You may miss new orders.')), /*#__PURE__*/_react.default.createElement(_styles.LinkButton, {
437
+ }), (filterValues === null || filterValues === void 0 || (_filterValues$driverI = filterValues.driverIds) === null || _filterValues$driverI === void 0 ? void 0 : _filterValues$driverI.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles2.WarningMessage, null, /*#__PURE__*/_react.default.createElement(_TiWarningOutline.default, null), /*#__PURE__*/_react.default.createElement("span", null, t('FILTER_APPLIED', 'Filters applied')), /*#__PURE__*/_react.default.createElement(_styles.LinkButton, {
386
438
  onClick: function onClick() {
387
439
  return handleClearFilters();
388
440
  }
389
- }, t('CLEAR_FILTERS', 'Clear filters'))), /*#__PURE__*/_react.default.createElement(_styles2.DriversGroupCalendarWrapper, null, selectedGroup && /*#__PURE__*/_react.default.createElement(_styles2.WrapperRow, {
390
- wrapperWidth: 400
391
- }, /*#__PURE__*/_react.default.createElement(_styles2.DriverMultiSelectorContainer, null, /*#__PURE__*/_react.default.createElement(_DriverMultiSelector.DriverMultiSelector, {
392
- disableSocketRoomDriver: true,
393
- filterValues: filterValues,
394
- handleChangeDriver: handleChangeDriver
395
- }))), /*#__PURE__*/_react.default.createElement(_AnalyticsCalendar.AnalyticsCalendar, _extends({}, props, {
441
+ }, t('CLEAR_FILTERS', 'Clear filters'))))), /*#__PURE__*/_react.default.createElement(_styles2.DriversGroupCalendarWrapper, null, /*#__PURE__*/_react.default.createElement(_AnalyticsCalendar.AnalyticsCalendar, _extends({}, props, {
396
442
  handleChangeDate: handleChangeDate
397
443
  })))))), /*#__PURE__*/_react.default.createElement(_UserList.DeliveryUsersListing, {
398
444
  date: date,
@@ -494,7 +540,8 @@ var DriversTimeDisplay = exports.DriversTimeDisplay = function DriversTimeDispla
494
540
  initialPage: 1,
495
541
  pageSize: 10,
496
542
  controlType: 'pages'
497
- }
543
+ },
544
+ propsToFetch: ['id', 'enabled', 'name', 'email', 'level', 'lastname', 'delivery_blocks', 'photo']
498
545
  });
499
546
  return /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.CalendarDriversList, driversTimeDisplayProps);
500
547
  };
package/_modules/components/Delivery/DriversTimeDisplay/styles.js CHANGED
@@ -4,10 +4,10 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.WrapperRow = exports.WrapperPagination = exports.WrapperImage = exports.WeekHeader = exports.WeekDayCheckWrapper = exports.WarningMessage = exports.ViewButtonsWrapper = exports.VerifiedItemsContainer = exports.VerifiedItem = exports.UsersTable = exports.UsersListingContainer = exports.UsersConatiner = exports.UsersBottomContainer = exports.UserTypeWrapper = exports.UserTableWrapper = exports.UserRow = exports.UserName = exports.UserMainInfo = exports.UserIdWrapper = exports.UserEnableWrapper = exports.TimeOptions = exports.ThName = exports.ThId = exports.StackedBlock = exports.SplitLine = exports.SpinnerLoaderWrapper = exports.ShowBreakBlocksWrapper = exports.SelectsWrapper = exports.SelectWrapper = exports.SelectTitleWrappre = exports.SelectTitle = exports.RrulesListWrapper = exports.RrulesItem = exports.OrderStatusTypeSelectWrapper = exports.Option = exports.InfoBlock = exports.Image = exports.HoursHeader = exports.HeaderWrapper = exports.HeaderTitleContainer = exports.Header = exports.FormWrapper = exports.FormControl = exports.EventProfessionalPhoto = exports.EventContainer = exports.EmptyBlock = exports.DriversGroupFilterWrapper = exports.DriversGroupCalendarWrapper = exports.DriverMultiSelectorContainer = exports.DriverGroupSelectorWrapper = exports.DriverGroupName = exports.DeleteWrapper = exports.DeleteButtons = exports.DeleteBlock = exports.DateBlockWrapper = exports.Container = exports.ChecksWrapper = exports.CheckBoxWrapper = exports.CalendarLabelContainer = exports.CalendarHeaderContainer = exports.ButtonsWrapper = exports.ButtonWrapper = exports.BlocksWrapper = exports.Block = exports.AnalyticsTimeZoneWrapper = exports.ActionsContainer = void 0;
7
+ exports.WrapperRow = exports.WrapperPagination = exports.WrapperImage = exports.WeekHeader = exports.WeekDayCheckWrapper = exports.WarningMessage = exports.ViewButtonsWrapper = exports.VerifiedItemsContainer = exports.VerifiedItem = exports.UsersTable = exports.UsersListingContainer = exports.UsersConatiner = exports.UsersBottomContainer = exports.UserTypeWrapper = exports.UserTableWrapper = exports.UserRow = exports.UserName = exports.UserMainInfo = exports.UserIdWrapper = exports.UserEnableWrapper = exports.TimeOptions = exports.ThName = exports.ThId = exports.StackedBlock = exports.SplitLine = exports.SpinnerLoaderWrapper = exports.ShowBreakBlocksWrapper = exports.SelectsWrapper = exports.SelectWrapper = exports.SelectTitleWrappre = exports.SelectTitle = exports.RrulesListWrapper = exports.RrulesItem = exports.OrderStatusTypeSelectWrapper = exports.Option = exports.InfoBlock = exports.Image = exports.HoursHeader = exports.HeaderWrapper = exports.HeaderTitleContainer = exports.Header = exports.FormWrapper = exports.FormControl = exports.FiltContainer = exports.EventProfessionalPhoto = exports.EventContainer = exports.EmptyBlock = exports.DriversGroupFilterWrapper = exports.DriversGroupCalendarWrapper = exports.DriverMultiSelectorContainer = exports.DriverGroupSelectorWrapper = exports.DriverGroupName = exports.DeleteWrapper = exports.DeleteButtons = exports.DeleteBlock = exports.DateBlockWrapper = exports.Container = exports.ChecksWrapper = exports.CheckBoxWrapper = exports.CalendarLabelContainer = exports.CalendarHeaderContainer = exports.ButtonsWrapper = exports.ButtonWrapper = exports.BlocksWrapper = exports.Block = exports.AnalyticsTimeZoneWrapper = exports.ActionsContainer = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
10
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47, _templateObject48, _templateObject49, _templateObject50, _templateObject51, _templateObject52, _templateObject53, _templateObject54, _templateObject55, _templateObject56, _templateObject57, _templateObject58, _templateObject59, _templateObject60, _templateObject61, _templateObject62, _templateObject63, _templateObject64, _templateObject65, _templateObject66, _templateObject67, _templateObject68, _templateObject69, _templateObject70, _templateObject71, _templateObject72, _templateObject73, _templateObject74, _templateObject75, _templateObject76, _templateObject77, _templateObject78, _templateObject79, _templateObject80, _templateObject81, _templateObject82, _templateObject83, _templateObject84, _templateObject85, _templateObject86, _templateObject87, _templateObject88, _templateObject89, _templateObject90, _templateObject91, _templateObject92, _templateObject93, _templateObject94, _templateObject95, _templateObject96, _templateObject97, _templateObject98, _templateObject99, _templateObject100, _templateObject101, _templateObject102;
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47, _templateObject48, _templateObject49, _templateObject50, _templateObject51, _templateObject52, _templateObject53, _templateObject54, _templateObject55, _templateObject56, _templateObject57, _templateObject58, _templateObject59, _templateObject60, _templateObject61, _templateObject62, _templateObject63, _templateObject64, _templateObject65, _templateObject66, _templateObject67, _templateObject68, _templateObject69, _templateObject70, _templateObject71, _templateObject72, _templateObject73, _templateObject74, _templateObject75, _templateObject76, _templateObject77, _templateObject78, _templateObject79, _templateObject80, _templateObject81, _templateObject82, _templateObject83, _templateObject84, _templateObject85, _templateObject86, _templateObject87, _templateObject88, _templateObject89, _templateObject90, _templateObject91, _templateObject92, _templateObject93, _templateObject94, _templateObject95, _templateObject96, _templateObject97, _templateObject98, _templateObject99, _templateObject100, _templateObject101, _templateObject102, _templateObject103;
11
11
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
12
12
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
13
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -21,7 +21,7 @@ var HeaderTitleContainer = exports.HeaderTitleContainer = _styledComponents.defa
21
21
  return (_props$theme = props.theme) !== null && _props$theme !== void 0 && _props$theme.rtl ? (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n margin-left: 8px;\n margin-right: -8px;\n "]))) : (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n margin-right: 8px;\n margin-left: -8px;\n "])));
22
22
  });
23
23
  var DriverGroupName = exports.DriverGroupName = _styledComponents.default.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n cursor: pointer;\n"])));
24
- var DriverGroupSelectorWrapper = exports.DriverGroupSelectorWrapper = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n position: relative;\n width: fit-content;\n margin: 3px 0;\n\n > span {\n font-size: 14px;\n color: ", ";\n &.calendar {\n color: ", ";\n }\n }\n\n > svg {\n margin: 0 10px;\n }\n"])), function (props) {
24
+ var DriverGroupSelectorWrapper = exports.DriverGroupSelectorWrapper = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n position: relative;\n width: fit-content;\n margin: 3px 0;\n\n span {\n font-size: 14px;\n color: ", ";\n &.calendar {\n color: ", ";\n }\n }\n\n > svg {\n margin: 0 10px;\n }\n"])), function (props) {
25
25
  return props.theme.colors.secundaryLight;
26
26
  }, function (props) {
27
27
  return props.theme.colors.primary;
@@ -205,13 +205,13 @@ var WrapperRow = exports.WrapperRow = _styledComponents.default.div(_templateObj
205
205
  var isSelectedOrders = _ref4.isSelectedOrders;
206
206
  return isSelectedOrders && (0, _styledComponents.css)(_templateObject95 || (_templateObject95 = _taggedTemplateLiteral(["\n flex-direction: column !important;\n padding: ", ";\n & > div {\n margin-top: 15px;\n }\n "])), !isSelectedOrders && '10px 15px 0 0px');
207
207
  });
208
- var WarningMessage = exports.WarningMessage = _styledComponents.default.div(_templateObject96 || (_templateObject96 = _taggedTemplateLiteral(["\n position: absolute;\n display: flex;\n align-items: center;\n z-index: 100;\n bottom: 20px;\n background: ", ";\n border: 1px solid ", ";\n box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n border-radius: 7.6px;\n padding: 0px 15px;\n box-sizing: border-box;\n margin: 10px 0px 0px 0px !important;\n\n right: 0px;\n ", "\n\n svg {\n font-size: 20px;\n color: ", ";\n }\n\n span {\n font-size: 12px;\n line-height: 18px;\n color: ", ";\n margin: 0 10px;\n flex: 1;\n }\n\n a {\n font-size: 12px;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n padding: 0px 20px;\n font-size: 14px;\n line-height: 24px;\n ", "\n ", "\n ", "\n\n span {\n white-space: nowrap;\n }\n }\n"])), function (props) {
208
+ var WarningMessage = exports.WarningMessage = _styledComponents.default.div(_templateObject96 || (_templateObject96 = _taggedTemplateLiteral(["\n position: absolute;\n display: flex;\n align-items: center;\n z-index: 100;\n bottom: 20px;\n background: ", ";\n border: 1px solid ", ";\n box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n border-radius: 7.6px;\n padding: 0px 15px;\n box-sizing: border-box;\n margin: 10px 0px 0px 0px !important;\n max-width: 250px;\n left: 0px;\n ", "\n\n svg {\n font-size: 20px;\n color: ", ";\n }\n\n span {\n font-size: 12px;\n line-height: 18px;\n color: ", ";\n margin: 0 10px;\n flex: 1;\n }\n\n a {\n font-size: 12px;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n padding: 0px 20px;\n font-size: 14px;\n line-height: 24px;\n ", "\n ", "\n ", "\n\n span {\n white-space: nowrap;\n }\n }\n"])), function (props) {
209
209
  return props.theme.colors.warning100;
210
210
  }, function (props) {
211
211
  return props.theme.colors.warning;
212
212
  }, function (props) {
213
213
  var _props$theme11;
214
- return ((_props$theme11 = props.theme) === null || _props$theme11 === void 0 ? void 0 : _props$theme11.rtl) && (0, _styledComponents.css)(_templateObject97 || (_templateObject97 = _taggedTemplateLiteral(["\n left: 0px;\n right: initial;\n "])));
214
+ return ((_props$theme11 = props.theme) === null || _props$theme11 === void 0 ? void 0 : _props$theme11.rtl) && (0, _styledComponents.css)(_templateObject97 || (_templateObject97 = _taggedTemplateLiteral(["\n right: 0px;\n right: initial;\n "])));
215
215
  }, function (props) {
216
216
  return props.theme.colors.warning;
217
217
  }, function (props) {
@@ -225,4 +225,5 @@ var WarningMessage = exports.WarningMessage = _styledComponents.default.div(_tem
225
225
  }, function (props) {
226
226
  var _props$theme12;
227
227
  return ((_props$theme12 = props.theme) === null || _props$theme12 === void 0 ? void 0 : _props$theme12.rtl) && (0, _styledComponents.css)(_templateObject102 || (_templateObject102 = _taggedTemplateLiteral(["\n left: 0px;\n right: initial;\n "])));
228
- });
228
+ });
229
+ var FiltContainer = exports.FiltContainer = _styledComponents.default.div(_templateObject103 || (_templateObject103 = _taggedTemplateLiteral(["\n display: inline-block;\n position: relative;\n button {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n background: transparent;\n width: 20px;\n height: 20px;\n transform: translate(140%, -50%);\n top: 5px;\n right: 10px;\n }\n"])));
package/_modules/components/Orders/DriverMultiSelector/index.js CHANGED
@@ -25,13 +25,24 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
25
25
  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; } }
26
26
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
27
27
  var DriverMultiSelectorUI = function DriverMultiSelectorUI(props) {
28
- var _dictionary$LOADING, _dictionary$SELECT_DR2;
28
+ var _dictionary$LOADING, _dictionary$LOADING2, _dictionary$SELECT_DR3;
29
29
  var driversList = props.driversList,
30
30
  defaultValue = props.defaultValue,
31
31
  small = props.small,
32
32
  padding = props.padding,
33
33
  handleChangeDriver = props.handleChangeDriver,
34
- filterValues = props.filterValues;
34
+ filterValues = props.filterValues,
35
+ useTextStyle = props.useTextStyle,
36
+ hideChevronIcon = props.hideChevronIcon,
37
+ andText = props.andText,
38
+ textClassnames = props.textClassnames,
39
+ pagination = props.pagination,
40
+ handleChangePage = props.handleChangePage,
41
+ handleChangePageSize = props.handleChangePageSize,
42
+ useDriversByProps = props.useDriversByProps,
43
+ setSearchValue = props.setSearchValue,
44
+ searchValue = props.searchValue,
45
+ optionsPosition = props.optionsPosition;
35
46
  var _useLanguage = (0, _orderingComponentsAdminExternal.useLanguage)(),
36
47
  _useLanguage2 = _slicedToArray(_useLanguage, 1),
37
48
  dictionary = _useLanguage2[0].dictionary;
@@ -40,25 +51,23 @@ var DriverMultiSelectorUI = function DriverMultiSelectorUI(props) {
40
51
  _useState2 = _slicedToArray(_useState, 2),
41
52
  driversMultiOptionList = _useState2[0],
42
53
  setDriversMultiOptionList = _useState2[1];
43
- var _useState3 = (0, _react.useState)(null),
44
- _useState4 = _slicedToArray(_useState3, 2),
45
- searchValue = _useState4[0],
46
- setSearchValue = _useState4[1];
47
54
  var driversLoading = [{
48
55
  value: 'default',
49
56
  content: /*#__PURE__*/_react.default.createElement(_styles.Option, {
50
57
  small: small
51
- }, (_dictionary$LOADING = dictionary === null || dictionary === void 0 ? void 0 : dictionary.LOADING) !== null && _dictionary$LOADING !== void 0 ? _dictionary$LOADING : 'loading', "...")
58
+ }, (_dictionary$LOADING = dictionary === null || dictionary === void 0 ? void 0 : dictionary.LOADING) !== null && _dictionary$LOADING !== void 0 ? _dictionary$LOADING : 'loading', "..."),
59
+ showOnSelected: useTextStyle ? (_dictionary$LOADING2 = dictionary === null || dictionary === void 0 ? void 0 : dictionary.LOADING) !== null && _dictionary$LOADING2 !== void 0 ? _dictionary$LOADING2 : 'loading' : null
52
60
  }];
53
61
  (0, _react.useEffect)(function () {
54
- var _dictionary$SELECT_DR;
62
+ var _dictionary$SELECT_DR, _dictionary$SELECT_DR2;
55
63
  var _driversOptionList = [{
56
64
  value: 'default',
57
65
  content: /*#__PURE__*/_react.default.createElement(_styles.Option, {
58
66
  padding: "0px"
59
67
  }, /*#__PURE__*/_react.default.createElement("span", null, (_dictionary$SELECT_DR = dictionary === null || dictionary === void 0 ? void 0 : dictionary.SELECT_DRIVER) !== null && _dictionary$SELECT_DR !== void 0 ? _dictionary$SELECT_DR : 'Select driver')),
60
68
  color: 'primary',
61
- showDisable: true
69
+ showDisable: true,
70
+ showOnSelected: useTextStyle ? (_dictionary$SELECT_DR2 = dictionary === null || dictionary === void 0 ? void 0 : dictionary.SELECT_DRIVER) !== null && _dictionary$SELECT_DR2 !== void 0 ? _dictionary$SELECT_DR2 : 'Select driver' : null
62
71
  }];
63
72
  if (!driversList.loading) {
64
73
  var _driverList;
@@ -89,7 +98,8 @@ var DriverMultiSelectorUI = function DriverMultiSelectorUI(props) {
89
98
  small: small
90
99
  }, driver.name, " ", driver.lastname), /*#__PURE__*/_react.default.createElement(_styles.DriverText, {
91
100
  small: small
92
- }, (_dictionary$DRIVER = dictionary === null || dictionary === void 0 ? void 0 : dictionary.DRIVER) !== null && _dictionary$DRIVER !== void 0 ? _dictionary$DRIVER : 'Driver'))))
101
+ }, (_dictionary$DRIVER = dictionary === null || dictionary === void 0 ? void 0 : dictionary.DRIVER) !== null && _dictionary$DRIVER !== void 0 ? _dictionary$DRIVER : 'Driver')))),
102
+ showOnSelected: useTextStyle ? driver.name : null
93
103
  };
94
104
  });
95
105
  setDriversMultiOptionList(_driversOptionListTemp);
@@ -107,24 +117,39 @@ var DriverMultiSelectorUI = function DriverMultiSelectorUI(props) {
107
117
  }
108
118
  }
109
119
  }, [driversList, defaultValue, searchValue]);
110
- var Placeholder = /*#__PURE__*/_react.default.createElement(_styles.PlaceholderTitle, null, (_dictionary$SELECT_DR2 = dictionary === null || dictionary === void 0 ? void 0 : dictionary.SELECT_DRIVER) !== null && _dictionary$SELECT_DR2 !== void 0 ? _dictionary$SELECT_DR2 : 'Select driver');
111
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !driversList.loading ? /*#__PURE__*/_react.default.createElement(_MultiSelect.MultiSelect, {
112
- defaultValue: filterValues.driverIds,
120
+ var Placeholder = /*#__PURE__*/_react.default.createElement(_styles.PlaceholderTitle, null, (_dictionary$SELECT_DR3 = dictionary === null || dictionary === void 0 ? void 0 : dictionary.SELECT_DRIVER) !== null && _dictionary$SELECT_DR3 !== void 0 ? _dictionary$SELECT_DR3 : 'Select driver');
121
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !driversList.loading || !useDriversByProps && pagination ? /*#__PURE__*/_react.default.createElement(_MultiSelect.MultiSelect, {
122
+ isLoading: driversList.loading,
123
+ useLazyPagination: !useDriversByProps,
124
+ searchBarIsNotLazyLoad: useDriversByProps,
125
+ useTextStyle: useTextStyle,
126
+ hideChevronIcon: hideChevronIcon,
127
+ andText: andText,
128
+ textClassnames: textClassnames,
129
+ defaultValue: driversList.loading && !useDriversByProps ? 'loading' : filterValues.driverIds,
113
130
  placeholder: Placeholder,
114
- options: driversMultiOptionList,
131
+ options: driversList.loading && !useDriversByProps ? driversLoading : driversMultiOptionList,
115
132
  optionInnerMargin: "10px",
116
133
  optionInnerMaxHeight: "150px",
134
+ optionsPosition: optionsPosition,
117
135
  onChange: function onChange(driver) {
118
136
  return handleChangeDriver(driver);
119
137
  },
120
138
  isShowSearchBar: true,
121
139
  searchBarIsCustomLayout: true,
122
- searchBarIsNotLazyLoad: true,
123
140
  searchValue: searchValue,
124
141
  handleChangeSearch: function handleChangeSearch(val) {
125
142
  return setSearchValue(val);
126
- }
143
+ },
144
+ pagination: pagination,
145
+ handleChangePage: handleChangePage,
146
+ handleChangePageSize: handleChangePageSize
127
147
  }) : /*#__PURE__*/_react.default.createElement(_MultiSelect.MultiSelect, {
148
+ searchBarIsNotLazyLoad: useDriversByProps,
149
+ useTextStyle: useTextStyle,
150
+ hideChevronIcon: hideChevronIcon,
151
+ andText: andText,
152
+ textClassnames: textClassnames,
128
153
  defaultValue: "default",
129
154
  options: driversLoading,
130
155
  optionInnerMargin: "10px",
@@ -132,7 +157,6 @@ var DriverMultiSelectorUI = function DriverMultiSelectorUI(props) {
132
157
  className: "driver-select",
133
158
  isShowSearchBar: true,
134
159
  searchBarIsCustomLayout: true,
135
- searchBarIsNotLazyLoad: true,
136
160
  searchValue: searchValue,
137
161
  handleChangeSearch: function handleChangeSearch(val) {
138
162
  return setSearchValue(val);
@@ -142,6 +166,11 @@ var DriverMultiSelectorUI = function DriverMultiSelectorUI(props) {
142
166
  var DriverMultiSelector = exports.DriverMultiSelector = function DriverMultiSelector(props) {
143
167
  var DriversControlProps = _objectSpread(_objectSpread({}, props), {}, {
144
168
  UIComponent: DriverMultiSelectorUI,
169
+ paginationSettings: {
170
+ initialPage: 1,
171
+ pageSize: 10,
172
+ controlType: 'pages'
173
+ },
145
174
  propsToFetch: ['id', 'name', 'lastname', 'cellphone', 'photo']
146
175
  });
147
176
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_orderingComponentsAdminExternal.DriversList, DriversControlProps));