ordering-ui-external 10.10.21 → 10.10.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/_bundles/{7.ordering-ui.a1b82448a61fa584c927.js → 7.ordering-ui.40e61237ed46b8c579a3.js} +1 -1
  2. package/_bundles/ordering-ui.40e61237ed46b8c579a3.js +2 -0
  3. package/_modules/themes/five/src/components/BusinessProductsList/SubcategoriesComponent/index.js +57 -0
  4. package/_modules/themes/five/src/components/BusinessProductsList/index.js +21 -63
  5. package/_modules/themes/five/src/components/SingleProductCard/layouts/original/index.js +7 -13
  6. package/package.json +2 -2
  7. package/src/themes/five/src/components/BusinessProductsList/SubcategoriesComponent/index.js +57 -0
  8. package/src/themes/five/src/components/BusinessProductsList/index.js +13 -64
  9. package/src/themes/five/src/components/SingleProductCard/layouts/original/index.js +12 -17
  10. package/_bundles/ordering-ui.a1b82448a61fa584c927.js +0 -2
  11. /package/_bundles/{0.ordering-ui.a1b82448a61fa584c927.js → 0.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  12. /package/_bundles/{1.ordering-ui.a1b82448a61fa584c927.js → 1.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  13. /package/_bundles/{2.ordering-ui.a1b82448a61fa584c927.js → 2.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  14. /package/_bundles/{4.ordering-ui.a1b82448a61fa584c927.js → 4.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  15. /package/_bundles/{5.ordering-ui.a1b82448a61fa584c927.js → 5.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  16. /package/_bundles/{6.ordering-ui.a1b82448a61fa584c927.js → 6.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  17. /package/_bundles/{7.ordering-ui.a1b82448a61fa584c927.js.LICENSE.txt → 7.ordering-ui.40e61237ed46b8c579a3.js.LICENSE.txt} +0 -0
  18. /package/_bundles/{8.ordering-ui.a1b82448a61fa584c927.js → 8.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  19. /package/_bundles/{9.ordering-ui.a1b82448a61fa584c927.js → 9.ordering-ui.40e61237ed46b8c579a3.js} +0 -0
  20. /package/_bundles/{ordering-ui.a1b82448a61fa584c927.js.LICENSE.txt → ordering-ui.40e61237ed46b8c579a3.js.LICENSE.txt} +0 -0
package/_modules/themes/five/src/components/BusinessProductsList/SubcategoriesComponent/index.js ADDED
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.SubcategoriesComponent = void 0;
7
+ var _orderingComponentsExternal = require("ordering-components-external");
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _styles = require("../styles");
10
+ var _AutoScroll = require("../../AutoScroll");
11
+ var _reactBootstrapIcons = require("react-bootstrap-icons");
12
+ var _Buttons = require("../../../styles/Buttons");
13
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
14
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
15
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
16
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
17
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
18
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
19
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
20
+ var subcategoriesComponentPropsAreEqual = function subcategoriesComponentPropsAreEqual(prevProps, nextProps) {
21
+ return JSON.stringify(prevProps.category) === JSON.stringify(nextProps.category) && JSON.stringify(prevProps.subcategoriesSelected) === JSON.stringify(nextProps.subcategoriesSelected);
22
+ };
23
+ var SubcategoriesComponent = exports.SubcategoriesComponent = /*#__PURE__*/_react.default.memo(function (props) {
24
+ var _category$subcategori;
25
+ var category = props.category,
26
+ subcategoriesSelected = props.subcategoriesSelected,
27
+ onClickSubcategory = props.onClickSubcategory;
28
+ var _useLanguage = (0, _orderingComponentsExternal.useLanguage)(),
29
+ _useLanguage2 = _slicedToArray(_useLanguage, 2),
30
+ t = _useLanguage2[1];
31
+ var allsubcategorySelected = !(subcategoriesSelected !== null && subcategoriesSelected !== void 0 && subcategoriesSelected.some(function (subcategory) {
32
+ return (category === null || category === void 0 ? void 0 : category.id) === (subcategory === null || subcategory === void 0 ? void 0 : subcategory.parent_category_id);
33
+ }));
34
+ return /*#__PURE__*/_react.default.createElement(_styles.SubCategoriesContainer, null, /*#__PURE__*/_react.default.createElement(_styles.SubCategoriesInnerContainer, null, /*#__PURE__*/_react.default.createElement(_AutoScroll.AutoScroll, {
35
+ scrollId: "scroll_".concat(category === null || category === void 0 ? void 0 : category.id)
36
+ }, /*#__PURE__*/_react.default.createElement(_styles.ContainerButton, {
37
+ isSelected: allsubcategorySelected
38
+ }, /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
39
+ onClick: function onClick() {
40
+ return onClickSubcategory(null, category);
41
+ },
42
+ color: allsubcategorySelected ? 'primary' : 'lightGray'
43
+ }, t('ALL', 'All'))), category === null || category === void 0 || (_category$subcategori = category.subcategories) === null || _category$subcategori === void 0 ? void 0 : _category$subcategori.map(function (subcategory) {
44
+ var isSubcategorySelected = subcategoriesSelected === null || subcategoriesSelected === void 0 ? void 0 : subcategoriesSelected.find(function (_subcategory) {
45
+ return (_subcategory === null || _subcategory === void 0 ? void 0 : _subcategory.id) === (subcategory === null || subcategory === void 0 ? void 0 : subcategory.id);
46
+ });
47
+ return /*#__PURE__*/_react.default.createElement(_styles.ContainerButton, {
48
+ key: subcategory === null || subcategory === void 0 ? void 0 : subcategory.id,
49
+ isSelected: isSubcategorySelected
50
+ }, /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
51
+ onClick: function onClick() {
52
+ return onClickSubcategory(subcategory, category);
53
+ },
54
+ color: isSubcategorySelected ? 'primary' : 'lightGray'
55
+ }, subcategory === null || subcategory === void 0 ? void 0 : subcategory.name, " ", isSubcategorySelected && /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.XLg, null)));
56
+ }))));
57
+ }, subcategoriesComponentPropsAreEqual);
package/_modules/themes/five/src/components/BusinessProductsList/index.js CHANGED
@@ -12,9 +12,8 @@ var _NotFoundSource = require("../NotFoundSource");
12
12
  var _Modal = require("../Modal");
13
13
  var _utils = require("../../../../../utils");
14
14
  var _AutoScroll = require("../AutoScroll");
15
- var _reactBootstrapIcons = require("react-bootstrap-icons");
16
15
  var _styles = require("./styles");
17
- var _Buttons = require("../../styles/Buttons");
16
+ var _SubcategoriesComponent = require("./SubcategoriesComponent");
18
17
  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); }
