ordering-ui-external 14.1.49 → 14.1.52

package/_modules/themes/five/src/components/BusinessesListing/franchises/OloBusinessesListing/styles.js

@@ -0,0 +1,89 @@
+"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.WrapperMap = exports.WrapInput = exports.ViewLocations = exports.TypesContainer = exports.TypeButton = exports.Title = exports.Subtitle = exports.Separator = exports.PreviousOrders = exports.PaginationContainer = exports.LoadMoreButtonCityWrap = exports.IconTypeButton = exports.HightestRatedWrapper = exports.HeaderSearchMode = exports.ErrorMessage = exports.Divider = exports.CityContainer = exports.CitiesContainer = exports.BusinessSearch = exports.BusinessListContainer = exports.BusinessList = exports.BusinessContainer = exports.AddressFormWrapper = exports.AdditionalTypesWrapper = exports.AdditionalTypesContainer = void 0;
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _react = _interopRequireDefault(require("react"));
+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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+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 && {}.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; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var BusinessContainer = exports.BusinessContainer = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  height: 100%;\n"])));
+var BusinessSearch = exports.BusinessSearch = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    display: flex;\n    background-color: #f8f9fa;\n    align-items: center;\n    padding: 7px;\n    border-radius: 7px;\n    font-size: 11px;\n    svg {\n      font-size: 15px;\n    }\n"])));
+var BusinessList = exports.BusinessList = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-wrap: wrap;\n"])));
+var ErrorMessage = exports.ErrorMessage = _styledComponents.default.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  padding: 20px;\n  width: 100%;\n  background-color: #CCCCCC;\n  margin: 0px 15px;\n  color: #D81313;\n  font-weight: bold;\n"])));
+var PreviousOrders = exports.PreviousOrders = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-wrap: wrap;\n  margin: 10px 20px 0px;\n"])));
+var HightestRatedWrapper = exports.HightestRatedWrapper = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  padding: 50px 0 30px 0;\n"])));
+var Divider = exports.Divider = _styledComponents.default.div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  background: rgb(230, 234, 233);\n  height: 8px;\n  width: 100%;\n"])));
+var HeaderSearchMode = exports.HeaderSearchMode = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  position: absolute;\n  width: 200px;\n"])));
+var AddressFormWrapper = exports.AddressFormWrapper = _styledComponents.default.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  @media (min-width: 450px) {\n    margin-top: 20px;\n  }\n"])));
+var IconTypeButton = exports.IconTypeButton = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 44px;\n  height: 44px;\n  background: ", ";\n  border-radius: 44px;\n"])), function (_ref) {
+  var _theme$colors;
+  var activated = _ref.activated,
+    theme = _ref.theme;
+  return activated ? theme === null || theme === void 0 || (_theme$colors = theme.colors) === null || _theme$colors === void 0 ? void 0 : _theme$colors.white : '#F3F9FF';
+});
+var TypesContainer = exports.TypesContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  display: flex;\n  margin-top: 20px;\n"])));
+var AdditionalTypesContainer = exports.AdditionalTypesContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  width: 60%;\n  display: flex;\n  margin-bottom: 20px;\n  button {\n    padding: 4px 10px;\n    border-radius: 50px;\n    font-size: 10px;\n    line-height: 0;\n    height: 25px;\n    margin-right: 20px;\n  }\n  .activated {\n    color: ", "\n  }\n"])), function (_ref2) {
+  var _theme$colors2;
+  var theme = _ref2.theme;
+  return theme === null || theme === void 0 || (_theme$colors2 = theme.colors) === null || _theme$colors2 === void 0 ? void 0 : _theme$colors2.darkTextColor;
+});
+var TypeButton = exports.TypeButton = _styledComponents.default.div(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  width: 215px;\n  height: 75px;\n  border-radius: 7.6px;\n  padding: 16px;\n  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.10);\n  margin-right: 32px;\n  cursor: pointer;\n  box-sizing: border-box;\n  background: ", ";\n  p{\n    margin: 0;\n    margin-left: 33px;\n    ", "\n  }\n"])), function (_ref3) {
+  var _theme$colors3, _theme$colors4;
+  var activated = _ref3.activated,
+    theme = _ref3.theme;
+  return activated ? theme === null || theme === void 0 || (_theme$colors3 = theme.colors) === null || _theme$colors3 === void 0 ? void 0 : _theme$colors3.primary : theme === null || theme === void 0 || (_theme$colors4 = theme.colors) === null || _theme$colors4 === void 0 ? void 0 : _theme$colors4.white;
+}, function (_ref4) {
+  var _theme$colors5;
+  var activated = _ref4.activated,
+    theme = _ref4.theme;
+  return activated && (0, _styledComponents.css)(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n      color: ", ";\n    "])), theme === null || theme === void 0 || (_theme$colors5 = theme.colors) === null || _theme$colors5 === void 0 ? void 0 : _theme$colors5.white);
+});
+var Title = exports.Title = _styledComponents.default.h2(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n    font-size: 32px;\n    font-weight: 600;\n    margin: 0;\n    margin-bottom: 20px;\n"])));
+var Subtitle = exports.Subtitle = _styledComponents.default.h3(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n    font-size: 18px;\n    font-weight: 400;\n    margin: 0;\n    margin-bottom: 20px;\n"])));
+var BusinessListContainer = exports.BusinessListContainer = _styledComponents.default.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  width: 50%;\n  padding: 40px 20px 0px 20px;\n  box-sizing: border-box;\n"])));
+var AdditionalTypesWrapper = exports.AdditionalTypesWrapper = _styledComponents.default.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  padding: 20px;\n  padding-bottom: 0;\n"])));
+var WrapInput = exports.WrapInput = _styledComponents.default.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n  position: relative;\n  cursor: pointer;\n  background: #FFFFFF;\n  padding: 8px 16px;\n  border: 1px solid #DEE2E6;\n  box-sizing: border-box;\n  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.12);\n  border-radius: 7.6px;\n  display: flex;\n  align-items: center;\n  margin-bottom: 22px;\n  margin-top: 22px;\n  width: 100%;\n  height: 44px;\n  ", "\n\n  p{\n    color: ", ";\n    position: relative;\n    margin: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    font-size: 12px;\n    line-height: 18px;\n    @media (min-width: 576px) {\n      font-size: 1rem;\n      line-height: initial;\n    }\n  }\n\n  svg {\n    color: #B1BCCC;\n    font-size: 20px;\n    ", "\n\n    @media (min-width: 576px) {\n      ", "\n    }\n  }\n"])), function (_ref5) {
+  var withIcon = _ref5.withIcon;
+  return withIcon && (0, _styledComponents.css)(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n    box-sizing: border-box;\n\n    &::before {\n      content: \"\";\n      position: absolute;\n      right: 5px;\n      top: 0;\n      bottom: 18px;\n      width: 15px;\n\n      ", "\n    }\n\n    @media (min-width: 576px) {\n      padding: 10px 25px;\n      margin-bottom: 27px;\n    }\n  "])), function (props) {
+    var _props$theme;
+    return ((_props$theme = props.theme) === null || _props$theme === void 0 ? void 0 : _props$theme.rtl) && (0, _styledComponents.css)(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n        left: 5px;\n        right: initial;\n     "])));
+  });
+}, function (props) {
+  return props.theme.colors.darkTextColor;
+}, function (props) {
+  var _props$theme2;
+  return (_props$theme2 = props.theme) !== null && _props$theme2 !== void 0 && _props$theme2.rtl ? (0, _styledComponents.css)(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n      margin-left: 12px;\n    "]))) : (0, _styledComponents.css)(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n      margin-right: 12px;\n    "])));
+}, function (props) {
+  var _props$theme3;
+  return (_props$theme3 = props.theme) !== null && _props$theme3 !== void 0 && _props$theme3.rtl ? (0, _styledComponents.css)(_templateObject24 || (_templateObject24 = _taggedTemplateLiteral(["\n        margin-left: 20px;\n      "]))) : (0, _styledComponents.css)(_templateObject25 || (_templateObject25 = _taggedTemplateLiteral(["\n        margin-right: 20px;\n      "])));
+});
+var PaginationContainer = exports.PaginationContainer = _styledComponents.default.div(_templateObject26 || (_templateObject26 = _taggedTemplateLiteral(["\n  align-self: flex-end;\n  width: 100%;\n  margin-bottom: 20px;\n"])));
+var WrapperMap = exports.WrapperMap = _styledComponents.default.div(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n  width: 50%;\n  max-height: 2500px;\n  > div {\n    position: relative !important;\n    width: 100% !important;\n    height: 100% !important;\n  }\n  .btn-choose-store {\n    line-height: 30px;\n    padding: 0 10px;\n    font-size: 14px;\n    cursor: pointer;\n    outline: none;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    min-width: 80px;\n    height: 38px;\n    font-size: 14px;\n    background: ", ";\n    color: ", ";\n    border-color: ", ";\n  }\n\n  .btn-address-map {\n    cursor: pointer;\n    &:hover{\n      text-decoration: underline;\n    }\n  }\n  .className {\n    object-fit: none;\n  }\n"])), function (props) {
+  return props.theme.colors.primary;
+}, function (props) {
+  return props.theme.colors.primaryContrast;
+}, function (props) {
+  return props.theme.colors.primary;
+});
+var CityContainer = exports.CityContainer = _styledComponents.default.div(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n  width: 100%;\n  padding: 20px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  border-bottom: 1px solid ", ";;\n  height: 70px;\n  margin: 0;\n  box-sizing: border-box;\n\n  h3{\n    font-size: 16px;\n  }\n  ", "\n"])), function (_ref6) {
+  var _theme$colors6;
+  var theme = _ref6.theme;
+  return (theme === null || theme === void 0 || (_theme$colors6 = theme.colors) === null || _theme$colors6 === void 0 ? void 0 : _theme$colors6.tertiary) || '#fff';
+}, function (_ref7) {
+  var isSelected = _ref7.isSelected;
+  return isSelected && (0, _styledComponents.css)(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n      \n  "])));
+});
+var LoadMoreButtonCityWrap = exports.LoadMoreButtonCityWrap = _styledComponents.default.div(_templateObject30 || (_templateObject30 = _taggedTemplateLiteral(["\n  margin-top: 10px;\n  button {\n    width: 100%;\n  }\n"])));
+var ViewLocations = exports.ViewLocations = _styledComponents.default.div(_templateObject31 || (_templateObject31 = _taggedTemplateLiteral(["\n  p {\n    color: ", ";\n    cursor: pointer;\n  }\n"])), function (_ref8) {
+  var _theme$colors7;
+  var theme = _ref8.theme;
+  return theme === null || theme === void 0 || (_theme$colors7 = theme.colors) === null || _theme$colors7 === void 0 ? void 0 : _theme$colors7.primary;
+});
+var CitiesContainer = exports.CitiesContainer = _styledComponents.default.div(_templateObject32 || (_templateObject32 = _taggedTemplateLiteral(["\n  border-radius: 7.6px;\n  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.10);\n  > div {\n    cursor: pointer;\n  }\n  margin-bottom: 20px;\n"])));
+var Separator = exports.Separator = _styledComponents.default.div(_templateObject33 || (_templateObject33 = _taggedTemplateLiteral(["\n  height: 1px;\n  margin-left: 20px;\n  margin-right: 40px;\n  background: #E9ECEF;\n  box-sizing: border-box;\n"])));

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

