ordering-ui-external 1.5.0 → 1.5.1

package/_modules/themes/five/src/components/OrderDetails/index.js

@@ -9,6 +9,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactLoadingSkeleton = _interopRequireDefault(require("react-loading-skeleton"));
 var _orderingComponentsExternal = require("ordering-components-external");
 var _RiUser2Fill = _interopRequireDefault(require("@meronex/icons/ri/RiUser2Fill"));
+var _FaUserAlt = _interopRequireDefault(require("@meronex/icons/fa/FaUserAlt"));
 var _Buttons = require("../../styles/Buttons");
 var _NotFoundSource = require("../NotFoundSource");
 var _ProductItemAccordion = require("../ProductItemAccordion");
@@ -33,6 +34,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -46,7 +51,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var OrderDetailsUI = function OrderDetailsUI(props) {
-  var _configs$google_maps_, _orderingTheme$theme, _orderingTheme$theme$, _orderingTheme$theme$2, _orderingTheme$theme$3, _orderingTheme$theme2, _orderingTheme$theme3, _orderingTheme$theme4, _orderingTheme$theme5, _orderingTheme$theme6, _orderingTheme$theme7, _orderingTheme$theme8, _orderingTheme$theme9, _orderingTheme$theme10, _orderingTheme$theme11, _orderingTheme$theme12, _orderingTheme$theme13, _orderingTheme$theme14, _orderingTheme$theme15, _orderingTheme$theme16, _orderingTheme$theme17, _orderingTheme$theme18, _orderingTheme$theme19, _orderingTheme$theme20, _orderingTheme$theme21, _orderingTheme$theme22, _orderingTheme$theme23, _orderingTheme$theme24, _orderingTheme$theme25, _orderingTheme$theme26, _orderingTheme$theme27, _orderingTheme$theme28, _orderingTheme$theme29, _orderingTheme$theme30, _orderingTheme$theme31, _orderingTheme$theme32, _orderingTheme$theme33, _orderingTheme$theme34, _orderingTheme$theme35, _orderingTheme$theme36, _orderingTheme$theme37, _orderingTheme$theme38, _orderingTheme$theme39, _orderingTheme$theme40, _orderingTheme$theme41, _orderingTheme$theme42, _orderingTheme$theme43, _orderingTheme$theme44, _orderingTheme$theme45, _orderingTheme$theme46, _orderingTheme$theme47, _orderingTheme$theme48, _orderingTheme$theme49, _orderingTheme$theme50, _orderingTheme$theme51, _orderingTheme$theme52, _orderingTheme$theme53, _orderingTheme$theme54, _orderingTheme$theme55, _orderingTheme$theme56, _orderingTheme$theme57, _orderingTheme$theme58, _orderingTheme$theme59, _orderingTheme$theme60, _orderingTheme$theme61, _orderingTheme$theme62, _orderingTheme$theme63, _orderingTheme$theme64, _orderingTheme$theme65, _orderingTheme$theme66, _orderingTheme$theme67, _orderingTheme$theme68, _orderingTheme$theme69, _orderingTheme$theme70, _orderingTheme$theme71, _orderingTheme$theme72, _orderingTheme$theme73, _orderingTheme$theme74, _orderingTheme$theme75, _orderingTheme$theme76, _orderingTheme$theme77, _orderingTheme$theme78, _orderingTheme$theme79, _orderingTheme$theme80, _orderingTheme$theme81, _orderingTheme$theme82, _orderingTheme$theme83, _orderingTheme$theme84, _orderingTheme$theme85, _orderingTheme$theme86, _orderingTheme$theme87, _orderingTheme$theme88, _orderingTheme$theme89, _orderingTheme$theme90, _orderingTheme$theme91, _orderingTheme$theme92, _orderingTheme$theme93, _orderingTheme$theme94, _orderingTheme$theme95, _orderingTheme$theme96, _orderingTheme$theme97, _order$driver, _order$driver2, _theme$images, _theme$images$dummies, _order$business2, _order$business3, _theme$images2, _theme$images2$dummie, _order$customer, _order$customer2, _theme$images3, _theme$images3$dummie, _theme$defaultLanguag28, _configs$guest_uuid_a, _orderTypes$find, _getOrderStatus, _getOrderStatus2, _theme$defaultLanguag29, _order$business4, _order$business5, _order$business6, _order$business7, _order$business8, _order$place, _order$place2, _getOrderStatus3, _getOrderStatus4, _order$business9, _order$customer3, _order$customer4, _order$customer5, _order$customer6, _order$customer7, _order$customer8, _order$customer9, _order$customer10, _theme$defaultLanguag30, _order$driver4, _order$driver5, _order$driver6, _order$driver7, _order$driver8, _order$driver9, _order$driver10, _order$products, _theme$defaultLanguag31, _theme$defaultLanguag32, _theme$defaultLanguag33, _openTaxModal$data, _openTaxModal$data2, _openTaxModal$data3, _openTaxModal$data4, _openTaxModal$data$fi, _openTaxModal$data5, _openTaxModal$data6;
+  var _configs$google_maps_, _orderingTheme$theme, _orderingTheme$theme$, _orderingTheme$theme$2, _orderingTheme$theme$3, _orderingTheme$theme2, _orderingTheme$theme3, _orderingTheme$theme4, _orderingTheme$theme5, _orderingTheme$theme6, _orderingTheme$theme7, _orderingTheme$theme8, _orderingTheme$theme9, _orderingTheme$theme10, _orderingTheme$theme11, _orderingTheme$theme12, _orderingTheme$theme13, _orderingTheme$theme14, _orderingTheme$theme15, _orderingTheme$theme16, _orderingTheme$theme17, _orderingTheme$theme18, _orderingTheme$theme19, _orderingTheme$theme20, _orderingTheme$theme21, _orderingTheme$theme22, _orderingTheme$theme23, _orderingTheme$theme24, _orderingTheme$theme25, _orderingTheme$theme26, _orderingTheme$theme27, _orderingTheme$theme28, _orderingTheme$theme29, _orderingTheme$theme30, _orderingTheme$theme31, _orderingTheme$theme32, _orderingTheme$theme33, _orderingTheme$theme34, _orderingTheme$theme35, _orderingTheme$theme36, _orderingTheme$theme37, _orderingTheme$theme38, _orderingTheme$theme39, _orderingTheme$theme40, _orderingTheme$theme41, _orderingTheme$theme42, _orderingTheme$theme43, _orderingTheme$theme44, _orderingTheme$theme45, _orderingTheme$theme46, _orderingTheme$theme47, _orderingTheme$theme48, _orderingTheme$theme49, _orderingTheme$theme50, _orderingTheme$theme51, _orderingTheme$theme52, _orderingTheme$theme53, _orderingTheme$theme54, _orderingTheme$theme55, _orderingTheme$theme56, _orderingTheme$theme57, _orderingTheme$theme58, _orderingTheme$theme59, _orderingTheme$theme60, _orderingTheme$theme61, _orderingTheme$theme62, _orderingTheme$theme63, _orderingTheme$theme64, _orderingTheme$theme65, _orderingTheme$theme66, _orderingTheme$theme67, _orderingTheme$theme68, _orderingTheme$theme69, _orderingTheme$theme70, _orderingTheme$theme71, _orderingTheme$theme72, _orderingTheme$theme73, _orderingTheme$theme74, _orderingTheme$theme75, _orderingTheme$theme76, _orderingTheme$theme77, _orderingTheme$theme78, _orderingTheme$theme79, _orderingTheme$theme80, _orderingTheme$theme81, _orderingTheme$theme82, _orderingTheme$theme83, _orderingTheme$theme84, _orderingTheme$theme85, _orderingTheme$theme86, _orderingTheme$theme87, _orderingTheme$theme88, _orderingTheme$theme89, _orderingTheme$theme90, _orderingTheme$theme91, _orderingTheme$theme92, _orderingTheme$theme93, _orderingTheme$theme94, _orderingTheme$theme95, _orderingTheme$theme96, _orderingTheme$theme97, _order$driver, _order$driver2, _theme$images, _theme$images$dummies, _order$business2, _order$business3, _theme$images2, _theme$images2$dummie, _order$customer, _order$customer2, _theme$images3, _theme$images3$dummie, _theme$defaultLanguag28, _configs$guest_uuid_a, _orderTypes$find, _getOrderStatus, _getOrderStatus2, _theme$defaultLanguag29, _order$business4, _order$business5, _order$business6, _order$business7, _order$business8, _order$place, _order$place2, _getOrderStatus3, _getOrderStatus4, _order$business9, _order$customer3, _order$customer4, _order$customer5, _order$customer6, _order$customer7, _order$customer8, _order$customer9, _order$customer10, _theme$defaultLanguag30, _order$driver4, _order$driver5, _order$driver6, _order$driver7, _order$driver8, _order$driver9, _order$driver10, _theme$defaultLanguag31, _theme$defaultLanguag32, _theme$defaultLanguag33, _openTaxModal$data, _openTaxModal$data2, _openTaxModal$data3, _openTaxModal$data4, _openTaxModal$data$fi, _openTaxModal$data5, _openTaxModal$data6;
   var userCustomerId = props.userCustomerId,
     handleChangeOrderStatus = props.handleChangeOrderStatus,
     handleBusinessRedirect = props.handleBusinessRedirect,
@@ -502,6 +507,45 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
     }));
     handleReorder(order.id);
   };