19
18
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
20
19
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -22,7 +21,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
22
21
  function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
23
22
  function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
24
23
  function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
25
- 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); }
26
24
  function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
27
25
  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."); }
28
26
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
@@ -34,7 +32,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
34
32
  function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
35
33
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
36
34
  var BusinessProductsListUI = function BusinessProductsListUI(props) {
37
- var _configs$use_parent_c, _configs$use_parent_c2, _categoryState$produc, _props$beforeElements, _props$beforeComponen, _category$subcategori2, _category$subcategori3, _category$subcategori4, _headerRef$current, _categoryState$produc2, _categoryState$produc3, _categoryState$produc4, _categoryState$produc9, _props$afterComponent, _props$afterElements;
35
+ var _configs$use_parent_c, _configs$use_parent_c2, _categoryState$produc, _category$subcategori, _category$subcategori2, _category$subcategori3, _headerRef$current, _categoryState$produc2, _categoryState$produc3, _categoryState$produc4, _categoryState$produc9;
38
36
  var errors = props.errors,
39
37
  businessId = props.businessId,
40
38
  isLazy = props.isLazy,
@@ -91,36 +89,6 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
91
89
  setSubcategoriesSelected([].concat(_toConsumableArray(subcategoriesSelected), [subCategory]));
92
90
  }
93
91
  };
94
- var SubcategoriesComponent = function SubcategoriesComponent(_ref) {
95
- var _category$subcategori;
96
- var category = _ref.category;
97
- var allsubcategorySelected = !(subcategoriesSelected !== null && subcategoriesSelected !== void 0 && subcategoriesSelected.some(function (subcategory) {
98
- return (category === null || category === void 0 ? void 0 : category.id) === (subcategory === null || subcategory === void 0 ? void 0 : subcategory.parent_category_id);
99
- }));
100
- return /*#__PURE__*/_react.default.createElement(_styles.SubCategoriesContainer, null, /*#__PURE__*/_react.default.createElement(_styles.SubCategoriesInnerContainer, null, /*#__PURE__*/_react.default.createElement(_AutoScroll.AutoScroll, {
101
- scrollId: "scroll_".concat(category === null || category === void 0 ? void 0 : category.id)
102
- }, /*#__PURE__*/_react.default.createElement(_styles.ContainerButton, {
103
- isSelected: allsubcategorySelected
104
- }, /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
105
- onClick: function onClick() {
106
- return onClickSubcategory(null, category);
107
- },
108
- color: allsubcategorySelected ? 'primary' : 'lightGray'
109
- }, t('ALL', 'All'))), category === null || category === void 0 || (_category$subcategori = category.subcategories) === null || _category$subcategori === void 0 ? void 0 : _category$subcategori.map(function (subcategory) {
110
- var isSubcategorySelected = subcategoriesSelected === null || subcategoriesSelected === void 0 ? void 0 : subcategoriesSelected.find(function (_subcategory) {
111
- return (_subcategory === null || _subcategory === void 0 ? void 0 : _subcategory.id) === (subcategory === null || subcategory === void 0 ? void 0 : subcategory.id);
112
- });
113
- return /*#__PURE__*/_react.default.createElement(_styles.ContainerButton, {
114
- key: subcategory === null || subcategory === void 0 ? void 0 : subcategory.id,
115
- isSelected: isSubcategorySelected
116
- }, /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
117
- onClick: function onClick() {
118
- return onClickSubcategory(subcategory, category);
119
- },
120
- color: isSubcategorySelected ? 'primary' : 'lightGray'
121
- }, subcategory === null || subcategory === void 0 ? void 0 : subcategory.name, " ", isSubcategorySelected && /*#__PURE__*/_react.default.createElement(_reactBootstrapIcons.XLg, null)));
122
- }))));
123
- };
124
92
  var productsCategorySelected = (_categoryState$produc = categoryState.products) === null || _categoryState$produc === void 0 ? void 0 : _categoryState$produc.filter(function (product) {
125
93
  return !(subcategoriesSelected !== null && subcategoriesSelected !== void 0 && subcategoriesSelected.find(function (subcategory) {
126
94
  return (subcategory === null || subcategory === void 0 ? void 0 : subcategory.parent_category_id) === (category === null || category === void 0 ? void 0 : category.id);
@@ -128,16 +96,10 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
128
96
  return subcategory.id === (product === null || product === void 0 ? void 0 : product.category_id);
129
97
  }));
130
98
  });