@@ -10,12 +10,16 @@ var _RedBusinessesListing = require("./layouts/RedBusinessesListing");
 var _StarbucksBusinessesListing = require("./layouts/StarbucksBusinessesListing");
 var _AppointmentsBusinessListing = require("./layouts/AppointmentsBusinessListing");
 var _styledComponents = require("styled-components");
+var _OloBusinessesListing = require("./franchises/OloBusinessesListing");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var BusinessesListing = exports.BusinessesListing = function BusinessesListing(props) {
-  var _theme$business_listi;
+  var _theme$my_products, _theme$my_products2, _theme$business_listi;
   var logosLayout = props.logosLayout;
   var theme = (0, _styledComponents.useTheme)();
+  var websiteTheme = theme === null || theme === void 0 || (_theme$my_products = theme.my_products) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.components) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.website_theme) === null || _theme$my_products === void 0 || (_theme$my_products = _theme$my_products.components) === null || _theme$my_products === void 0 ? void 0 : _theme$my_products.type;
+  var franchiseLayout = theme === null || theme === void 0 || (_theme$my_products2 = theme.my_products) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.website_theme) === null || _theme$my_products2 === void 0 || (_theme$my_products2 = _theme$my_products2.components) === null || _theme$my_products2 === void 0 ? void 0 : _theme$my_products2.franchise_slug;
   var layout = (theme === null || theme === void 0 || (_theme$business_listi = theme.business_listing_view) === null || _theme$business_listi === void 0 || (_theme$business_listi = _theme$business_listi.components) === null || _theme$business_listi === void 0 || (_theme$business_listi = _theme$business_listi.layout) === null || _theme$business_listi === void 0 ? void 0 : _theme$business_listi.type) || 'original';
   var isStarbucksLayout = ['starbucks', 'mapview'].includes(layout);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (layout === 'original' || logosLayout) && /*#__PURE__*/_react.default.createElement(_OriginalBusinessesListing.OriginalBusinessesListing, props), isStarbucksLayout && !logosLayout && /*#__PURE__*/_react.default.createElement(_StarbucksBusinessesListing.StarbucksBusinessesListing, props), layout === 'red' && !logosLayout && /*#__PURE__*/_react.default.createElement(_RedBusinessesListing.RedBusinessesListing, props), layout === 'appointments' && !logosLayout && /*#__PURE__*/_react.default.createElement(_AppointmentsBusinessListing.BusinessListing, props));
+  var oloLayout = ['franchise_1', 'franchise_2'];
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, websiteTheme === 'franchise' ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, oloLayout.includes(franchiseLayout) && /*#__PURE__*/_react.default.createElement(_OloBusinessesListing.OloBusinessesListing, props), !franchiseLayout && /*#__PURE__*/_react.default.createElement(_OriginalBusinessesListing.OriginalBusinessesListing, props)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (layout === 'original' || logosLayout) && /*#__PURE__*/_react.default.createElement(_OriginalBusinessesListing.OriginalBusinessesListing, props), isStarbucksLayout && !logosLayout && /*#__PURE__*/_react.default.createElement(_StarbucksBusinessesListing.StarbucksBusinessesListing, props), layout === 'red' && !logosLayout && /*#__PURE__*/_react.default.createElement(_RedBusinessesListing.RedBusinessesListing, props), layout === 'appointments' && !logosLayout && /*#__PURE__*/_react.default.createElement(_AppointmentsBusinessListing.BusinessListing, props)));
 };

package/_modules/themes/five/src/components/BusinessesListing/layouts/OriginalBusinessesListing/index.js

