@bonlineza/luxity-lib 2.36.2 → 2.36.4

package/LuxityGraphQLDropdownSelector.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios'), require('js-cookie')) :
-  typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios', 'js-cookie'], factory) :
-  (global = global || self, global.LuxityGraphQLDropdownSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios, global.Cookies));
-}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios, Cookies) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios')) :
+  typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios'], factory) :
+  (global = global || self, global.LuxityGraphQLDropdownSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios));
+}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios) { 'use strict';
 
   var React__default = 'default' in React ? React['default'] : React;
   var styled__default = 'default' in styled ? styled['default'] : styled;
@@ -16,7 +16,6 @@
   AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
   var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
   axios = axios && Object.prototype.hasOwnProperty.call(axios, 'default') ? axios['default'] : axios;
-  Cookies = Cookies && Object.prototype.hasOwnProperty.call(Cookies, 'default') ? Cookies['default'] : Cookies;
 
   function ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
@@ -11009,127 +11008,6 @@
     }));
   });
 
-  function getToken() {
-    var _Cookies$get;
-
-    return (_Cookies$get = Cookies.get('_tk')) === null || _Cookies$get === void 0 ? void 0 : _Cookies$get.replace('*', 'Bearer ');
-  }
-  function setToken(value) {
-    Cookies.set('_tk', value, 30);
-  }
-
-  /** @format */
-
-  function getEncodedSearch(currentUrl) {
-    var splitUrl = currentUrl.split('?');
-    var baseUrl = splitUrl[0];
-    var nextUrlSegments = splitUrl[1].split('&');
-    var nextQueryString = splitUrl[1];
-
-    if (nextUrlSegments.length > 0) {
-      nextQueryString = nextUrlSegments.map(function (v) {
-        var nextValue = v;
-
-        if (v.includes('search=')) {
-          var temp = v.split('=');
-          nextValue = "".concat(temp[0], "=").concat(encodeURIComponent(temp[1]));
-        }
-
-        return nextValue;
-      }).join('&');
-    }
-
-    return "".concat(baseUrl, "?").concat(nextQueryString);
-  }
-  /**
-   * Gets an instance of Axios that is configured with the custom failure handlers
-   * @param {Function} onAuthFailed - callback triggers when auth fails - ie, server error is one of ['token_invalid', 'token_not_provided', 'user_not_found', 'token_expired'] or http status is one of [401, 503, 400]
-   * @param {Function} onForbidden - callback triggers when http status = 403
-   */
-
-
-  var axiosInstance = function axiosInstance(onAuthFailed, onForbidden) {
-    var instance = axios.create({
-      validateStatus: function validateStatus(status) {
-        return status >= 200 && status < 300;
-      }
-    });
-    var token = getToken();
-
-    if (token !== '') {
-      instance.defaults.headers.common.Authorization = token;
-    }
-
-    instance.defaults.headers.common['Content-Type'] = 'application/json;charset=UTF-8'; // Add a request interceptor
-
-    instance.interceptors.request.use(function (request, error) {
-      if (error) {
-        return Promise.reject(error.response);
-      }
-
-      if (request.url.includes('search') && request.url.includes('?')) {
-        // do some uri manipulation for ie
-        // https://stackoverflow.com/questions/18220057
-        // eslint-disable-next-line no-param-reassign
-        request.url = getEncodedSearch(request.url);
-      } // eslint-disable-next-line no-param-reassign
-
-
-      request.headers.common['Content-Type'] = 'application/json; charset=utf-8';
-
-      if (typeof request.body === 'undefined') {
-        request.body = {};
-      }
-
-      token = getToken();
-
-      if (token !== '') {
-        // eslint-disable-next-line no-param-reassign
-        request.headers.common.Authorization = token;
-      }
-
-      return request;
-    }, function (error) {
-      return Promise.reject(error.message);
-    }); // Add a response interceptor
-
-    instance.interceptors.response.use(function (response, error) {
-      if (error) {
-        return Promise.reject(error.response);
-      }
-
-      if (response.headers.authorization) {
-        setToken(response.headers.authorization);
-      }
-
-      return response;
-    }, function (error) {
-      if (error.response) {
-        // network error
-        if (error.response.data && error.response.data.error && (error.response.data.error === 'token_invalid' || error.response.data.error === 'token_not_provided' || error.response.data.error === 'user_not_found' || error.response.data.error === 'token_expired') || error.response.status === 401 || error.response.status === 503 || error.response.status === 400) {
-          onAuthFailed();
-        } // if (error.response.status === 500) {
-        //   // INTERNAL SERVER ERROR
-        //   store.dispatch({
-        //     type: AppConstants.OVERLAY.SERVER_ERROR,
-        //   });
-        //   return Promise.reject(error.response);
-        // }
-
-
-        if (error.response.status === 403) {
-          // FORBIDDEN
-          onForbidden();
-        }
-
-        return Promise.reject(error.response);
-      }
-
-      return Promise.reject(error);
-    });
-    return instance;
-  }; // NOTE: this to be instanciated with params: onAuthFailed, onForbidden
-
   var _excluded$8 = ["children"];
 
   var DropdownSelector = function DropdownSelector(_ref) {
@@ -11351,7 +11229,7 @@
             case 0:
               _context.prev = 0;
               _context.next = 3;
-              return axiosInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
+              return requestInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
                 query: getBrandsGraphQuery(1000, 1, 'id|desc')
               });
 