131
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (_props$beforeElements = props.beforeElements) === null || _props$beforeElements === void 0 ? void 0 : _props$beforeElements.map(function (BeforeElement, i) {
132
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
133
- key: i
134
- }, BeforeElement);
135
- }), (_props$beforeComponen = props.beforeComponents) === null || _props$beforeComponen === void 0 ? void 0 : _props$beforeComponen.map(function (BeforeComponent, i) {
136
- return /*#__PURE__*/_react.default.createElement(BeforeComponent, _extends({
137
- key: i
138
- }, props));
139
- }), /*#__PURE__*/_react.default.createElement(_styles.ProductsContainer, null, (category === null || category === void 0 ? void 0 : category.id) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.HeaderWrapper, null, (category === null || category === void 0 || (_category$subcategori2 = category.subcategories) === null || _category$subcategori2 === void 0 ? void 0 : _category$subcategori2.length) > 0 && !isSearchMode && /*#__PURE__*/_react.default.createElement(SubcategoriesComponent, {
140
- category: category
99
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.ProductsContainer, null, (category === null || category === void 0 ? void 0 : category.id) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles.HeaderWrapper, null, (category === null || category === void 0 || (_category$subcategori = category.subcategories) === null || _category$subcategori === void 0 ? void 0 : _category$subcategori.length) > 0 && !isSearchMode && /*#__PURE__*/_react.default.createElement(_SubcategoriesComponent.SubcategoriesComponent, {
100
+ category: category,
101
+ subcategoriesSelected: subcategoriesSelected,
102
+ onClickSubcategory: onClickSubcategory
141
103
  })), /*#__PURE__*/_react.default.createElement(_styles.ProductsListing, null, productsCategorySelected.map(function (product, i) {
142
104
  var _currentCart$products;
143
105
  return /*#__PURE__*/_react.default.createElement(_SingleProductCard.SingleProductCard, {
@@ -153,11 +115,11 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
153
115
  return productsLength + ((Cproduct === null || Cproduct === void 0 ? void 0 : Cproduct.id) === (product === null || product === void 0 ? void 0 : product.id) ? Cproduct === null || Cproduct === void 0 ? void 0 : Cproduct.quantity : 0);
154
116
  }, 0)
155
117
  });
156
- })), isSearchMode && (category === null || category === void 0 || (_category$subcategori3 = category.subcategories) === null || _category$subcategori3 === void 0 ? void 0 : _category$subcategori3.length) > 0 && (category === null || category === void 0 || (_category$subcategori4 = category.subcategories) === null || _category$subcategori4 === void 0 || (_category$subcategori4 = _category$subcategori4.filter(function (subcategory) {
118
+ })), isSearchMode && (category === null || category === void 0 || (_category$subcategori2 = category.subcategories) === null || _category$subcategori2 === void 0 ? void 0 : _category$subcategori2.length) > 0 && (category === null || category === void 0 || (_category$subcategori3 = category.subcategories) === null || _category$subcategori3 === void 0 || (_category$subcategori3 = _category$subcategori3.filter(function (subcategory) {
157
119
  return productsCategorySelected === null || productsCategorySelected === void 0 ? void 0 : productsCategorySelected.some(function (product) {
158
120
  return (product === null || product === void 0 ? void 0 : product.category_id) === (subcategory === null || subcategory === void 0 ? void 0 : subcategory.id);
159
121
  });
160
- })) === null || _category$subcategori4 === void 0 ? void 0 : _category$subcategori4.map(function (subcategory) {
122
+ })) === null || _category$subcategori3 === void 0 ? void 0 : _category$subcategori3.map(function (subcategory) {
161
123
  var _productsCategorySele;
162
124
  return /*#__PURE__*/_react.default.createElement(_styles.SubcategorySearchContainer, {
163
125
  key: subcategory === null || subcategory === void 0 ? void 0 : subcategory.id
@@ -221,7 +183,9 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
221
183
  return productsLength + ((Cproduct === null || Cproduct === void 0 ? void 0 : Cproduct.id) === (product === null || product === void 0 ? void 0 : product.id) ? Cproduct === null || Cproduct === void 0 ? void 0 : Cproduct.quantity : 0);
222
184
  }, 0)
223
185
  });
224
- }), !(business !== null && business !== void 0 && business.food) && !(categoryState !== null && categoryState !== void 0 && categoryState.loading) && (categoryState === null || categoryState === void 0 || (_categoryState$produc4 = categoryState.products) === null || _categoryState$produc4 === void 0 ? void 0 : _categoryState$produc4.length) > 9 && /*#__PURE__*/_react.default.createElement(_SingleProductCard.SingleProductCard, {
186
+ }), !(business !== null && business !== void 0 && business.food) && !(categoryState !== null && categoryState !== void 0 && categoryState.loading) && (categoryState === null || categoryState === void 0 || (_categoryState$produc4 = categoryState.products) === null || _categoryState$produc4 === void 0 || (_categoryState$produc4 = _categoryState$produc4.filter(function (product) {
187
+ return product.featured;
188
+ })) === null || _categoryState$produc4 === void 0 ? void 0 : _categoryState$produc4.length) > 9 && /*#__PURE__*/_react.default.createElement(_SingleProductCard.SingleProductCard, {
225
189
  useCustomFunctionality: true,
226
190
  onCustomClick: function onCustomClick() {
227
191
  return onClickCategory(category);
@@ -236,7 +200,7 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
236
200
  })))), !(category !== null && category !== void 0 && category.id) && categories.filter(function (category) {
237
201
  return (category === null || category === void 0 ? void 0 : category.id) !== null;
238
202
  }).map(function (category, i, _categories) {
239
- var _categoryState$produc5, _categoryState$produc6, _categoryState$produc7, _categoryState$produc8, _category$description, _category$description2, _category$subcategori5, _category$subcategori6, _category$ribbon, _category$ribbon2, _category$ribbon3, _category$ribbon4, _category$ribbon5, _headerRef$current2, _category$description3, _category$subcategori7, _category$subcategori8, _products$filter, _category$subcategori9, _category$subcategori10;
203
+ var _categoryState$produc5, _categoryState$produc6, _categoryState$produc7, _categoryState$produc8, _category$description, _category$description2, _category$subcategori4, _category$subcategori5, _category$ribbon, _category$ribbon2, _category$ribbon3, _category$ribbon4, _category$ribbon5, _headerRef$current2, _category$description3, _category$subcategori6, _category$subcategori7, _products$filter, _category$subcategori8, _category$subcategori9;
240
204
  var _products = !isUseParentCategory ? (_categoryState$produc5 = categoryState === null || categoryState === void 0 || (_categoryState$produc6 = categoryState.products) === null || _categoryState$produc6 === void 0 ? void 0 : _categoryState$produc6.filter(function (product) {
241
205
  return (product === null || product === void 0 ? void 0 : product.category_id) === (category === null || category === void 0 ? void 0 : category.id);
242
206
  })) !== null && _categoryState$produc5 !== void 0 ? _categoryState$produc5 : [] : (_categoryState$produc7 = categoryState === null || categoryState === void 0 || (_categoryState$produc8 = categoryState.products) === null || _categoryState$produc8 === void 0 ? void 0 : _categoryState$produc8.filter(function (product) {
@@ -256,7 +220,7 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
256
220
  });
257
221
  }) : _products;
258
222
  var shortCategoryDescription = (category === null || category === void 0 || (_category$description = category.description) === null || _category$description === void 0 ? void 0 : _category$description.length) > 200 ? "".concat(category === null || category === void 0 || (_category$description2 = category.description) === null || _category$description2 === void 0 ? void 0 : _category$description2.substring(0, 200), "...") : category === null || category === void 0 ? void 0 : category.description;
259
- var isSubcategorySearch = isSearchMode && (category === null || category === void 0 || (_category$subcategori5 = category.subcategories) === null || _category$subcategori5 === void 0 ? void 0 : _category$subcategori5.length) > 0 && (category === null || category === void 0 || (_category$subcategori6 = category.subcategories) === null || _category$subcategori6 === void 0 ? void 0 : _category$subcategori6.some(function (subcategory) {
223
+ var isSubcategorySearch = isSearchMode && (category === null || category === void 0 || (_category$subcategori4 = category.subcategories) === null || _category$subcategori4 === void 0 ? void 0 : _category$subcategori4.length) > 0 && (category === null || category === void 0 || (_category$subcategori5 = category.subcategories) === null || _category$subcategori5 === void 0 ? void 0 : _category$subcategori5.some(function (subcategory) {
260
224
  return products === null || products === void 0 ? void 0 : products.some(function (product) {
261
225
  return (product === null || product === void 0 ? void 0 : product.category_id) === (subcategory === null || subcategory === void 0 ? void 0 : subcategory.id);
262
226
  });
@@ -281,11 +245,13 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
281
245
  onClick: function onClick() {
282
246
  return setOpenDescription(category);
283
247
  }
284
- }, t('VIEW_MORE', 'View more'))), (category === null || category === void 0 || (_category$subcategori7 = category.subcategories) === null || _category$subcategori7 === void 0 ? void 0 : _category$subcategori7.length) > 0 && !isSearchMode && /*#__PURE__*/_react.default.createElement(SubcategoriesComponent, {
285
- category: category
248
+ }, t('VIEW_MORE', 'View more'))), (category === null || category === void 0 || (_category$subcategori6 = category.subcategories) === null || _category$subcategori6 === void 0 ? void 0 : _category$subcategori6.length) > 0 && !isSearchMode && /*#__PURE__*/_react.default.createElement(_SubcategoriesComponent.SubcategoriesComponent, {
249
+ category: category,
250
+ subcategoriesSelected: subcategoriesSelected,
251
+ onClickSubcategory: onClickSubcategory
286
252
  })), /*#__PURE__*/_react.default.createElement(_styles.ProductsListing, {
287
253
  isSubcategorySearch: isSubcategorySearch
288
- }, isSearchMode && (category === null || category === void 0 || (_category$subcategori8 = category.subcategories) === null || _category$subcategori8 === void 0 ? void 0 : _category$subcategori8.length) > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, products === null || products === void 0 || (_products$filter = products.filter(function (product, i) {
254
+ }, isSearchMode && (category === null || category === void 0 || (_category$subcategori7 = category.subcategories) === null || _category$subcategori7 === void 0 ? void 0 : _category$subcategori7.length) > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, products === null || products === void 0 || (_products$filter = products.filter(function (product, i) {
289
255
  return i < 9 && (product === null || product === void 0 ? void 0 : product.category_id) === (category === null || category === void 0 ? void 0 : category.id) || (business === null || business === void 0 ? void 0 : business.food);
290
256
  })) === null || _products$filter === void 0 ? void 0 : _products$filter.map(function (product, i) {
291
257
  var _currentCart$products5;
@@ -348,11 +314,11 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
348
314
  key: "skeleton:".concat(i),
349
315
  isSkeleton: true
350
316
  });
351
- })), isSearchMode && (category === null || category === void 0 || (_category$subcategori9 = category.subcategories) === null || _category$subcategori9 === void 0 ? void 0 : _category$subcategori9.length) > 0 && (category === null || category === void 0 || (_category$subcategori10 = category.subcategories) === null || _category$subcategori10 === void 0 || (_category$subcategori10 = _category$subcategori10.filter(function (subcategory) {
317
+ })), isSearchMode && (category === null || category === void 0 || (_category$subcategori8 = category.subcategories) === null || _category$subcategori8 === void 0 ? void 0 : _category$subcategori8.length) > 0 && (category === null || category === void 0 || (_category$subcategori9 = category.subcategories) === null || _category$subcategori9 === void 0 || (_category$subcategori9 = _category$subcategori9.filter(function (subcategory) {
352
318
  return products === null || products === void 0 ? void 0 : products.some(function (product) {
353
319
  return (product === null || product === void 0 ? void 0 : product.category_id) === (subcategory === null || subcategory === void 0 ? void 0 : subcategory.id);
354
320
  });
355
- })) === null || _category$subcategori10 === void 0 ? void 0 : _category$subcategori10.map(function (subcategory) {
321
+ })) === null || _category$subcategori9 === void 0 ? void 0 : _category$subcategori9.map(function (subcategory) {
356
322
  var _products$filter2;
357
323
  return /*#__PURE__*/_react.default.createElement(_styles.SubcategorySearchContainer, {
358
324
  key: subcategory === null || subcategory === void 0 ? void 0 : subcategory.id
@@ -400,15 +366,7 @@ var BusinessProductsListUI = function BusinessProductsListUI(props) {
400
366
  }
401
367
  }, /*#__PURE__*/_react.default.createElement(_styles.DescriptionModalContainer, null, (openDescription === null || openDescription === void 0 ? void 0 : openDescription.image) && /*#__PURE__*/_react.default.createElement("img", {
402
368
  src: openDescription.image
403
- }), /*#__PURE__*/_react.default.createElement(_styles.DescriptionContainer, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, openDescription === null || openDescription === void 0 ? void 0 : openDescription.description)))))), (_props$afterComponent = props.afterComponents) === null || _props$afterComponent === void 0 ? void 0 : _props$afterComponent.map(function (AfterComponent, i) {
404
- return /*#__PURE__*/_react.default.createElement(AfterComponent, _extends({
405
- key: i
406
- }, props));
407
- }), (_props$afterElements = props.afterElements) === null || _props$afterElements === void 0 ? void 0 : _props$afterElements.map(function (AfterElement, i) {
408
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
409
- key: i
410
- }, AfterElement);
411
- }));
369
+ }), /*#__PURE__*/_react.default.createElement(_styles.DescriptionContainer, null, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, openDescription === null || openDescription === void 0 ? void 0 : openDescription.description)))))));
412
370
  };