@@ -32,6 +32,7 @@ var _OrdersSection = require("./OrdersSection");
 var _utils = require("../../../../../../../utils");
 var _AddressList = require("../../../AddressList");
 var _AddressForm = require("../../../AddressForm");
+var _OrderTypesSquares = require("../../../OrderTypesSquares");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 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 && {}.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; }
@@ -53,7 +54,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var PIXELS_TO_SCROLL = 300;
 var BusinessesListingUI = function BusinessesListingUI(props) {
-  var _orderState$options, _citiesState$cities, _ref, _theme$business_listi, _orderState$options2, _theme$business_listi2, _theme$business_listi3, _theme$business_listi4, _theme$business_listi5, _theme$business_listi6, _theme$business_listi7, _businessesList$busin, _theme$header, _orderState$options3, _orderState$options4, _configs$order_types_, _businessesList$busin4, _orderState$options8, _orderState$options10, _configs$business_lis, _configs$business_lis2, _configs$business_lis3, _theme$images2, _theme$business_listi8, _orderState$options13, _theme$images3, _theme$images4, _theme$images5, _configs$business_lis4, _theme$images6, _theme$business_listi9, _citiesState$cities5, _citiesState$cities6, _orderState$options15, _configs$advanced_bus2, _citiesState$cities7, _citiesState$cities8, _orderState$options17, _businessesList$busin6, _businessesList$busin7, _orderState$options20;
+  var _citiesState$cities, _ref, _theme$business_listi, _orderState$options, _theme$business_listi2, _theme$business_listi3, _theme$business_listi4, _theme$business_listi5, _theme$business_listi6, _theme$business_listi7, _businessesList$busin, _theme$header, _orderState$options2, _orderState$options3, _businessesList$busin4, _orderState$options7, _configs$business_lis, _configs$business_lis2, _configs$business_lis3, _theme$images2, _theme$business_listi8, _orderState$options8, _configs$business_lis4, _theme$images3, _theme$business_listi9, _citiesState$cities5, _citiesState$cities6, _orderState$options10, _configs$advanced_bus2, _citiesState$cities7, _citiesState$cities8, _orderState$options12, _businessesList$busin6, _businessesList$busin7, _orderState$options15;
   var businessesList = props.businessesList,
     paginationProps = props.paginationProps,
     searchValue = props.searchValue,
@@ -71,18 +72,13 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     logosLayout = props.logosLayout,
     actualSlug = props.actualSlug,
     orderTypes = props.orderTypes;
-  var allOrderTypes = [1, 2, 3, 4, 5];
-  var pickupTypes = [2, 4, 5];
-  var eatInType = 3;
   var _useLanguage = (0, _orderingComponentsExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
   var _useOrder = (0, _orderingComponentsExternal.useOrder)(),
     _useOrder2 = _slicedToArray(_useOrder, 2),
     orderState = _useOrder2[0],
-    _useOrder2$ = _useOrder2[1],
-    changeCityFilter = _useOrder2$.changeCityFilter,
-    changeType = _useOrder2$.changeType;
+    changeCityFilter = _useOrder2[1].changeCityFilter;
   var _useSession = (0, _orderingComponentsExternal.useSession)(),
     _useSession2 = _slicedToArray(_useSession, 1),
     auth = _useSession2[0].auth;
@@ -126,19 +122,15 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     _useState14 = _slicedToArray(_useState13, 2),
     hasHighRatedBusiness = _useState14[0],
     setHasHighRatedBusiness = _useState14[1];
-  var _useState15 = (0, _react.useState)(orderState === null || orderState === void 0 || (_orderState$options = orderState.options) === null || _orderState$options === void 0 ? void 0 : _orderState$options.type),
-    _useState16 = _slicedToArray(_useState15, 2),
-    orderTypeSelected = _useState16[0],
-    setOrderTypeSelected = _useState16[1];
   var userCustomer = JSON.parse(window.localStorage.getItem('user-customer'));
-  var _useState17 = (0, _react.useState)([]),
-    _useState18 = _slicedToArray(_useState17, 2),
-    favoriteIds = _useState18[0],
-    setFavoriteIds = _useState18[1];
+  var _useState15 = (0, _react.useState)([]),
+    _useState16 = _slicedToArray(_useState15, 2),
+    favoriteIds = _useState16[0],
+    setFavoriteIds = _useState16[1];
   var allCitiesDisabled = citiesState === null || citiesState === void 0 || (_citiesState$cities = citiesState.cities) === null || _citiesState$cities === void 0 ? void 0 : _citiesState$cities.every(function (city) {
     return !city.enabled;
   });
-  var hideCities = (_ref = (theme === null || theme === void 0 || (_theme$business_listi = theme.business_listing_view) === null || _theme$business_listi === void 0 || (_theme$business_listi = _theme$business_listi.components) === null || _theme$business_listi === void 0 || (_theme$business_listi = _theme$business_listi.cities) === null || _theme$business_listi === void 0 ? void 0 : _theme$business_listi.hidden) || (orderState === null || orderState === void 0 || (_orderState$options2 = orderState.options) === null || _orderState$options2 === void 0 ? void 0 : _orderState$options2.type) !== 2 || allCitiesDisabled) !== null && _ref !== void 0 ? _ref : true;
+  var hideCities = (_ref = (theme === null || theme === void 0 || (_theme$business_listi = theme.business_listing_view) === null || _theme$business_listi === void 0 || (_theme$business_listi = _theme$business_listi.components) === null || _theme$business_listi === void 0 || (_theme$business_listi = _theme$business_listi.cities) === null || _theme$business_listi === void 0 ? void 0 : _theme$business_listi.hidden) || (orderState === null || orderState === void 0 || (_orderState$options = orderState.options) === null || _orderState$options === void 0 ? void 0 : _orderState$options.type) !== 2 || allCitiesDisabled) !== null && _ref !== void 0 ? _ref : true;
   var hideSearch = theme === null || theme === void 0 || (_theme$business_listi2 = theme.business_listing_view) === null || _theme$business_listi2 === void 0 || (_theme$business_listi2 = _theme$business_listi2.components) === null || _theme$business_listi2 === void 0 || (_theme$business_listi2 = _theme$business_listi2.search) === null || _theme$business_listi2 === void 0 ? void 0 : _theme$business_listi2.hidden;
   var hideFilter = (theme === null || theme === void 0 || (_theme$business_listi3 = theme.business_listing_view) === null || _theme$business_listi3 === void 0 || (_theme$business_listi3 = _theme$business_listi3.components) === null || _theme$business_listi3 === void 0 || (_theme$business_listi3 = _theme$business_listi3.filter) === null || _theme$business_listi3 === void 0 ? void 0 : _theme$business_listi3.hidden) || hideSearch;
   var hideHero = theme === null || theme === void 0 || (_theme$business_listi4 = theme.business_listing_view) === null || _theme$business_listi4 === void 0 || (_theme$business_listi4 = _theme$business_listi4.components) === null || _theme$business_listi4 === void 0 || (_theme$business_listi4 = _theme$business_listi4.business_hero) === null || _theme$business_listi4 === void 0 ? void 0 : _theme$business_listi4.hidden;
@@ -150,12 +142,7 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     return business.id;
   }));
   var isChew = (theme === null || theme === void 0 || (_theme$header = theme.header) === null || _theme$header === void 0 || (_theme$header = _theme$header.components) === null || _theme$header === void 0 || (_theme$header = _theme$header.layout) === null || _theme$header === void 0 || (_theme$header = _theme$header.type) === null || _theme$header === void 0 ? void 0 : _theme$header.toLowerCase()) === 'chew';