@@ -11382,7 +11260,7 @@
           }
         }
       }, _callee, null, [[0, 7]]);
-    })), [baseGraphApi, getBrandsGraphQuery]);
+    })), [baseGraphApi, getBrandsGraphQuery, requestInstance]);
     var fetchModels = React.useCallback( /*#__PURE__*/function () {
       var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(brandId) {
         var _response$data2, _response$data2$data, _response$data2$data$, response, formattedModels;
@@ -11393,7 +11271,7 @@
               case 0:
                 _context2.prev = 0;
                 _context2.next = 3;
-                return axiosInstance.post("".concat(baseGraphApi, "?id=getModels"), {
+                return requestInstance.post("".concat(baseGraphApi, "?id=getModels"), {
                   query: getModelsGraphQuery(brandId)
                 });
 
@@ -11429,7 +11307,7 @@
       return function (_x) {
         return _ref3.apply(this, arguments);
       };
-    }(), [baseGraphApi, getModelsGraphQuery]);
+    }(), [baseGraphApi, getModelsGraphQuery, requestInstance]);
     var fetchMaterials = React.useCallback( /*#__PURE__*/function () {
       var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(brandId) {
         var _response$data3, _response$data3$data, _response$data3$data$, response, formattedMaterials;
@@ -11440,7 +11318,7 @@
               case 0:
                 _context3.prev = 0;
                 _context3.next = 3;
-                return axiosInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
+                return requestInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
                   query: getMaterialsGraphQuery(brandId)
                 });
 
@@ -11476,7 +11354,7 @@
       return function (_x2) {
         return _ref4.apply(this, arguments);
       };
-    }(), [baseGraphApi, getMaterialsGraphQuery]);
+    }(), [baseGraphApi, getMaterialsGraphQuery, requestInstance]);
     React.useEffect(function () {
       fetchBrands();
     }, [fetchBrands]);

package/LuxityMobileHeader.js

@@ -1310,7 +1310,8 @@
         LinkComponent = _ref.LinkComponent,
         shop = _ref.shop,
         app = _ref.app,