+  var getProductList = function getProductList() {
+    var professionalList = order === null || order === void 0 ? void 0 : order.products.reduce(function (prev, current) {
+      var _current$calendar_eve3;
+      var found = prev.find(function (item) {
+        var _current$calendar_eve, _current$calendar_eve2;
+        return item.id === (current === null || current === void 0 ? void 0 : (_current$calendar_eve = current.calendar_event) === null || _current$calendar_eve === void 0 ? void 0 : (_current$calendar_eve2 = _current$calendar_eve.professional) === null || _current$calendar_eve2 === void 0 ? void 0 : _current$calendar_eve2.id);
+      });
+      if (found || !(current !== null && current !== void 0 && current.calendar_event)) {
+        return prev;
+      }
+      return [].concat(_toConsumableArray(prev), [current === null || current === void 0 ? void 0 : (_current$calendar_eve3 = current.calendar_event) === null || _current$calendar_eve3 === void 0 ? void 0 : _current$calendar_eve3.professional]);
+    }, []);
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (professionalList === null || professionalList === void 0 ? void 0 : professionalList.length) > 0 && professionalList.map(function (professional, i) {
+      return /*#__PURE__*/_react.default.createElement(_styles.ProfessionalBlock, {
+        key: i
+      }, /*#__PURE__*/_react.default.createElement(_styles.ProfessionalWrapper, null, professional !== null && professional !== void 0 && professional.photo ? /*#__PURE__*/_react.default.createElement("img", {
+        src: professional === null || professional === void 0 ? void 0 : professional.photo,
+        alt: ""
+      }) : /*#__PURE__*/_react.default.createElement(_FaUserAlt.default, null), /*#__PURE__*/_react.default.createElement("p", null, professional === null || professional === void 0 ? void 0 : professional.name, " ", professional === null || professional === void 0 ? void 0 : professional.lastname)), order === null || order === void 0 ? void 0 : order.products.filter(function (product) {
+        var _product$calendar_eve, _product$calendar_eve2;
+        return (product === null || product === void 0 ? void 0 : (_product$calendar_eve = product.calendar_event) === null || _product$calendar_eve === void 0 ? void 0 : (_product$calendar_eve2 = _product$calendar_eve.professional) === null || _product$calendar_eve2 === void 0 ? void 0 : _product$calendar_eve2.id) === (professional === null || professional === void 0 ? void 0 : professional.id);
+      }).map(function (product) {
+        return /*#__PURE__*/_react.default.createElement(_ProductItemAccordion.ProductItemAccordion, {
+          key: product.id,
+          product: product
+        });
+      }));
+    }), order === null || order === void 0 ? void 0 : order.products.filter(function (product) {
+      return !(product !== null && product !== void 0 && product.calendar_event);
+    }).map(function (product) {
+      return /*#__PURE__*/_react.default.createElement(_ProductItemAccordion.ProductItemAccordion, {
+        key: product.id,
+        product: product
+      });
+    }));
+  };
+  var sortedProductList = (0, _react.useMemo)(function () {
+    return getProductList();
+  }, [order === null || order === void 0 ? void 0 : order.products]);
   var ActionsSectionProps = {
     order: order,
     handleBusinessRedirect: handleBusinessRedirect,
@@ -710,12 +754,7 @@ var OrderDetailsUI = function OrderDetailsUI(props) {
   }) : /*#__PURE__*/_react.default.createElement(_RiUser2Fill.default, null)), /*#__PURE__*/_react.default.createElement("div", null, showDriverName && /*#__PURE__*/_react.default.createElement("h2", null, order === null || order === void 0 ? void 0 : (_order$driver6 = order.driver) === null || _order$driver6 === void 0 ? void 0 : _order$driver6.name, " ", order === null || order === void 0 ? void 0 : (_order$driver7 = order.driver) === null || _order$driver7 === void 0 ? void 0 : _order$driver7.lastname), showDriverEmail && /*#__PURE__*/_react.default.createElement("p", null, order === null || order === void 0 ? void 0 : (_order$driver8 = order.driver) === null || _order$driver8 === void 0 ? void 0 : _order$driver8.email), showDriverPhone && /*#__PURE__*/_react.default.createElement("p", null, (order === null || order === void 0 ? void 0 : (_order$driver9 = order.driver) === null || _order$driver9 === void 0 ? void 0 : _order$driver9.cellphone) || (order === null || order === void 0 ? void 0 : (_order$driver10 = order.driver) === null || _order$driver10 === void 0 ? void 0 : _order$driver10.phone))))), !isOriginalLayout && /*#__PURE__*/_react.default.createElement(OrderMapSection, null)), ((order === null || order === void 0 ? void 0 : order.delivery_type) === 1 || (order === null || order === void 0 ? void 0 : order.comment)) && /*#__PURE__*/_react.default.createElement(_styles.OrderPreferences, null, /*#__PURE__*/_react.default.createElement(_OrderPreferencesSections.OrderPreferencesSection, {
     order: order,
     placeSpotTypes: placeSpotTypes
-  }))), /*#__PURE__*/_react.default.createElement(_styles.WrapperRightContainer, null, /*#__PURE__*/_react.default.createElement(_styles.OrderProducts, null, /*#__PURE__*/_react.default.createElement(_styles.HeaderTitle, null, /*#__PURE__*/_react.default.createElement(OrderHeaderInfoSection, null), /*#__PURE__*/_react.default.createElement(OrderActionsSection, null)), (order === null || order === void 0 ? void 0 : (_order$products = order.products) === null || _order$products === void 0 ? void 0 : _order$products.length) && (order === null || order === void 0 ? void 0 : order.products.map(function (product) {
-    return /*#__PURE__*/_react.default.createElement(_ProductItemAccordion.ProductItemAccordion, {
-      key: product.id,
-      product: product
-    });
-  })), /*#__PURE__*/_react.default.createElement(_OrderBillSection.OrderBillSection, {
+  }))), /*#__PURE__*/_react.default.createElement(_styles.WrapperRightContainer, null, /*#__PURE__*/_react.default.createElement(_styles.OrderProducts, null, /*#__PURE__*/_react.default.createElement(_styles.HeaderTitle, null, /*#__PURE__*/_react.default.createElement(OrderHeaderInfoSection, null), /*#__PURE__*/_react.default.createElement(OrderActionsSection, null)), sortedProductList, /*#__PURE__*/_react.default.createElement(_OrderBillSection.OrderBillSection, {
     order: order,
     setOpenTaxModal: setOpenTaxModal
   })))), (openMessages.driver || openMessages.business) && /*#__PURE__*/_react.default.createElement(_Messages.Messages, {

package/_modules/themes/five/src/components/OrderDetails/styles.js

@@ -4,10 +4,10 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.WrapperRightContainer = exports.WrapperLeftContainer = exports.WrapperDriver = exports.WrapperContainer = exports.TitleContainer = exports.StatusBar = exports.SkeletonWrapper = exports.SkeletonBlockWrapp = exports.SkeletonBlock = exports.ShareOrder = exports.SectionTitleContainer = exports.SectionTitle = exports.ReviewWrapper = exports.ReviewOrderLink = exports.ReOrder = exports.PlaceSpotSection = exports.PhotoBlock = exports.OrderStatusAndLinkContainer = exports.OrderProducts = exports.OrderPreferences = exports.OrderInfo = exports.OrderIdSec = exports.OrderHistoryContainer = exports.OrderDriver = exports.OrderCustomer = exports.OrderBusiness = exports.OrderBill = exports.OrderActions = exports.NewOrder = exports.MyOrderActions = exports.MessagesIcon = exports.MapWrapper = exports.Map = exports.LinkWrapper = exports.HistoryItemWrapper = exports.HeaderTitle = exports.HeaderInfo = exports.ExclamationWrapper = exports.Exclamation = exports.Divider = exports.DetailWrapper = exports.Content = exports.Container = exports.CommentContainer = exports.ButtonWrapper = exports.BusinessWrapper = exports.BusinessTitle = exports.BusinessInfo = exports.BusinessExternalWrapper = exports.BtsOrderStatus = exports.ActionsBlock = void 0;
+exports.WrapperRightContainer = exports.WrapperLeftContainer = exports.WrapperDriver = exports.WrapperContainer = exports.TitleContainer = exports.StatusBar = exports.SkeletonWrapper = exports.SkeletonBlockWrapp = exports.SkeletonBlock = exports.ShareOrder = exports.SectionTitleContainer = exports.SectionTitle = exports.ReviewWrapper = exports.ReviewOrderLink = exports.ReOrder = exports.ProfessionalWrapper = exports.ProfessionalBlock = exports.PlaceSpotSection = exports.PhotoBlock = exports.OrderStatusAndLinkContainer = exports.OrderProducts = exports.OrderPreferences = exports.OrderInfo = exports.OrderIdSec = exports.OrderHistoryContainer = exports.OrderDriver = exports.OrderCustomer = exports.OrderBusiness = exports.OrderBill = exports.OrderActions = exports.NewOrder = exports.MyOrderActions = exports.MessagesIcon = exports.MapWrapper = exports.Map = exports.LinkWrapper = exports.HistoryItemWrapper = exports.HeaderTitle = exports.HeaderInfo = exports.ExclamationWrapper = exports.Exclamation = exports.Divider = exports.DetailWrapper = exports.Content = exports.Container = exports.CommentContainer = exports.ButtonWrapper = exports.BusinessWrapper = exports.BusinessTitle = exports.BusinessInfo = exports.BusinessExternalWrapper = exports.BtsOrderStatus = exports.ActionsBlock = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _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;
+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;
 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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -174,4 +174,12 @@ exports.ButtonWrapper = ButtonWrapper;
 var MapWrapper = _styledComponents.default.div(_templateObject61 || (_templateObject61 = _taggedTemplateLiteral(["\n  width: 100%;\n  margin-top: 20px;\n\n  @media (min-width: 769px) {\n    width: 50%;\n    margin-top: 0px;\n  }\n"])));
 exports.MapWrapper = MapWrapper;
 var BusinessExternalWrapper = _styledComponents.default.div(_templateObject62 || (_templateObject62 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n\n  @media (min-width: 769px) {\n    width: 50%;\n  }\n"])));
-exports.BusinessExternalWrapper = BusinessExternalWrapper;
+exports.BusinessExternalWrapper = BusinessExternalWrapper;
+var ProfessionalWrapper = _styledComponents.default.div(_templateObject63 || (_templateObject63 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  margin: 0px 10px 10px 10px;\n\n  > img {\n    width: 55px;\n    height: 55px;\n    min-width: 55px;\n    border-radius: 8px;\n    object-fit: cover;\n  }\n\n  > svg {\n    width: 55px;\n    height: 55px;\n    min-width: 55px;\n  }\n\n  > p {\n    font-weight: 600;\n    font-size: 17px;\n    line-height: 26px;\n    margin-left: 14px;\n\n    ", "\n  }\n\n  @media (min-width: 411px) {\n    > img {\n      width: 65px;\n      height: 65px;\n      min-width: 65px;\n    }\n    > svg {\n      width: 65px;\n      height: 65px;\n      min-width: 65px;\n    }\n  }\n"])), function (props) {
+  return props.theme.rtl && (0, _styledComponents.css)(_templateObject64 || (_templateObject64 = _taggedTemplateLiteral(["\n      margin-left: 0px;\n      margin-right: 14px;\n    "])));
+});
+exports.ProfessionalWrapper = ProfessionalWrapper;
+var ProfessionalBlock = _styledComponents.default.div(_templateObject65 || (_templateObject65 = _taggedTemplateLiteral(["\n  border-bottom: 1px solid ", ";\n  margin-bottom: 15px;\n"])), function (props) {
+  return props.theme.colors.disabled;
+});
+exports.ProfessionalBlock = ProfessionalBlock;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ordering-ui-external",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "Ordering UI Components",
   "main": "./_modules/index.js",
   "exports": {

package/src/themes/five/src/components/OrderDetails/index.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useMemo } from 'react'
 import Skeleton from 'react-loading-skeleton'
 import {
   useLanguage,
@@ -12,6 +12,7 @@ import {
   useOrderingTheme
 } from 'ordering-components-external'
 import RiUser2Fill from '@meronex/icons/ri/RiUser2Fill'
+import FaUserAlt from '@meronex/icons/fa/FaUserAlt'
 
 import { Button } from '../../styles/Buttons'
 import { NotFoundSource } from '../NotFoundSource'
@@ -65,7 +66,9 @@ import {
   OrderStatusAndLinkContainer,
   LinkWrapper,
   MapWrapper,
-  BusinessExternalWrapper
+  BusinessExternalWrapper,
+  ProfessionalWrapper,
+  ProfessionalBlock
 } from './styles'
 import { useTheme } from 'styled-components'
 import { TaxInformation } from '../TaxInformation'
@@ -285,6 +288,45 @@ const OrderDetailsUI = (props) => {
     handleReorder(order.id)
   }
 
+  const getProductList = () => {
+    const professionalList = order?.products.reduce((prev, current) => {
+      const found = prev.find(item => item.id === current?.calendar_event?.professional?.id)
+      if (found || !current?.calendar_event) {
+        return prev
+      }
+      return [...prev, current?.calendar_event?.professional]
+    }, [])
+
+    return (
+      <>
+        {professionalList?.length > 0 && professionalList.map((professional, i) => (
+          <ProfessionalBlock key={i}>
+            <ProfessionalWrapper>
+              {professional?.photo
+                ? <img src={professional?.photo} alt='' />
+                : <FaUserAlt />}
+              <p>{professional?.name} {professional?.lastname}</p>
+            </ProfessionalWrapper>
+            {order?.products.filter(product => product?.calendar_event?.professional?.id === professional?.id).map(product => (
+              <ProductItemAccordion
+                key={product.id}
+                product={product}
+              />
+            ))}
+          </ProfessionalBlock>
+        ))}
+        {order?.products.filter(product => !product?.calendar_event).map(product => (
+          <ProductItemAccordion
+            key={product.id}
+            product={product}
+          />
+        ))}
+      </>
+    )
+  }
+
+  const sortedProductList = useMemo(() => getProductList(), [order?.products])
+
   const ActionsSectionProps = {
     order,
     handleBusinessRedirect,
@@ -661,12 +703,7 @@ const OrderDetailsUI = (props) => {
                 <OrderHeaderInfoSection />
                 <OrderActionsSection />
               </HeaderTitle>
-              {order?.products?.length && order?.products.map(product => (
-                <ProductItemAccordion
-                  key={product.id}
-                  product={product}
-                />
-              ))}
+              {sortedProductList}
               <OrderBillSection
                 order={order}
                 setOpenTaxModal={setOpenTaxModal}

package/src/themes/five/src/components/OrderDetails/styles.js

@@ -737,3 +737,53 @@ export const BusinessExternalWrapper = styled.div`
     width: 50%;
   }
 `
+
+export const ProfessionalWrapper = styled.div`
+  display: flex;
+  align-items: center;
+  margin: 0px 10px 10px 10px;
+
+  > img {
+    width: 55px;
+    height: 55px;
+    min-width: 55px;
+    border-radius: 8px;
+    object-fit: cover;
+  }
+
+  > svg {
+    width: 55px;
+    height: 55px;
+    min-width: 55px;
+  }
+
+  > p {
+    font-weight: 600;
+    font-size: 17px;
+    line-height: 26px;
+    margin-left: 14px;
+
+    ${props => props.theme.rtl && css`
+      margin-left: 0px;
+      margin-right: 14px;
+    `}
+  }
+
+  @media (min-width: 411px) {
+    > img {
+      width: 65px;
+      height: 65px;
+      min-width: 65px;
+    }
+    > svg {
+      width: 65px;
+      height: 65px;
+      min-width: 65px;
+    }
+  }
+`
+
+export const ProfessionalBlock = styled.div`
+  border-bottom: 1px solid ${props => props.theme.colors.disabled};
+  margin-bottom: 15px;
+`