-  var cateringTypeString = (orderState === null || orderState === void 0 || (_orderState$options3 = orderState.options) === null || _orderState$options3 === void 0 ? void 0 : _orderState$options3.type) === 7 ? 'catering_delivery' : (orderState === null || orderState === void 0 || (_orderState$options4 = orderState.options) === null || _orderState$options4 === void 0 ? void 0 : _orderState$options4.type) === 8 ? 'catering_pickup' : null;
-  var configTypes = (configs === null || configs === void 0 || (_configs$order_types_ = configs.order_types_allowed) === null || _configs$order_types_ === void 0 ? void 0 : _configs$order_types_.value.split('|').filter(function (value) {
-    return allOrderTypes.includes(Number(value));
-  }).map(function (value) {
-    return Number(value);
-  })) || [];
+  var cateringTypeString = (orderState === null || orderState === void 0 || (_orderState$options2 = orderState.options) === null || _orderState$options2 === void 0 ? void 0 : _orderState$options2.type) === 7 ? 'catering_delivery' : (orderState === null || orderState === void 0 || (_orderState$options3 = orderState.options) === null || _orderState$options3 === void 0 ? void 0 : _orderState$options3.type) === 8 ? 'catering_pickup' : null;
   var cateringValues = (preorderBusiness === null || preorderBusiness === void 0 ? void 0 : preorderBusiness.configs) && (0, _utils.getCateringValues)(cateringTypeString, preorderBusiness === null || preorderBusiness === void 0 ? void 0 : preorderBusiness.configs);
   var handleScroll = (0, _react.useCallback)(function () {
     var _document$documentEle, _document$documentEle2, _businessesList$error;
@@ -222,22 +209,8 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     }));
   };
   var handleChangeCity = function handleChangeCity(cityId) {
-    var _orderState$options5;
-    changeCityFilter(cityId === (orderState === null || orderState === void 0 || (_orderState$options5 = orderState.options) === null || _orderState$options5 === void 0 ? void 0 : _orderState$options5.city_id) ? null : cityId);
-  };
-  var handleChangeType = function handleChangeType(value) {
-    if (!(orderState !== null && orderState !== void 0 && orderState.loading)) {
-      changeType(value);
-      setOrderTypeSelected(value);
-    }
-  };
-  var handleChangeToPickup = function handleChangeToPickup() {
-    var _orderTypes$find;
-    var firstEnabledPickupType = (_orderTypes$find = orderTypes.find(function (type) {
-      return (configTypes === null || configTypes === void 0 ? void 0 : configTypes.includes(type.value)) && type.value !== 1;
-    })) === null || _orderTypes$find === void 0 ? void 0 : _orderTypes$find.value;
-    handleChangeType(firstEnabledPickupType);
-    setOrderTypeSelected(firstEnabledPickupType);
+    var _orderState$options4;
+    changeCityFilter(cityId === (orderState === null || orderState === void 0 || (_orderState$options4 = orderState.options) === null || _orderState$options4 === void 0 ? void 0 : _orderState$options4.city_id) ? null : cityId);
   };
   (0, _react.useEffect)(function () {
     if (preorderBusiness) setIsPreorder(true);
@@ -261,35 +234,15 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     setFavoriteIds(_toConsumableArray(new Set(ids)));
   }, [businessesList === null || businessesList === void 0 || (_businessesList$busin4 = businessesList.businesses) === null || _businessesList$busin4 === void 0 ? void 0 : _businessesList$busin4.length]);
   (0, _react.useEffect)(function () {
-    var _citiesState$cities3, _orderState$options6, _citiesState$cities4;
-    if (!(citiesState !== null && citiesState !== void 0 && (_citiesState$cities3 = citiesState.cities) !== null && _citiesState$cities3 !== void 0 && _citiesState$cities3.length) || !(orderState !== null && orderState !== void 0 && (_orderState$options6 = orderState.options) !== null && _orderState$options6 !== void 0 && _orderState$options6.city_id)) return;
+    var _citiesState$cities3, _orderState$options5, _citiesState$cities4;
+    if (!(citiesState !== null && citiesState !== void 0 && (_citiesState$cities3 = citiesState.cities) !== null && _citiesState$cities3 !== void 0 && _citiesState$cities3.length) || !(orderState !== null && orderState !== void 0 && (_orderState$options5 = orderState.options) !== null && _orderState$options5 !== void 0 && _orderState$options5.city_id)) return;
     var selectedCity = citiesState === null || citiesState === void 0 || (_citiesState$cities4 = citiesState.cities) === null || _citiesState$cities4 === void 0 ? void 0 : _citiesState$cities4.find(function (city) {
-      var _orderState$options7;
-      return (city === null || city === void 0 ? void 0 : city.id) === (orderState === null || orderState === void 0 || (_orderState$options7 = orderState.options) === null || _orderState$options7 === void 0 ? void 0 : _orderState$options7.city_id);
+      var _orderState$options6;
+      return (city === null || city === void 0 ? void 0 : city.id) === (orderState === null || orderState === void 0 || (_orderState$options6 = orderState.options) === null || _orderState$options6 === void 0 ? void 0 : _orderState$options6.city_id);
     });
     if (!selectedCity || !(selectedCity !== null && selectedCity !== void 0 && selectedCity.enabled)) changeCityFilter(null);
     setHasHighRatedBusiness(true);
-  }, [citiesState, orderState === null || orderState === void 0 || (_orderState$options8 = orderState.options) === null || _orderState$options8 === void 0 ? void 0 : _orderState$options8.city_id]);
-  (0, _react.useEffect)(function () {
-    var _orderState$options9;
-    setOrderTypeSelected(orderState === null || orderState === void 0 || (_orderState$options9 = orderState.options) === null || _orderState$options9 === void 0 ? void 0 : _orderState$options9.type);
-  }, [orderState === null || orderState === void 0 || (_orderState$options10 = orderState.options) === null || _orderState$options10 === void 0 ? void 0 : _orderState$options10.type]);
-  var OrderTypesComponent = function OrderTypesComponent() {
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, orderTypes && (configTypes ? orderTypes.filter(function (type) {
-      return (configTypes === null || configTypes === void 0 ? void 0 : configTypes.includes(type.value)) && pickupTypes.includes(type === null || type === void 0 ? void 0 : type.value);
-    }) : orderTypes).map(function (item, i) {
-      var _orderState$options11, _orderState$options12;
-      return /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
-        key: item.value,
-        onClick: function onClick() {
-          return handleChangeType(item.value);
-        },
-        color: (orderState === null || orderState === void 0 || (_orderState$options11 = orderState.options) === null || _orderState$options11 === void 0 ? void 0 : _orderState$options11.type) === (item === null || item === void 0 ? void 0 : item.value) ? 'primary' : 'secondary',
-        disabled: orderState === null || orderState === void 0 ? void 0 : orderState.loading,
-        className: (orderState === null || orderState === void 0 || (_orderState$options12 = orderState.options) === null || _orderState$options12 === void 0 ? void 0 : _orderState$options12.type) !== (item === null || item === void 0 ? void 0 : item.value) ? 'activated' : ''
-      }, item.text);
-    }));
-  };
+  }, [citiesState, orderState === null || orderState === void 0 || (_orderState$options7 = orderState.options) === null || _orderState$options7 === void 0 ? void 0 : _orderState$options7.city_id]);
   if (logosLayout) {
     var _businessesList$busin5;
     return /*#__PURE__*/_react.default.createElement(_styles.BusinessLogosWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.BusinessLogosContainer, null, /*#__PURE__*/_react.default.createElement(_AutoScroll.AutoScroll, {
@@ -321,56 +274,16 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
   }), (configs === null || configs === void 0 || (_configs$business_lis3 = configs.business_listing_hide_image) === null || _configs$business_lis3 === void 0 ? void 0 : _configs$business_lis3.value) !== '1' && !isChew && !hideHero && !isCustomerMode && /*#__PURE__*/_react.default.createElement(_styles.BusinessHeroImg, {
     bgimage: (_theme$images2 = theme.images) === null || _theme$images2 === void 0 || (_theme$images2 = _theme$images2.general) === null || _theme$images2 === void 0 ? void 0 : _theme$images2.businessHero,
     height: theme === null || theme === void 0 || (_theme$business_listi8 = theme.business_listing_view) === null || _theme$business_listi8 === void 0 || (_theme$business_listi8 = _theme$business_listi8.components) === null || _theme$business_listi8 === void 0 || (_theme$business_listi8 = _theme$business_listi8.business_hero) === null || _theme$business_listi8 === void 0 || (_theme$business_listi8 = _theme$business_listi8.style) === null || _theme$business_listi8 === void 0 ? void 0 : _theme$business_listi8.height
-  })), userCustomer && (orderState === null || orderState === void 0 || (_orderState$options13 = orderState.options) === null || _orderState$options13 === void 0 || (_orderState$options13 = _orderState$options13.address) === null || _orderState$options13 === void 0 ? void 0 : _orderState$options13.address) && isCustomerMode && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (configTypes.includes(1) || configTypes.some(function (type) {
-    return pickupTypes.includes(type);
-  })) && /*#__PURE__*/_react.default.createElement(_styles.Title, null, t('DELIVERY_TYPE', 'Delivery Type')), /*#__PURE__*/_react.default.createElement(_styles.TypesContainer, null, configTypes.includes(1) && /*#__PURE__*/_react.default.createElement(_styles.TypeButton, {
-    onClick: function onClick() {
-      return handleChangeType(1);
-    },
-    disabled: orderState === null || orderState === void 0 ? void 0 : orderState.loading,
-    activated: orderTypeSelected === 1
-  }, /*#__PURE__*/_react.default.createElement(_styles.IconTypeButton, {
-    activated: orderTypeSelected === 1
-  }, /*#__PURE__*/_react.default.createElement("img", {
-    src: theme === null || theme === void 0 || (_theme$images3 = theme.images) === null || _theme$images3 === void 0 || (_theme$images3 = _theme$images3.general) === null || _theme$images3 === void 0 ? void 0 : _theme$images3.deliveryIco,
-    width: 20,
-    height: 20
-  })), /*#__PURE__*/_react.default.createElement("p", null, t('DELIVERY', 'Delivery'))), configTypes.some(function (type) {
-    return pickupTypes.includes(type);
-  }) && /*#__PURE__*/_react.default.createElement(_styles.TypeButton, {
-    disabled: orderState === null || orderState === void 0 ? void 0 : orderState.loading,
-    activated: pickupTypes.includes(orderTypeSelected),
-    onClick: function onClick() {
-      return handleChangeToPickup();
-    }
-  }, /*#__PURE__*/_react.default.createElement(_styles.IconTypeButton, {
-    activated: pickupTypes.includes(orderTypeSelected)
-  }, /*#__PURE__*/_react.default.createElement("img", {
-    src: theme === null || theme === void 0 || (_theme$images4 = theme.images) === null || _theme$images4 === void 0 || (_theme$images4 = _theme$images4.general) === null || _theme$images4 === void 0 ? void 0 : _theme$images4.pickupIco,
-    width: 22,
-    height: 22
-  })), /*#__PURE__*/_react.default.createElement("p", null, t('PICKUP', 'Pickup'))), configTypes.some(function (type) {
-    return eatInType === type;
-  }) && /*#__PURE__*/_react.default.createElement(_styles.TypeButton, {
-    disabled: orderState === null || orderState === void 0 ? void 0 : orderState.loading,
-    activated: orderTypeSelected === 3,
-    onClick: function onClick() {
-      return handleChangeType(3);
-    }
-  }, /*#__PURE__*/_react.default.createElement(_styles.IconTypeButton, {
-    activated: orderTypeSelected === 3
-  }, /*#__PURE__*/_react.default.createElement("img", {
-    src: theme === null || theme === void 0 || (_theme$images5 = theme.images) === null || _theme$images5 === void 0 || (_theme$images5 = _theme$images5.general) === null || _theme$images5 === void 0 ? void 0 : _theme$images5.eatinIco,
-    width: 22,
-    height: 22
-  })), /*#__PURE__*/_react.default.createElement("p", null, t('EAT_IN', 'Eat in')))), pickupTypes.includes(orderTypeSelected) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, t('WHAT_PICKUP_YOU_NEED', 'What kind of pickup do you need?')), /*#__PURE__*/_react.default.createElement(_styles.AdditionalTypesContainer, null, /*#__PURE__*/_react.default.createElement(OrderTypesComponent, null)))), !isCustomerMode && /*#__PURE__*/_react.default.createElement(_OrderProgress.OrderProgress, {
+  })), userCustomer && (orderState === null || orderState === void 0 || (_orderState$options8 = orderState.options) === null || _orderState$options8 === void 0 || (_orderState$options8 = _orderState$options8.address) === null || _orderState$options8 === void 0 ? void 0 : _orderState$options8.address) && isCustomerMode && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_OrderTypesSquares.OrderTypesSquares, {
+    orderTypes: orderTypes
+  })), !isCustomerMode && /*#__PURE__*/_react.default.createElement(_OrderProgress.OrderProgress, {
     isChew: isChew,
     franchiseId: props.franchiseId,
     userCustomerId: userCustomer === null || userCustomer === void 0 ? void 0 : userCustomer.id,
     asDashboard: isCustomerMode,
     isCustomerMode: isCustomerMode
   }), (configs === null || configs === void 0 || (_configs$business_lis4 = configs.business_listing_hide_image) === null || _configs$business_lis4 === void 0 ? void 0 : _configs$business_lis4.value) !== '1' && isChew && /*#__PURE__*/_react.default.createElement(_styles.BusinessHeroImg, {
-    bgimage: (_theme$images6 = theme.images) === null || _theme$images6 === void 0 || (_theme$images6 = _theme$images6.general) === null || _theme$images6 === void 0 ? void 0 : _theme$images6.businessHero,
+    bgimage: (_theme$images3 = theme.images) === null || _theme$images3 === void 0 || (_theme$images3 = _theme$images3.general) === null || _theme$images3 === void 0 ? void 0 : _theme$images3.businessHero,
     height: theme === null || theme === void 0 || (_theme$business_listi9 = theme.business_listing_view) === null || _theme$business_listi9 === void 0 || (_theme$business_listi9 = _theme$business_listi9.components) === null || _theme$business_listi9 === void 0 || (_theme$business_listi9 = _theme$business_listi9.business_hero) === null || _theme$business_listi9 === void 0 || (_theme$business_listi9 = _theme$business_listi9.style) === null || _theme$business_listi9 === void 0 ? void 0 : _theme$business_listi9.height
   }), isCustomerMode && !hidePreviousOrders && !businessesList.loading && /*#__PURE__*/_react.default.createElement(_OrdersSection.OrdersSection, {
     titleContent: t('PREVIOUS_ORDERS', 'Previous orders'),
@@ -400,13 +313,13 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     color: "primary",
     onClick: handleOpenCities
   }, (citiesState === null || citiesState === void 0 || (_citiesState$cities6 = citiesState.cities) === null || _citiesState$cities6 === void 0 || (_citiesState$cities6 = _citiesState$cities6.find(function (city) {
-    var _orderState$options14;
-    return (city === null || city === void 0 ? void 0 : city.id) === (orderState === null || orderState === void 0 || (_orderState$options14 = orderState.options) === null || _orderState$options14 === void 0 ? void 0 : _orderState$options14.city_id);
+    var _orderState$options9;
+    return (city === null || city === void 0 ? void 0 : city.id) === (orderState === null || orderState === void 0 || (_orderState$options9 = orderState.options) === null || _orderState$options9 === void 0 ? void 0 : _orderState$options9.city_id);
   })) === null || _citiesState$cities6 === void 0 ? void 0 : _citiesState$cities6.name) || t('SELECT_A_CITY', 'Select a city')), isCustomLayout && /*#__PURE__*/_react.default.createElement(_FiMap.default, {
     onClick: toggleMap
   })), activeMap && /*#__PURE__*/_react.default.createElement(_BusinessesMap.BusinessesMap, {
     businessList: businessesList.businesses,
-    userLocation: orderState === null || orderState === void 0 || (_orderState$options15 = orderState.options) === null || _orderState$options15 === void 0 || (_orderState$options15 = _orderState$options15.address) === null || _orderState$options15 === void 0 ? void 0 : _orderState$options15.location,
+    userLocation: orderState === null || orderState === void 0 || (_orderState$options10 = orderState.options) === null || _orderState$options10 === void 0 || (_orderState$options10 = _orderState$options10.address) === null || _orderState$options10 === void 0 ? void 0 : _orderState$options10.location,
     setErrors: setMapErrors
   })), !isChew && hasHighRatedBusiness && !props.franchiseId && !hideHighestBusiness && /*#__PURE__*/_react.default.createElement(_styles.HightestRatedWrapper, null, /*#__PURE__*/_react.default.createElement(_styles.Divider, null), /*#__PURE__*/_react.default.createElement(_HighestRated.HighestRated, {
     propsToFetch: props.propsToFetch,
@@ -445,11 +358,11 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     color: "primary",
     onClick: handleOpenCities
   }, (citiesState === null || citiesState === void 0 || (_citiesState$cities8 = citiesState.cities) === null || _citiesState$cities8 === void 0 || (_citiesState$cities8 = _citiesState$cities8.find(function (city) {
-    var _orderState$options16;
-    return (city === null || city === void 0 ? void 0 : city.id) === (orderState === null || orderState === void 0 || (_orderState$options16 = orderState.options) === null || _orderState$options16 === void 0 ? void 0 : _orderState$options16.city_id);
+    var _orderState$options11;
+    return (city === null || city === void 0 ? void 0 : city.id) === (orderState === null || orderState === void 0 || (_orderState$options11 = orderState.options) === null || _orderState$options11 === void 0 ? void 0 : _orderState$options11.city_id);
   })) === null || _citiesState$cities8 === void 0 ? void 0 : _citiesState$cities8.name) || t('SELECT_A_CITY', 'Select a city')))), isCustomerMode && activeMap && /*#__PURE__*/_react.default.createElement(_BusinessesMap.BusinessesMap, {
     businessList: businessesList.businesses,
-    userLocation: orderState === null || orderState === void 0 || (_orderState$options17 = orderState.options) === null || _orderState$options17 === void 0 || (_orderState$options17 = _orderState$options17.address) === null || _orderState$options17 === void 0 ? void 0 : _orderState$options17.location,
+    userLocation: orderState === null || orderState === void 0 || (_orderState$options12 = orderState.options) === null || _orderState$options12 === void 0 || (_orderState$options12 = _orderState$options12.address) === null || _orderState$options12 === void 0 ? void 0 : _orderState$options12.location,
     setErrors: setMapErrors
   }), /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (!isCustomLayout && isCustomerMode && (businessesList === null || businessesList === void 0 || (_businessesList$busin6 = businessesList.businesses) === null || _businessesList$busin6 === void 0 ? void 0 : _businessesList$busin6.length) > 0 || isChew) && /*#__PURE__*/_react.default.createElement(_styles.BusinessesTitle, null, t('BUSINESSES', 'Businesses')), /*#__PURE__*/_react.default.createElement(_styles.BusinessList, null, !businessesList.loading && businessesList.businesses.length === 0 && (businessesList === null || businessesList === void 0 ? void 0 : businessesList.fetched) && /*#__PURE__*/_react.default.createElement(_NotFoundSource.NotFoundSource, {
     content: t('NOT_FOUND_BUSINESSES', 'No businesses to delivery / pick up at this address, please change filters or change address.')
@@ -463,14 +376,14 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
       height: '44px'
     }
   }, t('CHANGE_ADDRESS', 'Select other Address'))), (_businessesList$busin7 = businessesList.businesses) === null || _businessesList$busin7 === void 0 ? void 0 : _businessesList$busin7.map(function (business) {
-    var _orderState$options18, _business$reviews;
+    var _orderState$options13, _business$reviews;
     return /*#__PURE__*/_react.default.createElement(_BusinessController.BusinessController, {
       key: business.id,
       className: "card",
       business: business,
       isBusinessOpen: business.open && (business === null || business === void 0 ? void 0 : business.enabled) !== false,
       handleCustomClick: handleBusinessClick,
-      orderType: orderState === null || orderState === void 0 || (_orderState$options18 = orderState.options) === null || _orderState$options18 === void 0 ? void 0 : _orderState$options18.type,
+      orderType: orderState === null || orderState === void 0 || (_orderState$options13 = orderState.options) === null || _orderState$options13 === void 0 ? void 0 : _orderState$options13.type,
       isCustomLayout: isCustomLayout,
       isCustomerMode: isCustomerMode,
       onPreorderBusiness: setPreorderBusiness,
@@ -488,13 +401,13 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
       setFavoriteIds: setFavoriteIds
     });
   }), (businessesList.loading || !(businessesList !== null && businessesList !== void 0 && businessesList.fetched)) && _toConsumableArray(Array((paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.nextPageItems) > 4 ? paginationProps.nextPageItems : 8).keys()).map(function (i) {
-    var _orderState$options19;
+    var _orderState$options14;
     return /*#__PURE__*/_react.default.createElement(_BusinessController.BusinessController, {
       key: i,
       className: "card",
       business: {},
       isSkeleton: true,
-      orderType: orderState === null || orderState === void 0 || (_orderState$options19 = orderState.options) === null || _orderState$options19 === void 0 ? void 0 : _orderState$options19.type
+      orderType: orderState === null || orderState === void 0 || (_orderState$options14 = orderState.options) === null || _orderState$options14 === void 0 ? void 0 : _orderState$options14.type
     });
   }))), /*#__PURE__*/_react.default.createElement(_Modal.Modal, {
     open: isPreorder,
@@ -548,7 +461,7 @@ var BusinessesListingUI = function BusinessesListingUI(props) {
     isCustomerMode: isCustomerMode
   }) : /*#__PURE__*/_react.default.createElement(_styles.AddressFormWrapper, null, /*#__PURE__*/_react.default.createElement(_AddressForm.AddressForm, {
     useValidationFileds: true,
-    address: (orderState === null || orderState === void 0 || (_orderState$options20 = orderState.options) === null || _orderState$options20 === void 0 ? void 0 : _orderState$options20.address) || {},
+    address: (orderState === null || orderState === void 0 || (_orderState$options15 = orderState.options) === null || _orderState$options15 === void 0 ? void 0 : _orderState$options15.address) || {},
     onCancel: function onCancel() {
       return setModals(_objectSpread(_objectSpread({}, modals), {}, {
         formOpen: false

package/_modules/themes/five/src/components/BusinessesListing/layouts/OriginalBusinessesListing/styles.js

@@ -23,7 +23,7 @@ var WrapperSearch = exports.WrapperSearch = _styledComponents.default.div(_templ
 }, function (_ref) {
   var isCustomLayout = _ref.isCustomLayout,
     isCustomerMode = _ref.isCustomerMode;
-  return isCustomLayout && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    position: relative;\n    margin: 0;\n    margin-top: 10px;\n    margin-bottom: 20px;\n    width: 100%; \n    padding: 0 20px;\n    ", "\n    svg {\n      align-self: auto;\n    }\n    \n    @media(min-width: 681px){\n      width: 75%;\n      padding: 0;\n    }\n    @media(min-width: 1201px){\n      width: 50%;\n    }\n  "])), isCustomerMode ? (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      margin-right: 20px;\n    "]))) : (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      margin: 0 auto;\n    "]))));
+  return isCustomLayout && (0, _styledComponents.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    box-sizing: border-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    position: relative;\n    margin: 0;\n    margin-top: 10px;\n    margin-bottom: 20px;\n    width: 100%;\n    padding: 0 20px;\n    ", "\n    svg {\n      align-self: auto;\n    }\n\n    @media(min-width: 681px){\n      width: 75%;\n      padding: 0;\n    }\n    @media(min-width: 1201px){\n      width: 50%;\n    }\n  "])), isCustomerMode ? (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n      margin-right: 20px;\n    "]))) : (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n      margin: 0 auto;\n    "]))));
 });
 var ErrorMessage = exports.ErrorMessage = _styledComponents.default.span(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  padding: 20px;\n  width: 100%;\n  background-color: #CCCCCC;\n  margin: 0px 15px;\n  color: #D81313;\n  font-weight: bold;\n"])));
 var PreviousOrders = exports.PreviousOrders = _styledComponents.default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-wrap: wrap;\n  margin: 10px 20px 0px;\n"])));

package/_modules/themes/five/src/components/Checkout/OrderDetail.js

@@ -20,14 +20,12 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var OrderDetail = exports.OrderDetail = function OrderDetail(props) {
   var item = props.item,
     placingOrder = props.placingOrder,
-    orderType = props.orderType,
     customerAddress = props.customerAddress,
     _onClick = props.onClick;
   var _useLanguage = (0, _orderingComponentsExternal.useLanguage)(),
     _useLanguage2 = _slicedToArray(_useLanguage, 2),
     t = _useLanguage2[1];
-  var orderTypeList = [t('DELIVERY', 'Delivery'), t('PICKUP', 'Pickup'), t('EAT_IN', 'Eat in'), t('CURBSIDE', 'Curbside'), t('DRIVE_THRU', 'Drive thru')];
-  return /*#__PURE__*/_react.default.createElement(_styles.OrderDetailContainer, null, /*#__PURE__*/_react.default.createElement("h3", null, customerAddress), /*#__PURE__*/_react.default.createElement("h3", null, orderTypeList[orderType - 1] || t('DELIVERY', 'Delivery')), /*#__PURE__*/_react.default.createElement("div", null, item === null || item === void 0 ? void 0 : item.products.filter(function (product) {
+  return /*#__PURE__*/_react.default.createElement(_styles.OrderDetailContainer, null, /*#__PURE__*/_react.default.createElement("h3", null, customerAddress), /*#__PURE__*/_react.default.createElement("div", null, item === null || item === void 0 ? void 0 : item.products.filter(function (product) {
     return !(product !== null && product !== void 0 && product.calendar_event);
   }).map(function (product) {
     var _item$toppings_remove;

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

@@ -35,6 +35,7 @@ var _SignUpForm = require("../SignUpForm");
 var _LoginForm = require("../LoginForm");
 var _OrderDetail = require("./OrderDetail");
 var _SpinnerLoader = require("../../../../../components/SpinnerLoader");
+var _OrderTypesSquares = require("../OrderTypesSquares");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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); }
 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 && {}.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; }
@@ -64,7 +65,7 @@ var mapConfigs = {
   }
 };
 var CheckoutUI = function CheckoutUI(props) {
-  var _businessDetails$busi, _businessDetails$busi2, _configs$table_numer_, _businessConfigs$find, _businessConfigs$find2, _configs$cash_wallet, _configs$wallet_enabl, _theme$header, _theme$colors, _theme$colors$split, _cart$comment, _cart$offers, _paymethodSelected$da, _paymethodSelected$da2, _cardList$cards, _cartState$cart, _configs$driver_tip_o, _configs$driver_tip_o2, _configs$driver_tip_o3, _instructionsOptions$, _theme$checkout, _theme$checkout2, _theme$checkout3, _theme$checkout4, _loyaltyPlansState$re, _creditPointPlan$busi, _cart$business2, _businessDetails$busi3, _theme$images, _configs$google_maps_, _customerState$user, _customerState$user2, _Object$values2, _businessDetails$busi4, _businessDetails$busi5, _businessDetails$busi6, _businessDetails$busi7, _businessDetails$busi8, _businessDetails$busi9, _businessDetails$erro, _businessDetails$erro2, _businessDetails$busi10, _businessDetails$busi11, _businessDetails$busi12, _configs$driver_tip_t, _configs$driver_tip_u, _configs$driver_tip_t2, _cartState$cart$spot_, _cartState$cart2, _cart$business3, _cart$products2, _ref2, _creditPointPlanOnBus, _configs$driver_tip_t3, _configs$driver_tip_u2, _configs$driver_tip_t4, _customerState$user3, _options$address;
+  var _businessDetails$busi, _businessDetails$busi2, _configs$table_numer_, _businessConfigs$find, _businessConfigs$find2, _configs$cash_wallet, _configs$wallet_enabl, _theme$header, _theme$colors, _theme$colors$split, _cart$comment, _cart$offers, _paymethodSelected$da, _paymethodSelected$da2, _cardList$cards, _cartState$cart, _configs$driver_tip_o, _configs$driver_tip_o2, _configs$driver_tip_o3, _instructionsOptions$, _theme$checkout, _theme$checkout2, _theme$checkout3, _theme$checkout4, _loyaltyPlansState$re, _creditPointPlan$busi, _cart$business2, _businessDetails$busi3, _theme$images, _configs$google_maps_, _customerState$user, _customerState$user2, _Object$values2, _businessDetails$busi4, _businessDetails$busi5, _businessDetails$busi6, _businessDetails$busi7, _businessDetails$busi8, _businessDetails$busi9, _businessDetails$erro, _businessDetails$erro2, _businessDetails$busi10, _businessDetails$busi11, _businessDetails$busi12, _configs$driver_tip_t, _configs$driver_tip_u, _configs$driver_tip_t2, _cartState$cart$spot_, _cartState$cart2, _cart$business3, _cart$products2, _ref2, _creditPointPlanOnBus, _configs$driver_tip_t3, _configs$driver_tip_u2, _configs$driver_tip_t4, _customerState$user3, _theme$colors2, _options$address;
   var cart = props.cart,
     errors = props.errors,
     placing = props.placing,
@@ -178,6 +179,7 @@ var CheckoutUI = function CheckoutUI(props) {
     productLoading = _useState26[0],
     setProductLoading = _useState26[1];
   var shouldActivateOrderDetailModal = isCustomerMode;
+  var orderTypeList = [t('DELIVERY', 'Delivery'), t('PICKUP', 'Pickup'), t('EAT_IN', 'Eat in'), t('CURBSIDE', 'Curbside'), t('DRIVE_THRU', 'Drive thru')];
   var cardsMethods = ['stripe', 'credomatic'];
   var stripePaymethods = ['stripe', 'stripe_connect', 'stripe_redirect'];
   var businessConfigs = (_businessDetails$busi = businessDetails === null || businessDetails === void 0 || (_businessDetails$busi2 = businessDetails.business) === null || _businessDetails$busi2 === void 0 ? void 0 : _businessDetails$busi2.configs) !== null && _businessDetails$busi !== void 0 ? _businessDetails$busi : [];
@@ -333,6 +335,7 @@ var CheckoutUI = function CheckoutUI(props) {
     var _Object$values, _configs$verification2;
     setUserErrors([]);
     var errors = [];
+    var UKCodes = ['44'];
     var userSelected = isCustomerMode ? customerState.user : user;
     var _requiredFields = [];
     Object.values(checkoutFieldsState === null || checkoutFieldsState === void 0 ? void 0 : checkoutFieldsState.fields).map(function (field) {
@@ -355,11 +358,21 @@ var CheckoutUI = function CheckoutUI(props) {
     setRequiredFields(_requiredFields);
     if (userSelected && userSelected !== null && userSelected !== void 0 && userSelected.cellphone) {
       if (userSelected !== null && userSelected !== void 0 && userSelected.country_phone_code) {
-        var _configs$validation_p, _configs$validation_p2;
+        var _phoneNumber$isPossib, _phoneNumber$isValid, _configs$validation_p, _configs$validation_p2;
         var phone = null;
         phone = "+".concat(userSelected === null || userSelected === void 0 ? void 0 : userSelected.country_phone_code).concat(userSelected === null || userSelected === void 0 ? void 0 : userSelected.cellphone.replace("+".concat(userSelected === null || userSelected === void 0 ? void 0 : userSelected.country_phone_code), ''));
         var phoneNumber = (0, _libphonenumberJs.default)(phone);
-        if (parseInt((_configs$validation_p = configs === null || configs === void 0 || (_configs$validation_p2 = configs.validation_phone_number_lib) === null || _configs$validation_p2 === void 0 ? void 0 : _configs$validation_p2.value) !== null && _configs$validation_p !== void 0 ? _configs$validation_p : 1, 10) && !(phoneNumber !== null && phoneNumber !== void 0 && phoneNumber.isValid())) {
+        var enableIspossibly = false;
+        if (UKCodes.includes(phoneNumber === null || phoneNumber === void 0 ? void 0 : phoneNumber.countryCallingCode)) {
+          var inputNumber = userSelected === null || userSelected === void 0 ? void 0 : userSelected.cellphone;
+          var validationsForUK = ['01', '02', '07', '0800', '0808', '0845', '0870', '0871', '16'];
+          var result = validationsForUK.some(function (areaCode) {
+            return inputNumber === null || inputNumber === void 0 ? void 0 : inputNumber.startsWith(areaCode);
+          });
+          enableIspossibly = result;
+        }
+        var validation = enableIspossibly ? phoneNumber === null || phoneNumber === void 0 || (_phoneNumber$isPossib = phoneNumber.isPossible) === null || _phoneNumber$isPossib === void 0 ? void 0 : _phoneNumber$isPossib.call(phoneNumber) : phoneNumber === null || phoneNumber === void 0 || (_phoneNumber$isValid = phoneNumber.isValid) === null || _phoneNumber$isValid === void 0 ? void 0 : _phoneNumber$isValid.call(phoneNumber);
+        if (parseInt((_configs$validation_p = configs === null || configs === void 0 || (_configs$validation_p2 = configs.validation_phone_number_lib) === null || _configs$validation_p2 === void 0 ? void 0 : _configs$validation_p2.value) !== null && _configs$validation_p !== void 0 ? _configs$validation_p : 1, 10) && !validation) {
           errors.push(t('VALIDATION_ERROR_MOBILE_PHONE_INVALID', 'The field Phone number is invalid.'));
         }
       } else {
@@ -616,7 +629,7 @@ var CheckoutUI = function CheckoutUI(props) {
     cart: cart,
     loyaltyPlansState: loyaltyPlansState,
     businessConfigs: businessDetails === null || businessDetails === void 0 || (_businessDetails$busi12 = businessDetails.business) === null || _businessDetails$busi12 === void 0 ? void 0 : _businessDetails$busi12.configs
-  })))), /*#__PURE__*/_react.default.createElement(_styles.WrapperRightContainer, null, !!(!isMultiDriverTips && driverTipsField) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.DriverTipContainer, null, /*#__PURE__*/_react.default.createElement("h1", null, t('DRIVER_TIPS', 'Driver Tips')), /*#__PURE__*/_react.default.createElement("p", null, t('100%_OF_THE_TIP_YOUR_DRIVER', '100% of the tip goes to your driver')), /*#__PURE__*/_react.default.createElement(_DriverTips.DriverTips, {
+  })))), /*#__PURE__*/_react.default.createElement(_styles.WrapperRightContainer, null, isCustomerMode && /*#__PURE__*/_react.default.createElement(_OrderTypesSquares.OrderTypesSquares, null), !!(!isMultiDriverTips && driverTipsField) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.DriverTipContainer, null, /*#__PURE__*/_react.default.createElement("h1", null, t('DRIVER_TIPS', 'Driver Tips')), /*#__PURE__*/_react.default.createElement("p", null, t('100%_OF_THE_TIP_YOUR_DRIVER', '100% of the tip goes to your driver')), /*#__PURE__*/_react.default.createElement(_DriverTips.DriverTips, {
     businessId: cart === null || cart === void 0 ? void 0 : cart.business_id,
     driverTipsOptions: driverTipsOptions,
     isFixedPrice: parseInt(configs === null || configs === void 0 || (_configs$driver_tip_t = configs.driver_tip_type) === null || _configs$driver_tip_t === void 0 ? void 0 : _configs$driver_tip_t.value, 10) === 1,
@@ -760,6 +773,11 @@ var CheckoutUI = function CheckoutUI(props) {
       return setOpenModal(_objectSpread(_objectSpread({}, openModal), {}, {
         orderDetail: false
       }));
+    },
+    title: orderTypeList[(options === null || options === void 0 ? void 0 : options.type) - 1] || t('DELIVERY', 'Delivery'),
+    titleStyle: {
+      color: theme === null || theme === void 0 || (_theme$colors2 = theme.colors) === null || _theme$colors2 === void 0 ? void 0 : _theme$colors2.primary,
+      fontSize: 30
     }
   }, /*#__PURE__*/_react.default.createElement(_OrderDetail.OrderDetail, {
     item: cart,

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

@@ -25,4 +25,4 @@ var WrapperInput = exports.WrapperInput = _styledComponents.default.div(_templat
 var DriverTipMessage = exports.DriverTipMessage = _styledComponents.default.p(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  color: ", ";\n  font-weight: 600;\n"])), function (props) {
   return props.theme.colors.primary;
 });
-var WrapperTips = exports.WrapperTips = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  justify-content: flex-start;\n  align-items: center;\n  flex-wrap: wrap;\n\n  > div {\n    margin: 5px;\n  }\n"])));
+var WrapperTips = exports.WrapperTips = _styledComponents.default.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  justify-content: flex-start;\n  align-items: center;\n  flex-wrap: wrap;\n\n  > div {\n    margin: 5px;\n    text-align: center;\n  }\n"])));