-        categoryConfig = _ref.categoryConfig;
+        categoryConfig = _ref.categoryConfig,
+        name = _ref.name;
 
     var _useSearch = useSearch({
       endpoint: endpoint,
@@ -1486,6 +1487,14 @@
     var handleBlogClick = onBlogClick ? function () {
       return handleClick(onBlogClick);
     } : undefined;
+
+    var getInitials = function getInitials(fullName) {
+      if (!fullName) return '';
+      return fullName.split(' ').map(function (n) {
+        return n[0];
+      }).join('').slice(0, 2);
+    };
+
     return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
       className: "navbar navbar__mobile-wrapper"
     }, /*#__PURE__*/React__default.createElement("div", {
@@ -1531,9 +1540,20 @@
       alt: "cart-icon",
       width: 20,
       height: 20
-    }), shop && /*#__PURE__*/React__default.createElement("div", {
+    }), shop && cartCount > 0 && /*#__PURE__*/React__default.createElement("div", {
       className: "navbar__cart-count"
-    }, cartCount))))), showSearchBar && /*#__PURE__*/React__default.createElement("div", {
+    }, cartCount)), shop && /*#__PURE__*/React__default.createElement("button", {
+      type: "button",
+      className: "navbar__icon",
+      onClick: handleAccountClick
+    }, name ? /*#__PURE__*/React__default.createElement("div", {
+      className: "navbar__account-initials"
+    }, getInitials(name)) : /*#__PURE__*/React__default.createElement("img", {
+      src: accountIcon,
+      alt: "account-icon",
+      width: 20,
+      height: 20
+    }))))), showSearchBar && /*#__PURE__*/React__default.createElement("div", {
       className: "navbar__search-container"
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "navbar__product-search-wrapper"

package/MaterialSelector.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios'), require('js-cookie')) :
-  typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios', 'js-cookie'], factory) :
-  (global = global || self, global.MaterialSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios, global.Cookies));
-}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios, Cookies) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios')) :
+  typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios'], factory) :
+  (global = global || self, global.MaterialSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios));
+}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios) { 'use strict';
 
   var React__default = 'default' in React ? React['default'] : React;
   var styled__default = 'default' in styled ? styled['default'] : styled;
@@ -16,7 +16,6 @@
   AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
   var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
   axios = axios && Object.prototype.hasOwnProperty.call(axios, 'default') ? axios['default'] : axios;
-  Cookies = Cookies && Object.prototype.hasOwnProperty.call(Cookies, 'default') ? Cookies['default'] : Cookies;
 
   function ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
@@ -11009,127 +11008,6 @@
     }));
   });
 