413
371
  var BusinessProductsList = exports.BusinessProductsList = function BusinessProductsList(props) {
414
372
  var businessProductsListProps = _objectSpread(_objectSpread({}, props), {}, {
package/_modules/themes/five/src/components/SingleProductCard/layouts/original/index.js CHANGED
@@ -37,7 +37,10 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
37
37
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
38
38
  function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
39
39
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
40
- var SingleProductCardUI = function SingleProductCardUI(props) {
40
+ var singleProductCardPropsAreEqual = function singleProductCardPropsAreEqual(prevProps, nextProps) {
41
+ return JSON.stringify(prevProps.product) === JSON.stringify(nextProps.product) && prevProps.isSkeleton === nextProps.isSkeleton && prevProps.isSoldOut === nextProps.isSoldOut && prevProps.isCartOnProductsList === nextProps.isCartOnProductsList && prevProps.productAddedToCartLength === nextProps.productAddedToCartLength;
42
+ };
43
+ var SingleProductCardUI = /*#__PURE__*/_react.default.memo(function (props) {
41
44
  var _theme$business_view$, _theme$business_view, _theme$business_view2, _theme$business_view3, _theme$viewString, _theme$business_view4, _theme$images, _theme$images2, _product$ribbon, _product$ribbon2, _product$ribbon3, _product$ribbon4, _product$ribbon5, _theme$images3, _product$ribbon6, _theme$defaultLanguag, _theme$defaultLanguag2, _theme$defaultLanguag3, _theme$defaultLanguag4;
42
45
  var product = props.product,
43
46
  isSoldOut = props.isSoldOut,
@@ -175,7 +178,7 @@ var SingleProductCardUI = function SingleProductCardUI(props) {
175
178
  style: useCustomFunctionality && customStyle,
176
179
  className: "product-card",
177
180
  isShowAddButt: !useCustomFunctionality && !hideAddButton && !isSkeleton
178
- }, isObservedValidation ? /*#__PURE__*/_react.default.createElement("div", null, !useCustomFunctionality && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !isSkeleton && productAddedToCartLength > 0 && /*#__PURE__*/_react.default.createElement(_styles.QuantityContainer, null, /*#__PURE__*/_react.default.createElement("span", null, productAddedToCartLength)), /*#__PURE__*/_react.default.createElement(_styles.CardInfo, {
181
+ }, isObservedValidation && /*#__PURE__*/_react.default.createElement("div", null, !useCustomFunctionality && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !isSkeleton && productAddedToCartLength > 0 && /*#__PURE__*/_react.default.createElement(_styles.QuantityContainer, null, /*#__PURE__*/_react.default.createElement("span", null, productAddedToCartLength)), /*#__PURE__*/_react.default.createElement(_styles.CardInfo, {
179
182
  soldOut: isSoldOut || maxProductQuantity <= 0,
180
183
  isBgimage: optimizeImage((product === null || product === void 0 ? void 0 : product.images) || (theme === null || theme === void 0 || (_theme$images = theme.images) === null || _theme$images === void 0 || (_theme$images = _theme$images.dummies) === null || _theme$images === void 0 ? void 0 : _theme$images.product), 'h_86,c_limit'),
181
184
  oneLine: isPreviously
@@ -230,16 +233,7 @@ var SingleProductCardUI = function SingleProductCardUI(props) {
230
233
  fontSize: 16,
231
234
  fontWeight: 500
232
235
  }
233
- }, customText)) : /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_styles.SkeletonCardInfo, null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
234
- width: 100
235
- }), /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
236
- width: 100
237
- }), /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
238
- width: 100
239
- })), /*#__PURE__*/_react.default.createElement(_styles.SkeletonCardLogo, null, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
240
- height: 75,
241
- width: 75
242
- }))), !useCustomFunctionality && !hideAddButton && !isSkeleton && /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
236
+ }, customText)), !useCustomFunctionality && !hideAddButton && !isSkeleton && /*#__PURE__*/_react.default.createElement(_Buttons.Button, {
243
237
  outline: true,
244
238
  color: "primary",
245
239
  disabled: productAddedToCartLength && (product === null || product === void 0 ? void 0 : product.maximum_per_order) && productAddedToCartLength >= (product === null || product === void 0 ? void 0 : product.maximum_per_order)
@@ -312,7 +306,7 @@ var SingleProductCardUI = function SingleProductCardUI(props) {
312
306
  },
313
307
  closeOnBackdrop: false
314
308
  }));
