@bonlineza/luxity-lib 2.35.1 → 2.35.3

package/AddInterest.js

@@ -3043,37 +3043,41 @@
   };
   var GenderSelector$1 = themed(GenderSelector);
 
-  var Add = (function (props) {
-    return /*#__PURE__*/React__default.createElement("svg", _extends({
-      width: "23",
-      height: "23",
-      viewBox: "0 0 23 23",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg"
-    }, props), /*#__PURE__*/React__default.createElement("path", {
-      d: "M0 11.5H23",
-      stroke: "#000000",
-      strokeWidth: "1.8"
-    }), /*#__PURE__*/React__default.createElement("path", {
-      d: "M11.5 0L11.5 23",
-      stroke: "#000000",
-      strokeWidth: "1.8"
-    }));
-  });
+  var ConditionSelector = function ConditionSelector(_ref) {
+    var onChange = _ref.onChange,
+        graphApi = _ref.graphApi,
+        itemRenderer = _ref.itemRenderer,
+        getGraphQuery = _ref.getGraphQuery,
+        requestInstance = _ref.requestInstance;
 
-  var _templateObject$w;
-  var SvgWrapper$1 = styled__default.span(_templateObject$w || (_templateObject$w = _taggedTemplateLiteral(["\n  padding: 1rem;\n  display: flex;\n  svg {\n    width: 23px;\n    height: auto;\n  }\n"])));
+    var resultProcessor = function resultProcessor(result) {
+      return result.data.data.conditions_list;
+    };
 
-  var _templateObject$x;
-  var IconWrapper = styled__default.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteral(["\n  border: 1px solid ", ";\n  height: auto;\n  margin-bottom: 1rem;\n  margin-left: 1rem;\n  display: flex;\n  align-items: center;\n  height: auto;\n\n  :hover {\n    background-color: ", ";\n    cursor: pointer;\n  }\n\n  #svg-trash {\n    width: 15px;\n    height: 100%;\n  }\n"])), function (props) {
-    return props.theme.colors.borderColor;
-  }, function (props) {
-    return props.theme.colors.borderColor;
-  });
+    return /*#__PURE__*/React__default.createElement(LuxityGraphQLMultiselector, {
+      title: "Condition",
+      queryId: "getCondition",
+      baseQueryLimit: 10,
+      baseClass: "style-selector",
+      identifier: "style-selector",
+      searchPlaceHolder: "Search Condition",
+      category: "",
+      onChange: onChange,
+      graphApi: graphApi,
+      itemRenderer: itemRenderer,
+      getGraphQuery: getGraphQuery,
+      resultProcessor: resultProcessor,
+      requestInstance: requestInstance
+    });
+  };
+
+  ConditionSelector.defaultProps = {
+    itemRenderer: ItemRenderer
+  };
 
-  var _templateObject$y, _templateObject2$7, _templateObject3$2, _templateObject4$1, _templateObject5;
+  var _templateObject$w, _templateObject2$7, _templateObject3$2;
   var UNISEX = genders.UNISEX;
-  var AddInterestContainer = styled__default.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteral(["\n  margin-bottom: ", ";\n  border: 1px solid ", ";\n  padding: ", ";\n"])), function (props) {
+  var AddInterestContainer = styled__default.div(_templateObject$w || (_templateObject$w = _taggedTemplateLiteral(["\n  margin-bottom: ", ";\n  border: 1px solid ", ";\n  padding: ", ";\n"])), function (props) {
     return props.theme.marginPaddings[6];
   }, function (props) {
     return props.theme.colors.borderColor;
@@ -3092,26 +3096,6 @@
   }, function (props) {
     return props.theme.marginPaddings[2];
   });
-  var AddInterestButton = styled__default.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  color: ", ";\n  border: 1px solid ", ";\n  padding-top: ", ";\n  margin-bottom: ", ";\n  padding-left: 1.5rem;\n  width: 95%;\n  font-size: 17px;\n"])), function (props) {
-    return props.theme.colors.darkerGray;
-  }, function (props) {
-    return props.theme.colors.borderColor;
-  }, function (props) {
-    return props.theme.marginPaddings[0];
-  }, function (props) {
-    return props.theme.marginPaddings[2];
-  });
-  var AddInterestButtonContainer = styled__default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n\n  #add-icon {\n    margin-bottom: 1.5rem;\n\n    svg {\n      width: 15px;\n    }\n  }\n"])));
-
-  var AddIcon = function AddIcon(_ref) {
-    var onClick = _ref.onClick,
-        id = _ref.id;
-    return /*#__PURE__*/React__default.createElement(IconWrapper, {
-      id: id,
-      onClick: onClick
-    }, /*#__PURE__*/React__default.createElement(SvgWrapper$1, null, /*#__PURE__*/React__default.createElement(Add, null)));
-  };
-
   var defaultState = {
     category_type: null,
     brands: [],
@@ -3121,6 +3105,7 @@
     max_price: null,
     styles: [],
     gender: [],
+    condition: [],
     request: _objectSpread2({}, request),
     isCategoriesShown: false
   };