-  function getToken() {
-    var _Cookies$get;
-
-    return (_Cookies$get = Cookies.get('_tk')) === null || _Cookies$get === void 0 ? void 0 : _Cookies$get.replace('*', 'Bearer ');
-  }
-  function setToken(value) {
-    Cookies.set('_tk', value, 30);
-  }
-
-  /** @format */
-
-  function getEncodedSearch(currentUrl) {
-    var splitUrl = currentUrl.split('?');
-    var baseUrl = splitUrl[0];
-    var nextUrlSegments = splitUrl[1].split('&');
-    var nextQueryString = splitUrl[1];
-
-    if (nextUrlSegments.length > 0) {
-      nextQueryString = nextUrlSegments.map(function (v) {
-        var nextValue = v;
-
-        if (v.includes('search=')) {
-          var temp = v.split('=');
-          nextValue = "".concat(temp[0], "=").concat(encodeURIComponent(temp[1]));
-        }
-
-        return nextValue;
-      }).join('&');
-    }
-
-    return "".concat(baseUrl, "?").concat(nextQueryString);
-  }
-  /**
-   * Gets an instance of Axios that is configured with the custom failure handlers
-   * @param {Function} onAuthFailed - callback triggers when auth fails - ie, server error is one of ['token_invalid', 'token_not_provided', 'user_not_found', 'token_expired'] or http status is one of [401, 503, 400]
-   * @param {Function} onForbidden - callback triggers when http status = 403
-   */
-
-
-  var axiosInstance = function axiosInstance(onAuthFailed, onForbidden) {
-    var instance = axios.create({
-      validateStatus: function validateStatus(status) {
-        return status >= 200 && status < 300;
-      }
-    });
-    var token = getToken();
-
-    if (token !== '') {
-      instance.defaults.headers.common.Authorization = token;
-    }
-
-    instance.defaults.headers.common['Content-Type'] = 'application/json;charset=UTF-8'; // Add a request interceptor
-
-    instance.interceptors.request.use(function (request, error) {
-      if (error) {
-        return Promise.reject(error.response);
-      }
-
-      if (request.url.includes('search') && request.url.includes('?')) {
-        // do some uri manipulation for ie
-        // https://stackoverflow.com/questions/18220057
-        // eslint-disable-next-line no-param-reassign
-        request.url = getEncodedSearch(request.url);
-      } // eslint-disable-next-line no-param-reassign
-
-
-      request.headers.common['Content-Type'] = 'application/json; charset=utf-8';
-
-      if (typeof request.body === 'undefined') {
-        request.body = {};
-      }
-
-      token = getToken();
-
-      if (token !== '') {
-        // eslint-disable-next-line no-param-reassign
-        request.headers.common.Authorization = token;
-      }
-
-      return request;
-    }, function (error) {
-      return Promise.reject(error.message);
-    }); // Add a response interceptor
-
-    instance.interceptors.response.use(function (response, error) {
-      if (error) {
-        return Promise.reject(error.response);
-      }
-
-      if (response.headers.authorization) {
-        setToken(response.headers.authorization);
-      }
-
-      return response;
-    }, function (error) {
-      if (error.response) {
-        // network error
-        if (error.response.data && error.response.data.error && (error.response.data.error === 'token_invalid' || error.response.data.error === 'token_not_provided' || error.response.data.error === 'user_not_found' || error.response.data.error === 'token_expired') || error.response.status === 401 || error.response.status === 503 || error.response.status === 400) {
-          onAuthFailed();
-        } // if (error.response.status === 500) {
-        //   // INTERNAL SERVER ERROR
-        //   store.dispatch({
-        //     type: AppConstants.OVERLAY.SERVER_ERROR,
-        //   });
-        //   return Promise.reject(error.response);
-        // }
-
-
-        if (error.response.status === 403) {
-          // FORBIDDEN
-          onForbidden();
-        }
-
-        return Promise.reject(error.response);
-      }
-
-      return Promise.reject(error);
-    });
-    return instance;
-  }; // NOTE: this to be instanciated with params: onAuthFailed, onForbidden
-
   var _excluded$8 = ["children"];
 
   var DropdownSelector = function DropdownSelector(_ref) {
@@ -11351,7 +11229,7 @@
             case 0:
               _context.prev = 0;
               _context.next = 3;
-              return axiosInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
+              return requestInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
                 query: getBrandsGraphQuery(1000, 1, 'id|desc')
               });
 
@@ -11382,7 +11260,7 @@
           }
         }
       }, _callee, null, [[0, 7]]);
-    })), [baseGraphApi, getBrandsGraphQuery]);
+    })), [baseGraphApi, getBrandsGraphQuery, requestInstance]);
     var fetchModels = React.useCallback( /*#__PURE__*/function () {
       var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(brandId) {
         var _response$data2, _response$data2$data, _response$data2$data$, response, formattedModels;
@@ -11393,7 +11271,7 @@
               case 0:
                 _context2.prev = 0;
                 _context2.next = 3;
-                return axiosInstance.post("".concat(baseGraphApi, "?id=getModels"), {
+                return requestInstance.post("".concat(baseGraphApi, "?id=getModels"), {
                   query: getModelsGraphQuery(brandId)
                 });
 
@@ -11429,7 +11307,7 @@
       return function (_x) {
         return _ref3.apply(this, arguments);
       };
-    }(), [baseGraphApi, getModelsGraphQuery]);
+    }(), [baseGraphApi, getModelsGraphQuery, requestInstance]);
     var fetchMaterials = React.useCallback( /*#__PURE__*/function () {
       var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(brandId) {
         var _response$data3, _response$data3$data, _response$data3$data$, response, formattedMaterials;
@@ -11440,7 +11318,7 @@
               case 0:
                 _context3.prev = 0;
                 _context3.next = 3;
-                return axiosInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
+                return requestInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
                   query: getMaterialsGraphQuery(brandId)
                 });
 
@@ -11476,7 +11354,7 @@
       return function (_x2) {
         return _ref4.apply(this, arguments);
       };
-    }(), [baseGraphApi, getMaterialsGraphQuery]);
+    }(), [baseGraphApi, getMaterialsGraphQuery, requestInstance]);
     React.useEffect(function () {
       fetchBrands();
     }, [fetchBrands]);