315
- };
309
+ }, singleProductCardPropsAreEqual);
316
310
  var SingleProductCard = exports.SingleProductCard = function SingleProductCard(props) {
317
311
  var singleProductCardProps = _objectSpread(_objectSpread({}, props), {}, {
318
312
  UIComponent: SingleProductCardUI
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ordering-ui-external",
3
- "version": "10.10.21",
3
+ "version": "10.10.23",
4
4
  "description": "Ordering UI Components",
5
5
  "main": "./_modules/index.js",
6
6
  "exports": {
@@ -88,7 +88,7 @@
88
88
  "lodash": "^4.17.19",
89
89
  "moment": "^2.29.4",
90
90
  "nanoid": "^4.0.0",
91
- "ordering-components-external": "9.11.18",
91
+ "ordering-components-external": "9.11.19",
92
92
  "payment": "^2.4.6",
93
93
  "polished": "^3.6.6",
94
94
  "react-bootstrap-icons": "^1.7.2",
package/src/themes/five/src/components/BusinessProductsList/SubcategoriesComponent/index.js ADDED
@@ -0,0 +1,57 @@
1
+ import { useLanguage } from 'ordering-components-external'
2
+ import React from 'react'
3
+ import { ContainerButton, SubCategoriesContainer, SubCategoriesInnerContainer } from '../styles'
4
+ import { AutoScroll } from '../../AutoScroll'
5
+ import { XLg as Close } from 'react-bootstrap-icons'
6
+ import { Button } from '../../../styles/Buttons'
7
+
8
+ const subcategoriesComponentPropsAreEqual = (prevProps, nextProps) => {
9
+ return JSON.stringify(prevProps.category) === JSON.stringify(nextProps.category) &&
10
+ JSON.stringify(prevProps.subcategoriesSelected) === JSON.stringify(nextProps.subcategoriesSelected)
11
+ }
12
+
13
+ export const SubcategoriesComponent = React.memo((props) => {
14
+ const {
15
+ category,
16
+ subcategoriesSelected,
17
+ onClickSubcategory
18
+ } = props
19
+
20
+ const [, t] = useLanguage()
21
+ const allsubcategorySelected = !subcategoriesSelected?.some(subcategory => category?.id === subcategory?.parent_category_id)
22
+ return (
23
+ <SubCategoriesContainer>
24
+ <SubCategoriesInnerContainer>
25
+ <AutoScroll scrollId={`scroll_${category?.id}`}>
26
+ <ContainerButton
27
+ isSelected={allsubcategorySelected}
28
+ >
29
+ <Button
30
+ onClick={() => onClickSubcategory(null, category)}
31
+ color={allsubcategorySelected ? 'primary' : 'lightGray'}
32
+ >
33
+ {t('ALL', 'All')}
34
+ </Button>
35
+ </ContainerButton>
36
+ {category?.subcategories?.map(subcategory => {
37
+ const isSubcategorySelected = subcategoriesSelected?.find(_subcategory => _subcategory?.id === subcategory?.id)
38
+ return (
39
+ <ContainerButton
40
+ key={subcategory?.id}
41
+ isSelected={isSubcategorySelected}
42
+ >
43
+ <Button
44
+ onClick={() => onClickSubcategory(subcategory, category)}
45
+ color={isSubcategorySelected ? 'primary' : 'lightGray'}
46
+ >
47
+ {subcategory?.name} {isSubcategorySelected && <Close />}
48
+ </Button>
49
+ </ContainerButton>
50
+ )
51
+ }
52
+ )}
53
+ </AutoScroll>
54
+ </SubCategoriesInnerContainer>
55
+ </SubCategoriesContainer>
56
+ )
57
+ }, subcategoriesComponentPropsAreEqual)
package/src/themes/five/src/components/BusinessProductsList/index.js CHANGED
@@ -6,7 +6,6 @@ import { NotFoundSource } from '../NotFoundSource'
6
6
  import { Modal } from '../Modal'
7
7
  import { shape } from '../../../../../utils'
8
8
  import { AutoScroll } from '../AutoScroll'
9
- import { XLg as Close } from 'react-bootstrap-icons'
10
9
 
11
10
  import {
12
11
  ProductsContainer,
@@ -17,16 +16,13 @@ import {
17
16
  HeaderWrapper,
18
17
  DescriptionModalContainer,
19
18
  RibbonBox,
20
- SubCategoriesContainer,
21
- ContainerButton,
22
19
  CategoryDescription,
23
20
  DescriptionContainer,
24
21
  SubcategorySearchContainer,
25
- SubCategoriesInnerContainer,
26
22
  PreviouslyOrderedContainer,
27
23
  PreviouslyOrderedWrapper
28
24
  } from './styles'
29
- import { Button } from '../../styles/Buttons'
25
+ import { SubcategoriesComponent } from './SubcategoriesComponent'
30
26
 
31
27
  const BusinessProductsListUI = (props) => {
32
28
  const {
@@ -60,6 +56,7 @@ const BusinessProductsListUI = (props) => {
60
56
  const isUseParentCategory = configs?.use_parent_category?.value === 'true' || configs?.use_parent_category?.value === '1'
61
57
  const [openDescription, setOpenDescription] = useState(null)
62
58
  const headerRef = useRef()
59
+
63
60
  const onClickSubcategory = (subCategory, parentCategory) => {
64
61
  if (parentCategory && isLazy) {
65
62
  onClickCategory(parentCategory)
@@ -76,46 +73,6 @@ const BusinessProductsListUI = (props) => {
76
73
  }
77
74
  }
78
75
 
79
- const SubcategoriesComponent = ({ category }) => {
80
- const allsubcategorySelected = !subcategoriesSelected?.some(subcategory => category?.id === subcategory?.parent_category_id)
81
-
82
- return (
83
- <SubCategoriesContainer>
84
- <SubCategoriesInnerContainer>
85
- <AutoScroll scrollId={`scroll_${category?.id}`}>
86
- <ContainerButton
87
- isSelected={allsubcategorySelected}
88
- >
89
- <Button
90
- onClick={() => onClickSubcategory(null, category)}
91
- color={allsubcategorySelected ? 'primary' : 'lightGray'}
92
- >
93
- {t('ALL', 'All')}
94
- </Button>
95
- </ContainerButton>
96
- {category?.subcategories?.map(subcategory => {
97
- const isSubcategorySelected = subcategoriesSelected?.find(_subcategory => _subcategory?.id === subcategory?.id)
98
- return (
99
- <ContainerButton
100
- key={subcategory?.id}
101
- isSelected={isSubcategorySelected}
102
- >
103
- <Button
104
- onClick={() => onClickSubcategory(subcategory, category)}
105
- color={isSubcategorySelected ? 'primary' : 'lightGray'}
106
- >
107
- {subcategory?.name} {isSubcategorySelected && <Close />}
108
- </Button>
109
- </ContainerButton>
110
- )
111
- }
112
- )}
113
- </AutoScroll>
114
- </SubCategoriesInnerContainer>
115
- </SubCategoriesContainer>
116
- )
117
- }
118
-
119
76
  const productsCategorySelected = categoryState.products
120
77
  ?.filter(product =>
121
78
  !subcategoriesSelected?.find(subcategory => subcategory?.parent_category_id === category?.id) ||
@@ -123,18 +80,16 @@ const BusinessProductsListUI = (props) => {
123
80
 
124
81
  return (
125
82
  <>
126
- {props.beforeElements?.map((BeforeElement, i) => (
127
- <React.Fragment key={i}>
128
- {BeforeElement}
129
- </React.Fragment>))}
130
- {props.beforeComponents?.map((BeforeComponent, i) => (
131
- <BeforeComponent key={i} {...props} />))}
132
83
  <ProductsContainer>
133
84
  {category?.id && (
134
85
  <>
135
86
  <HeaderWrapper>
136
87
  {category?.subcategories?.length > 0 && !isSearchMode && (
137
- <SubcategoriesComponent category={category} />
88
+ <SubcategoriesComponent
89
+ category={category}
90
+ subcategoriesSelected={subcategoriesSelected}
91
+ onClickSubcategory={onClickSubcategory}
92
+ />
138
93
  )}
139
94
  </HeaderWrapper>
140
95
  <ProductsListing>
@@ -226,7 +181,7 @@ const BusinessProductsListUI = (props) => {
226
181
  productAddedToCartLength={currentCart?.products?.reduce((productsLength, Cproduct) => { return productsLength + (Cproduct?.id === product?.id ? Cproduct?.quantity : 0) }, 0)}
227
182
  />
228
183
  ))}
229
- {!business?.food && !categoryState?.loading && categoryState?.products?.length > 9 && (
184
+ {!business?.food && !categoryState?.loading && categoryState?.products?.filter(product => product.featured)?.length > 9 && (
230
185
  <SingleProductCard
231
186
  useCustomFunctionality
232
187
  onCustomClick={() => onClickCategory(category)}
@@ -293,7 +248,11 @@ const BusinessProductsListUI = (props) => {
293
248
  </CategoryDescription>
294
249
  )}
295
250
  {category?.subcategories?.length > 0 && !isSearchMode && (
296
- <SubcategoriesComponent category={category} />
251
+ <SubcategoriesComponent
252
+ category={category}
253
+ subcategoriesSelected={subcategoriesSelected}
254
+ onClickSubcategory={onClickSubcategory}
255
+ />
297
256
  )}
298
257
  </HeaderWrapper>
299
258
  <ProductsListing isSubcategorySearch={isSubcategorySearch}>
@@ -444,16 +403,6 @@ const BusinessProductsListUI = (props) => {
444
403
  </DescriptionModalContainer>
445
404
  </Modal>
446
405
  </ProductsContainer>
447
- {
448
- props.afterComponents?.map((AfterComponent, i) => (
449
- <AfterComponent key={i} {...props} />))
450
- }
451
- {
452
- props.afterElements?.map((AfterElement, i) => (
453
- <React.Fragment key={i}>
454
- {AfterElement}
455
- </React.Fragment>))
456
- }
457
406
  </>
458
407
  )
459
408
  }
package/src/themes/five/src/components/SingleProductCard/layouts/original/index.js CHANGED
@@ -22,13 +22,19 @@ import {
22
22
  QuantityContainer,
23
23
  RibbonBox,
24
24
  TitleWrapper,
25
- LastOrder,
26
- SkeletonCardInfo,
27
- SkeletonCardLogo
25
+ LastOrder
28
26
  } from './styles'
29
27
  import { Button } from '../../../../styles/Buttons'
30
28
 
31
- const SingleProductCardUI = (props) => {
29
+ const singleProductCardPropsAreEqual = (prevProps, nextProps) => {
30
+ return JSON.stringify(prevProps.product) === JSON.stringify(nextProps.product) &&
31
+ prevProps.isSkeleton === nextProps.isSkeleton &&
32
+ prevProps.isSoldOut === nextProps.isSoldOut &&
33
+ prevProps.isCartOnProductsList === nextProps.isCartOnProductsList &&
34
+ prevProps.productAddedToCartLength === nextProps.productAddedToCartLength
35
+ }
36
+
37
+ const SingleProductCardUI = React.memo((props) => {
32
38
  const {
33
39
  product,
34
40
  isSoldOut,
@@ -155,7 +161,7 @@ const SingleProductCardUI = (props) => {
155
161
  className='product-card'
156
162
  isShowAddButt={!useCustomFunctionality && !hideAddButton && !isSkeleton}
157
163
  >
158
- {isObservedValidation ? (
164
+ {isObservedValidation && (
159
165
  <div>
160
166
  {!useCustomFunctionality && (
161
167
  <>
@@ -230,17 +236,6 @@ const SingleProductCardUI = (props) => {
230
236
  <span style={{ fontSize: 16, fontWeight: 500 }}>{customText}</span>
231
237
  )}
232
238
  </div>
233
- ) : (
234
- <div>
235
- <SkeletonCardInfo>
236
- <Skeleton width={100} />
237
- <Skeleton width={100} />
238
- <Skeleton width={100} />
239
- </SkeletonCardInfo>
240
- <SkeletonCardLogo>
241
- <Skeleton height={75} width={75} />
242
- </SkeletonCardLogo>
243
- </div>
244
239
  )}
245
240
  {!useCustomFunctionality && !hideAddButton && !isSkeleton && (
246
241
  <Button outline color='primary' disabled={productAddedToCartLength && product?.maximum_per_order && productAddedToCartLength >= product?.maximum_per_order}>
@@ -320,7 +315,7 @@ const SingleProductCardUI = (props) => {
320
315
  />
321
316
  </>
322
317
  )
323
- }
318
+ }, singleProductCardPropsAreEqual)
324
319
 
325
320
  export const SingleProductCard = (props) => {
326
321
  const singleProductCardProps = {