@@ -3197,6 +3182,14 @@
         });
       });
 
+      _defineProperty(_assertThisInitialized(_this), "onConditionChanged", function (conditions) {
+        _this.setState({
+          condition: conditions.map(function (condition) {
+            return condition.id;
+          })
+        });
+      });
+
       _defineProperty(_assertThisInitialized(_this), "payloadIsValid", function () {
         // price/shoe-size always have initial values as soon as category is set
         var category_type = _this.state.category_type;
@@ -3220,7 +3213,8 @@
             styles = _this$state.styles,
             category_type = _this$state.category_type,
             requestState = _this$state.request,
-            gender = _this$state.gender;
+            gender = _this$state.gender,
+            condition = _this$state.condition;
         var payloadGender = gender[0];
 
         if (gender.length > 1 || !gender.length) {
@@ -3233,6 +3227,7 @@
           min_price: min_price,
           max_price: max_price,
           styles: styles,
+          condition: condition,
           gender: payloadGender,
           request: requestState
         };
@@ -3255,8 +3250,8 @@
         }, _this.handleRequestError);
       });
 
-      _defineProperty(_assertThisInitialized(_this), "handleRequestError", function (_ref2) {
-        var data = _ref2.data;
+      _defineProperty(_assertThisInitialized(_this), "handleRequestError", function (_ref) {
+        var data = _ref.data;
 
         _this.setState({
           request: _objectSpread2({}, request)
@@ -3274,6 +3269,8 @@
 
       _defineProperty(_assertThisInitialized(_this), "resetState", function () {
         _this.setState(_objectSpread2({}, defaultState));
+
+        _this.props.onCancel();
       });
 
       _defineProperty(_assertThisInitialized(_this), "handleGenderChange", function (isChecked, gender) {
@@ -3298,12 +3295,11 @@
             getBrandsGraphQuery = _this$props.getBrandsGraphQuery,
             getStylesGraphQuery = _this$props.getStylesGraphQuery,
             getShoesGraphQuery = _this$props.getShoesGraphQuery,
-            defaultShoeSizeType = _this$props.defaultShoeSizeType;
-        return /*#__PURE__*/React__default.createElement(React.Fragment, null, !_this.state.isCategoriesShown && /*#__PURE__*/React__default.createElement(AddInterestButtonContainer, {
-          onClick: _this.onAddInterestClick
-        }, /*#__PURE__*/React__default.createElement(AddInterestButton, null, "Add Interest"), /*#__PURE__*/React__default.createElement(AddIcon, {
-          id: "add-icon"
-        })), _this.state.isCategoriesShown && /*#__PURE__*/React__default.createElement(AddInterestContainer, null, /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(CatSelectorParagraph, null, "Select the catergory that interests you"), /*#__PURE__*/React__default.createElement(CategoryInterestSelector, {
+            defaultShoeSizeType = _this$props.defaultShoeSizeType,
+            getConditionsGraphQuery = _this$props.getConditionsGraphQuery;
+        return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+          className: "interests__section-wrapper"
+        }, /*#__PURE__*/React__default.createElement(AddInterestContainer, null, /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(CatSelectorParagraph, null, "Select the category that interests you"), /*#__PURE__*/React__default.createElement(CategoryInterestSelector, {
           category: category_type,
           onCategoryChange: _this.onCategoryChanged
         }), category_type ? /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement(GenderSelector$1, {
@@ -3329,6 +3325,11 @@
           requestInstance: requestInstance,
           graphApi: "".concat(baseGraphApi, "?id=getStyles"),
           getGraphQuery: getStylesGraphQuery
+        }), /*#__PURE__*/React__default.createElement(ConditionSelector, {
+          onChange: _this.onConditionChanged,
+          requestInstance: requestInstance,
+          graphApi: "".concat(baseGraphApi, "?id=getCondition"),
+          getGraphQuery: getConditionsGraphQuery
         })) : null, /*#__PURE__*/React__default.createElement(SaveAndCancelButtonContainer, null, /*#__PURE__*/React__default.createElement("div", {
           className: "fl-right"
         }, /*#__PURE__*/React__default.createElement("div", {
@@ -3349,7 +3350,7 @@
 
             _this.resetState();
           }
-        }, fetching ? 'SAVING' : 'SAVE')))))));
+        }, fetching ? 'SAVING' : 'SAVE'))))))));
       });
 
       _this.state = _objectSpread2({}, defaultState);