package/ModelSelector.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios'), require('js-cookie')) :
-  typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios', 'js-cookie'], factory) :
-  (global = global || self, global.ModelSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios, global.Cookies));
-}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios, Cookies) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios')) :
+  typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios'], factory) :
+  (global = global || self, global.ModelSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios));
+}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios) { 'use strict';
 
   var React__default = 'default' in React ? React['default'] : React;
   var styled__default = 'default' in styled ? styled['default'] : styled;
@@ -16,7 +16,6 @@
   AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
   var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
   axios = axios && Object.prototype.hasOwnProperty.call(axios, 'default') ? axios['default'] : axios;
-  Cookies = Cookies && Object.prototype.hasOwnProperty.call(Cookies, 'default') ? Cookies['default'] : Cookies;
 
   function ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
@@ -11009,127 +11008,6 @@
     }));
   });
 
-  function getToken() {
-    var _Cookies$get;
-
-    return (_Cookies$get = Cookies.get('_tk')) === null || _Cookies$get === void 0 ? void 0 : _Cookies$get.replace('*', 'Bearer ');
-  }
-  function setToken(value) {
-    Cookies.set('_tk', value, 30);
-  }
-
-  /** @format */
-
-  function getEncodedSearch(currentUrl) {
-    var splitUrl = currentUrl.split('?');
-    var baseUrl = splitUrl[0];
-    var nextUrlSegments = splitUrl[1].split('&');
-    var nextQueryString = splitUrl[1];
-
-    if (nextUrlSegments.length > 0) {
-      nextQueryString = nextUrlSegments.map(function (v) {
-        var nextValue = v;
-
-        if (v.includes('search=')) {
-          var temp = v.split('=');
-          nextValue = "".concat(temp[0], "=").concat(encodeURIComponent(temp[1]));
-        }
-
-        return nextValue;
-      }).join('&');
-    }
-
-    return "".concat(baseUrl, "?").concat(nextQueryString);
-  }
-  /**
-   * Gets an instance of Axios that is configured with the custom failure handlers
-   * @param {Function} onAuthFailed - callback triggers when auth fails - ie, server error is one of ['token_invalid', 'token_not_provided', 'user_not_found', 'token_expired'] or http status is one of [401, 503, 400]
-   * @param {Function} onForbidden - callback triggers when http status = 403
-   */
-
-
-  var axiosInstance = function axiosInstance(onAuthFailed, onForbidden) {
-    var instance = axios.create({
-      validateStatus: function validateStatus(status) {
-        return status >= 200 && status < 300;
-      }
-    });
-    var token = getToken();
-
-    if (token !== '') {
-      instance.defaults.headers.common.Authorization = token;
-    }
-
-    instance.defaults.headers.common['Content-Type'] = 'application/json;charset=UTF-8'; // Add a request interceptor
-
-    instance.interceptors.request.use(function (request, error) {
-      if (error) {
-        return Promise.reject(error.response);
-      }
-
-      if (request.url.includes('search') && request.url.includes('?')) {
-        // do some uri manipulation for ie
-        // https://stackoverflow.com/questions/18220057
-        // eslint-disable-next-line no-param-reassign
-        request.url = getEncodedSearch(request.url);
-      } // eslint-disable-next-line no-param-reassign
-
-
-      request.headers.common['Content-Type'] = 'application/json; charset=utf-8';
-
-      if (typeof request.body === 'undefined') {
-        request.body = {};
-      }
-
-      token = getToken();
-
-      if (token !== '') {
-        // eslint-disable-next-line no-param-reassign
-        request.headers.common.Authorization = token;
-      }
-
-      return request;
-    }, function (error) {
-      return Promise.reject(error.message);
-    }); // Add a response interceptor
-
-    instance.interceptors.response.use(function (response, error) {
-      if (error) {
-        return Promise.reject(error.response);
-      }
-
-      if (response.headers.authorization) {
-        setToken(response.headers.authorization);
-      }
-
-      return response;
-    }, function (error) {
-      if (error.response) {
-        // network error
-        if (error.response.data && error.response.data.error && (error.response.data.error === 'token_invalid' || error.response.data.error === 'token_not_provided' || error.response.data.error === 'user_not_found' || error.response.data.error === 'token_expired') || error.response.status === 401 || error.response.status === 503 || error.response.status === 400) {
-          onAuthFailed();
-        } // if (error.response.status === 500) {
-        //   // INTERNAL SERVER ERROR
-        //   store.dispatch({
-        //     type: AppConstants.OVERLAY.SERVER_ERROR,
-        //   });
-        //   return Promise.reject(error.response);
-        // }
-
-
-        if (error.response.status === 403) {
-          // FORBIDDEN
-          onForbidden();
-        }
-
-        return Promise.reject(error.response);
-      }
-
-      return Promise.reject(error);
-    });
-    return instance;
-  }; // NOTE: this to be instanciated with params: onAuthFailed, onForbidden
-
   var _excluded$8 = ["children"];
 
   var DropdownSelector = function DropdownSelector(_ref) {
@@ -11351,7 +11229,7 @@
             case 0:
               _context.prev = 0;
               _context.next = 3;
-              return axiosInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
+              return requestInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
                 query: getBrandsGraphQuery(1000, 1, 'id|desc')
               });
 
@@ -11382,7 +11260,7 @@
           }
         }
       }, _callee, null, [[0, 7]]);
-    })), [baseGraphApi, getBrandsGraphQuery]);
+    })), [baseGraphApi, getBrandsGraphQuery, requestInstance]);
     var fetchModels = React.useCallback( /*#__PURE__*/function () {
       var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(brandId) {
         var _response$data2, _response$data2$data, _response$data2$data$, response, formattedModels;
@@ -11393,7 +11271,7 @@
               case 0:
                 _context2.prev = 0;
                 _context2.next = 3;
-                return axiosInstance.post("".concat(baseGraphApi, "?id=getModels"), {
+                return requestInstance.post("".concat(baseGraphApi, "?id=getModels"), {
                   query: getModelsGraphQuery(brandId)
                 });
 
@@ -11429,7 +11307,7 @@
       return function (_x) {
         return _ref3.apply(this, arguments);
       };
-    }(), [baseGraphApi, getModelsGraphQuery]);
+    }(), [baseGraphApi, getModelsGraphQuery, requestInstance]);
     var fetchMaterials = React.useCallback( /*#__PURE__*/function () {
       var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(brandId) {
         var _response$data3, _response$data3$data, _response$data3$data$, response, formattedMaterials;
@@ -11440,7 +11318,7 @@
               case 0:
                 _context3.prev = 0;
                 _context3.next = 3;
-                return axiosInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
+                return requestInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
                   query: getMaterialsGraphQuery(brandId)
                 });
 
@@ -11476,7 +11354,7 @@
       return function (_x2) {
         return _ref4.apply(this, arguments);
       };
-    }(), [baseGraphApi, getMaterialsGraphQuery]);
+    }(), [baseGraphApi, getMaterialsGraphQuery, requestInstance]);
     React.useEffect(function () {
       fetchBrands();
     }, [fetchBrands]);