tf-checkout-react 1.0.41 → 1.0.45

package/dist/tf-checkout-react.cjs.development.js

@@ -7,7 +7,7 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 var React = require('react');
 var React__default = _interopDefault(React);
 var formik = require('formik');
-var Button = _interopDefault(require('@mui/material/Button'));
+var LoadingButton = _interopDefault(require('@mui/lab/LoadingButton'));
 var _identity = _interopDefault(require('lodash/identity'));
 var _map = _interopDefault(require('lodash/map'));
 var _get = _interopDefault(require('lodash/get'));
@@ -19,6 +19,7 @@ var Box = _interopDefault(require('@mui/material/Box'));
 var _forEach = _interopDefault(require('lodash/forEach'));
 var _flatMapDeep = _interopDefault(require('lodash/flatMapDeep'));
 var TextField = _interopDefault(require('@mui/material/TextField'));
+var styles = require('@mui/styles');
 var FormGroup = _interopDefault(require('@mui/material/FormGroup'));
 var FormControlLabel = _interopDefault(require('@mui/material/FormControlLabel'));
 var Checkbox = _interopDefault(require('@mui/material/Checkbox'));
@@ -38,7 +39,7 @@ var _isObject = _interopDefault(require('lodash/isObject'));
 var FormControl = _interopDefault(require('@mui/material/FormControl'));
 var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
 var Select = _interopDefault(require('@mui/material/Select'));
-var Button$1 = _interopDefault(require('react-bootstrap/Button'));
+var Button = _interopDefault(require('react-bootstrap/Button'));
 var jwt_decode = _interopDefault(require('jwt-decode'));
 
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
@@ -913,7 +914,7 @@ if (isWindowDefined && localStorage.getItem('auth_guest_token')) {
 }
 
 if (isWindowDefined && window.location.origin !== 'https://www.houseofx.nyc' && window.location.origin !== 'https://tickets-staging.houseofx.nyc') {
-  ttfHeaders['X-Source-Origin'] = 'houseofx.com';
+  ttfHeaders['X-Source-Origin'] = 'houseofx.nyc';
 }
 
 var publicRequest = /*#__PURE__*/axios.create({
@@ -960,7 +961,7 @@ publicRequest.interceptors.request.use(function (config) {
 
   if (isWindowDefined && window.location.origin !== 'https://www.houseofx.nyc' && window.location.origin !== 'https://tickets-staging.houseofx.nyc') {
     var _updatedHeaders2 = _extends({}, config.headers, {
-      'X-Source-Origin': 'houseofx.com'
+      'X-Source-Origin': 'houseofx.nyc'
     });
 
     config.headers = _updatedHeaders2;
@@ -1081,9 +1082,18 @@ var style = {
 var LoginModal = function LoginModal(_ref) {
   var onClose = _ref.onClose,
       onLogin = _ref.onLogin,
-      alreadyHasUser = _ref.alreadyHasUser,
-      userExpired = _ref.userExpired,
-      setUserExpired = _ref.setUserExpired;
+      _ref$alreadyHasUser = _ref.alreadyHasUser,
+      alreadyHasUser = _ref$alreadyHasUser === void 0 ? false : _ref$alreadyHasUser,
+      _ref$userExpired = _ref.userExpired,
+      userExpired = _ref$userExpired === void 0 ? false : _ref$userExpired,
+      _ref$onAuthorizeSucce = _ref.onAuthorizeSuccess,
+      onAuthorizeSuccess = _ref$onAuthorizeSucce === void 0 ? function () {} : _ref$onAuthorizeSucce,
+      _ref$onAuthorizeError = _ref.onAuthorizeError,
+      onAuthorizeError = _ref$onAuthorizeError === void 0 ? function () {} : _ref$onAuthorizeError,
+      _ref$onGetProfileData = _ref.onGetProfileDataSuccess,
+      onGetProfileDataSuccess = _ref$onGetProfileData === void 0 ? function () {} : _ref$onGetProfileData,
+      _ref$onGetProfileData2 = _ref.onGetProfileDataError,
+      onGetProfileDataError = _ref$onGetProfileData2 === void 0 ? function () {} : _ref$onGetProfileData2;
 
   var _useState = React.useState(''),
       error = _useState[0],
@@ -1103,7 +1113,7 @@ var LoginModal = function LoginModal(_ref) {
     },
     onSubmit: function () {
       var _onSubmit = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(_ref2) {
-        var email, password, bodyFormData, resAutorize, bodyFormDataToken, resAccessToken, accessToken, profileData, profileSpecifiedData, profileDataObj, _e$response, _e$response$data, _error;
+        var email, password, bodyFormData, resAutorize, bodyFormDataToken, resAccessToken, accessToken, profileResponse, profileSpecifiedData, profileDataObj, _e$response, _e$response$data, _error;
 
         return runtime_1.wrap(function _callee$(_context) {
           while (1) {
@@ -1125,19 +1135,53 @@ var LoginModal = function LoginModal(_ref) {
                 bodyFormDataToken.append('grant_type', 'authorization_code');
                 bodyFormDataToken.append('client_id', ENV.CLIENT_ID );
                 bodyFormDataToken.append('client_secret', ENV.CLIENT_SECRET );
-                _context.next = 16;
+                resAccessToken = null;
+                _context.prev = 15;
+                _context.next = 18;
                 return getAccessToken(bodyFormDataToken);
 
-              case 16:
+              case 18:
                 resAccessToken = _context.sent;
+                onAuthorizeSuccess(resAccessToken.data);
+                _context.next = 26;
+                break;
+
+              case 22:
+                _context.prev = 22;
+                _context.t0 = _context["catch"](15);
+
+                if (axios.isAxiosError(_context.t0)) {
+                  onAuthorizeError(_context.t0);
+                }
+
+                return _context.abrupt("return");
+
+              case 26:
                 accessToken = _get(resAccessToken, 'data.access_token');
                 handleSetAccessToken(accessToken);
-                _context.next = 21;
+                profileResponse = null;
+                _context.prev = 29;
+                _context.next = 32;
                 return getProfileData(accessToken);
 
-              case 21:
-                profileData = _context.sent;
-                profileSpecifiedData = _get(profileData, 'data.data');
+              case 32:
+                profileResponse = _context.sent;
+                onGetProfileDataSuccess(profileResponse.data);
+                _context.next = 40;
+                break;
+
+              case 36:
+                _context.prev = 36;
+                _context.t1 = _context["catch"](29);
+
+                if (axios.isAxiosError(_context.t1)) {
+                  onGetProfileDataError(_context.t1);
+                }
+
+                return _context.abrupt("return");
+
+              case 40:
+                profileSpecifiedData = _get(profileResponse, 'data.data');
                 profileDataObj = {
                   id: profileSpecifiedData.id,
                   first_name: profileSpecifiedData.firstName,
@@ -1150,28 +1194,27 @@ var LoginModal = function LoginModal(_ref) {
                   window.localStorage.setItem('access_token', accessToken);
                 }
 
-                setUserExpired(false);
                 onLogin();
-                _context.next = 32;
+                _context.next = 49;
                 break;
 
-              case 29:
-                _context.prev = 29;
-                _context.t0 = _context["catch"](1);
+              case 46:
+                _context.prev = 46;
+                _context.t2 = _context["catch"](1);
 
-                if (axios.isAxiosError(_context.t0)) {
-                  _error = (_context.t0 == null ? void 0 : (_e$response = _context.t0.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message) || 'Error';
+                if (axios.isAxiosError(_context.t2)) {
+                  _error = (_context.t2 == null ? void 0 : (_e$response = _context.t2.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message) || 'Error';
                   setError(_error);
-                } else if (_context.t0 instanceof Error) {
-                  setError((_context.t0 == null ? void 0 : _context.t0.message) || 'Error');
+                } else if (_context.t2 instanceof Error) {
+                  setError((_context.t2 == null ? void 0 : _context.t2.message) || 'Error');
                 }
 
-              case 32:
+              case 49:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee, null, [[1, 29]]);
+        }, _callee, null, [[1, 46], [15, 22], [29, 36]]);
       }));
 
       function onSubmit(_x) {
@@ -1232,7 +1275,11 @@ var LoginModal = function LoginModal(_ref) {
 };
 
 var RegisterModal = function RegisterModal(_ref) {
-  var onClose = _ref.onClose;
+  var onClose = _ref.onClose,
+      _ref$onGetProfileData = _ref.onGetProfileDataSuccess,
+      onGetProfileDataSuccess = _ref$onGetProfileData === void 0 ? function () {} : _ref$onGetProfileData,
+      _ref$onGetProfileData2 = _ref.onGetProfileDataError,
+      onGetProfileDataError = _ref$onGetProfileData2 === void 0 ? function () {} : _ref$onGetProfileData2;
   return React__default.createElement("div", {
     style: {
       display: 'flex',
@@ -1256,7 +1303,7 @@ var RegisterModal = function RegisterModal(_ref) {
     },
     onSubmit: function () {
       var _onSubmit = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(_ref2) {
-        var firstName, lastName, email, password, confirmPassword, bodyFormData, resRegister, access_token, profileData, profileSpecifiedData, profileDataObj;
+        var firstName, lastName, email, password, confirmPassword, bodyFormData, resRegister, access_token, profileResponse, profileSpecifiedData, profileDataObj;
         return runtime_1.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
@@ -1277,12 +1324,25 @@ var RegisterModal = function RegisterModal(_ref) {
                 resRegister = _context.sent;
                 access_token = _get(resRegister, 'data.data.attributes.access_token');
                 handleSetAccessToken(access_token);
-                _context.next = 16;
+                profileResponse = null;
+                _context.prev = 15;
+                _context.next = 18;
                 return getProfileData(access_token);
 
-              case 16:
-                profileData = _context.sent;
-                profileSpecifiedData = _get(profileData, 'data.data');
+              case 18:
+                profileResponse = _context.sent;
+                onGetProfileDataSuccess(profileResponse.data);
+                _context.next = 26;
+                break;
+
+              case 22:
+                _context.prev = 22;
+                _context.t0 = _context["catch"](15);
+                onGetProfileDataError(_context.t0.response);
+                return _context.abrupt("return");
+
+              case 26:
+                profileSpecifiedData = _get(profileResponse, 'data.data');
                 profileDataObj = {
                   id: profileSpecifiedData.id,
                   first_name: profileSpecifiedData.firstName,
@@ -1297,12 +1357,12 @@ var RegisterModal = function RegisterModal(_ref) {
 
                 onClose();
 
-              case 21:
+              case 30:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee);
+        }, _callee, null, [[15, 22]]);
       }));
 
       function onSubmit(_x) {
@@ -1406,7 +1466,7 @@ var RegisterModal = function RegisterModal(_ref) {
   }));
 };
 
-var _excluded = ["holderAge", "firstName", "lastName", "confirmEmail", "confirmPassword", "holderFirstName", "holderLastName"];
+var _excluded = ["firstName", "lastName", "holderAge", "confirmEmail", "confirmPassword"];
 var getInitialValues = function getInitialValues(data, propsInitialValues) {
   if (data === void 0) {
     data = [];
@@ -1464,7 +1524,7 @@ var setLoggedUserData = function setLoggedUserData(data) {
     zip: (data == null ? void 0 : data.zip) || (data == null ? void 0 : data.zipCode) || ''
   };
 };
-var createCheckoutDataBody = function createCheckoutDataBody(values, logedInValues, includeDob) {
+var createCheckoutDataBody = function createCheckoutDataBody(ticketsQuantity, values, logedInValues, includeDob) {
   if (values === void 0) {
     values = {};
   }
@@ -1478,23 +1538,52 @@ var createCheckoutDataBody = function createCheckoutDataBody(values, logedInValu
   }
 
   var _values = values,
-      holderAge = _values.holderAge,
       firstName = _values.firstName,
       lastName = _values.lastName,
-      holderFirstName = _values.holderFirstName,
-      holderLastName = _values.holderLastName,
+      holderAge = _values.holderAge,
       restValues = _objectWithoutPropertiesLoose(_values, _excluded);
 
+  var holders = [];
+  var ticket_holders = [];
+
+  var _loop = function _loop(i) {
+    var individualHolder = Object.fromEntries(Object.entries(values).filter(function (_ref4) {
+      var key = _ref4[0];
+      return key.includes(String(i));
+    }));
+    holders.push(individualHolder);
+  };
+
+  for (var i = 0; i <= ticketsQuantity; i++) {
+    _loop(i);
+  }
+
+  var filteredHolders = holders.filter(function (holder) {
+    return Object.entries(holder).length > 0;
+  });
+  ticket_holders = filteredHolders.map(function (item, index) {
+    return {
+      first_name: item["holderFirstName-" + index] || '',
+      last_name: item["holderLastName-" + index] || '',
+      phone: item["holderPhone-" + index] || '',
+      email: item["holderEmail-" + index] || ''
+    };
+  });
+  var filteredRestValue = {};
+
+  _forEach(restValues, function (value, key) {
+    if (!key.includes('holder')) {
+      filteredRestValue[key] = value;
+    }
+  });
+
   var body = {
-    attributes: _extends({}, restValues, {
+    attributes: _extends({}, filteredRestValue, {
       email: restValues.email || logedInValues.emailLogged,
       confirm_email: restValues.email || logedInValues.emailLogged,
       first_name: firstName || logedInValues.firstNameLogged,
       last_name: lastName || logedInValues.lastNameLogged,
-      ticket_holders: [{
-        first_name: holderFirstName,
-        last_name: holderLastName
-      }]
+      ticket_holders: ticket_holders
     })
   };
 
@@ -1508,6 +1597,13 @@ var createCheckoutDataBody = function createCheckoutDataBody(values, logedInValu
   return body;
 };
 
+var useStyles = /*#__PURE__*/styles.makeStyles({
+  input: {
+    "&::placeholder": {
+      color: "gray"
+    }
+  }
+});
 var CustomField = function CustomField(_ref) {
   var label = _ref.label,
       _ref$type = _ref.type,
@@ -1524,6 +1620,7 @@ var CustomField = function CustomField(_ref) {
 
   var error = _get(errors, field.name);
 
+  var classes = useStyles();
   return React__default.createElement(TextField, Object.assign({
     id: field.name,
     label: label,
@@ -1535,6 +1632,11 @@ var CustomField = function CustomField(_ref) {
     InputLabelProps: {
       shrink: isShrink
     },
+    InputProps: {
+      classes: {
+        input: classes.input
+      }
+    },
     SelectProps: {
       "native": true
     }
@@ -1577,7 +1679,9 @@ var LogicRunner = function LogicRunner(_ref) {
       setStates = _ref.setStates,
       setFieldValue = _ref.setFieldValue,
       setValues = _ref.setValues,
-      setUserValues = _ref.setUserValues;
+      setUserValues = _ref.setUserValues,
+      onGetStatesSuccess = _ref.onGetStatesSuccess,
+      onGetStatesError = _ref.onGetStatesError;
   React.useEffect(function () {
     var fetchStates = /*#__PURE__*/function () {
       var _ref2 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
@@ -1601,19 +1705,24 @@ var LogicRunner = function LogicRunner(_ref) {
                 });
                 setStates(mappedStates);
                 setFieldValue('state', (_mappedStates$0$label = (_mappedStates$ = mappedStates[0]) == null ? void 0 : _mappedStates$.label) != null ? _mappedStates$0$label : '');
-                _context.next = 11;
+                onGetStatesSuccess(res.data);
+                _context.next = 13;
                 break;
 
-              case 9:
-                _context.prev = 9;
+              case 10:
+                _context.prev = 10;
                 _context.t0 = _context["catch"](0);
 
-              case 11:
+                if (axios.isAxiosError(_context.t0)) {
+                  onGetStatesError(_context.t0);
+                }
+
+              case 13:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee, null, [[0, 9]]);
+        }, _callee, null, [[0, 10]]);
       }));
 
       return function fetchStates() {
@@ -1637,9 +1746,6 @@ var LogicRunner = function LogicRunner(_ref) {
               email: (parsedData == null ? void 0 : parsedData.email) || '',
               phone: (parsedData == null ? void 0 : parsedData.phone) || '',
               confirmEmail: '',
-              holderFirstName: '',
-              holderLastName: '',
-              holderAge: '',
               state: (parsedData == null ? void 0 : parsedData.state) || '',
               street_address: (parsedData == null ? void 0 : parsedData.street_address) || '',
               country: (parsedData == null ? void 0 : parsedData.country) || 1,
@@ -1651,9 +1757,7 @@ var LogicRunner = function LogicRunner(_ref) {
             };
             setValues(mappedValues);
             setUserValues(mappedValues);
-          } catch (e) {
-            console.log(e);
-          }
+          } catch (e) {}
         }
       }
     };
@@ -1671,6 +1775,11 @@ var SectionContainer = function SectionContainer(_ref3) {
 var BillingInfoContainer = function BillingInfoContainer(_ref4) {
   var _ref4$data = _ref4.data,
       data = _ref4$data === void 0 ? [] : _ref4$data,
+      _ref4$ticketHoldersFi = _ref4.ticketHoldersFields,
+      ticketHoldersFields = _ref4$ticketHoldersFi === void 0 ? {
+    id: 1,
+    fields: []
+  } : _ref4$ticketHoldersFi,
       _ref4$initialValues = _ref4.initialValues,
       initialValues = _ref4$initialValues === void 0 ? {} : _ref4$initialValues,
       _ref4$buttonName = _ref4.buttonName,
@@ -1678,7 +1787,35 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
       _ref4$handleSubmit = _ref4.handleSubmit,
       handleSubmit = _ref4$handleSubmit === void 0 ? _identity : _ref4$handleSubmit,
       _ref4$theme = _ref4.theme,
-      theme = _ref4$theme === void 0 ? 'light' : _ref4$theme;
+      theme = _ref4$theme === void 0 ? 'light' : _ref4$theme,
+      _ref4$onRegisterSucce = _ref4.onRegisterSuccess,
+      onRegisterSuccess = _ref4$onRegisterSucce === void 0 ? function () {} : _ref4$onRegisterSucce,
+      _ref4$onRegisterError = _ref4.onRegisterError,
+      onRegisterError = _ref4$onRegisterError === void 0 ? function () {} : _ref4$onRegisterError,
+      _ref4$onSubmitError = _ref4.onSubmitError,
+      onSubmitError = _ref4$onSubmitError === void 0 ? function () {} : _ref4$onSubmitError,
+      _ref4$onGetCartSucces = _ref4.onGetCartSuccess,
+      onGetCartSuccess = _ref4$onGetCartSucces === void 0 ? function () {} : _ref4$onGetCartSucces,
+      _ref4$onGetCartError = _ref4.onGetCartError,
+      onGetCartError = _ref4$onGetCartError === void 0 ? function () {} : _ref4$onGetCartError,
+      _ref4$onGetCountriesS = _ref4.onGetCountriesSuccess,
+      onGetCountriesSuccess = _ref4$onGetCountriesS === void 0 ? function () {} : _ref4$onGetCountriesS,
+      _ref4$onGetCountriesE = _ref4.onGetCountriesError,
+      onGetCountriesError = _ref4$onGetCountriesE === void 0 ? function () {} : _ref4$onGetCountriesE,
+      _ref4$onGetStatesSucc = _ref4.onGetStatesSuccess,
+      onGetStatesSuccess = _ref4$onGetStatesSucc === void 0 ? function () {} : _ref4$onGetStatesSucc,
+      _ref4$onGetStatesErro = _ref4.onGetStatesError,
+      onGetStatesError = _ref4$onGetStatesErro === void 0 ? function () {} : _ref4$onGetStatesErro,
+      _ref4$onGetProfileDat = _ref4.onGetProfileDataSuccess,
+      onGetProfileDataSuccess = _ref4$onGetProfileDat === void 0 ? function () {} : _ref4$onGetProfileDat,
+      _ref4$onGetProfileDat2 = _ref4.onGetProfileDataError,
+      onGetProfileDataError = _ref4$onGetProfileDat2 === void 0 ? function () {} : _ref4$onGetProfileDat2,
+      _ref4$onAuthorizeSucc = _ref4.onAuthorizeSuccess,
+      onAuthorizeSuccess = _ref4$onAuthorizeSucc === void 0 ? function () {} : _ref4$onAuthorizeSucc,
+      _ref4$onAuthorizeErro = _ref4.onAuthorizeError,
+      onAuthorizeError = _ref4$onAuthorizeErro === void 0 ? function () {} : _ref4$onAuthorizeErro,
+      _ref4$onLogin = _ref4.onLogin,
+      onLogin = _ref4$onLogin === void 0 ? function () {} : _ref4$onLogin;
   var userData = typeof window !== 'undefined' && window.localStorage.getItem('user_data') ? JSON.parse(window.localStorage.getItem('user_data') || '') : {};
   var access_token = typeof window !== 'undefined' && window.localStorage.getItem('access_token') ? window.localStorage.getItem('access_token') || '' : '';
 
@@ -1710,7 +1847,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
       showModalRegister = _useState7[0],
       setShowModalRegister = _useState7[1];
 
-  var _useState8 = React.useState({
+  var _useState8 = React.useState(1),
+      ticketsQuantity = _useState8[0],
+      setTicketsQuantity = _useState8[1];
+
+  var _useState9 = React.useState({
     firstName: '',
     lastName: '',
     email: '',
@@ -1725,8 +1866,8 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
     state: '',
     zip: ''
   }),
-      userValues = _useState8[0],
-      setUserValues = _useState8[1];
+      userValues = _useState9[0],
+      setUserValues = _useState9[1];
 
   var isLoggedIn = !!access_token;
 
@@ -1739,12 +1880,25 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
   var showDOB = getQueryVariable('age_required') === 'true';
   var showTicketHolderName = getQueryVariable('names_required') === 'true';
 
-  var optedInFieldValue = _get(cartInfoData, 'optedIn', false); // fetch cart data
+  var optedInFieldValue = _get(cartInfoData, 'optedIn', false);
+
+  var getQuantity = function getQuantity(cart) {
+    if (cart === void 0) {
+      cart = [];
+    }
+
+    var qty = 0;
+    cart.forEach(function (item) {
+      qty += +item.quantity;
+    });
+    return qty;
+  }; // fetch cart data
 
 
   var fetchCart = /*#__PURE__*/function () {
     var _ref5 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
-      var res;
+      var res, cartInfo, _cartInfo$cart, cart;
+
       return runtime_1.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
@@ -1756,20 +1910,28 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
             case 3:
               res = _context2.sent;
               setCustomHeader(res);
-              setCartInfo(_get(res, 'data.data.attributes'));
-              _context2.next = 10;
+              cartInfo = _get(res, 'data.data.attributes');
+              setCartInfo(cartInfo);
+              _cartInfo$cart = cartInfo.cart, cart = _cartInfo$cart === void 0 ? [] : _cartInfo$cart;
+              setTicketsQuantity(getQuantity(cart));
+              onGetCartSuccess(res.data);
+              _context2.next = 15;
               break;
 
-            case 8:
-              _context2.prev = 8;
+            case 12:
+              _context2.prev = 12;
               _context2.t0 = _context2["catch"](0);
 
-            case 10:
+              if (axios.isAxiosError(_context2.t0)) {
+                onGetCartError(_context2.t0);
+              }
+
+            case 15:
             case "end":
               return _context2.stop();
           }
         }
-      }, _callee2, null, [[0, 8]]);
+      }, _callee2, null, [[0, 12]]);
     }));
 
     return function fetchCart() {
@@ -1788,7 +1950,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
               _context3.prev = 0;
 
               if (!(typeof window !== 'undefined' && token)) {
-                _context3.next = 9;
+                _context3.next = 10;
                 break;
               }
 
@@ -1801,21 +1963,26 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
               profileDataObj = setLoggedUserData(profileSpecifiedData);
               setUserValues(profileDataObj);
               window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
+              onGetProfileDataSuccess(userDataResponse.data);
 
-            case 9:
-              _context3.next = 13;
+            case 10:
+              _context3.next = 15;
               break;
 
-            case 11:
-              _context3.prev = 11;
+            case 12:
+              _context3.prev = 12;
               _context3.t0 = _context3["catch"](0);
 
-            case 13:
+              if (axios.isAxiosError(_context3.t0)) {
+                onGetProfileDataError(_context3.t0);
+              }
+
+            case 15:
             case "end":
               return _context3.stop();
           }
         }
-      }, _callee3, null, [[0, 11]]);
+      }, _callee3, null, [[0, 12]]);
     }));
 
     return function fetchUserData(_x) {
@@ -1834,10 +2001,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
           while (1) {
             switch (_context4.prev = _context4.next) {
               case 0:
-                _context4.next = 2;
+                _context4.prev = 0;
+                _context4.next = 3;
                 return getCountries();
 
-              case 2:
+              case 3:
                 res = _context4.sent;
                 setCustomHeader(res);
                 setCountries(_map(_get(res, 'data.data'), function (item, key) {
@@ -1846,13 +2014,24 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
                     value: Number(key)
                   };
                 }));
+                onGetCountriesSuccess(res.data);
+                _context4.next = 12;
+                break;
 
-              case 5:
+              case 9:
+                _context4.prev = 9;
+                _context4.t0 = _context4["catch"](0);
+
+                if (axios.isAxiosError(_context4.t0)) {
+                  onGetCountriesError(_context4.t0);
+                }
+
+              case 12:
               case "end":
                 return _context4.stop();
             }
           }
-        }, _callee4);
+        }, _callee4, null, [[0, 9]]);
       }));
 
       return function fetchCountries() {
@@ -1875,7 +2054,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
     enableReinitialize: true,
     onSubmit: function () {
       var _onSubmit = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee5(values, formikHelpers) {
-        var updatedUserData, _profileSpecifiedData, _profileDataObj, _checkoutBody, _res, bodyFormData, resRegister, access_token_register, profileData, profileSpecifiedData, profileDataObj, checkoutBody, res, _e$response, _e$response$data, _e$response2, error;
+        var updatedUserData, _profileSpecifiedData, _profileDataObj, _checkoutBody, _res, bodyFormData, access_token_register, resRegister, refreshToken, tokens, _e$response, _e$response$data, error, profileData, profileSpecifiedData, profileDataObj, checkoutBody, res, _e$response2;
 
         return runtime_1.wrap(function _callee5$(_context5) {
           while (1) {
@@ -1906,7 +2085,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
                 }
 
               case 9:
-                _checkoutBody = createCheckoutDataBody(values, {
+                _checkoutBody = createCheckoutDataBody(ticketsQuantity, values, {
                   emailLogged: emailLogged,
                   firstNameLogged: firstNameLogged,
                   lastNameLogged: lastNameLogged
@@ -1921,17 +2100,55 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
 
               case 15:
                 bodyFormData = createRegisterFormData(values);
-                _context5.next = 18;
+                access_token_register = null;
+                _context5.prev = 17;
+                _context5.next = 20;
                 return register(bodyFormData);
 
-              case 18:
+              case 20:
                 resRegister = _context5.sent;
                 access_token_register = _get(resRegister, 'data.data.attributes.access_token');
+                refreshToken = _get(resRegister, 'data.data.attributes.refresh_token');
                 handleSetAccessToken(access_token_register);
-                _context5.next = 23;
+                tokens = {
+                  accessToken: access_token_register,
+                  refreshToken: refreshToken
+                };
+                onRegisterSuccess(tokens);
+                _context5.next = 32;
+                break;
+
+              case 28:
+                _context5.prev = 28;
+                _context5.t0 = _context5["catch"](17);
+
+                if (axios.isAxiosError(_context5.t0)) {
+                  error = _context5.t0 == null ? void 0 : (_e$response = _context5.t0.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message;
+
+                  if (_includes(error, 'You must be aged')) {
+                    formikHelpers.setFieldError('holderAge', error);
+                  }
+
+                  if (error != null && error.password) {
+                    formikHelpers.setFieldError('password', error.password);
+                    formikHelpers.setFieldError('confirmPassword', error.password);
+                  }
+
+                  if (error != null && error.email) {
+                    setAlreadyHasUser(true);
+                    setShowModalLogin(true);
+                  }
+
+                  onRegisterError(_context5.t0);
+                }
+
+                return _context5.abrupt("return");
+
+              case 32:
+                _context5.next = 34;
                 return getProfileData(access_token_register);
 
-              case 23:
+              case 34:
                 profileData = _context5.sent;
                 profileSpecifiedData = _get(profileData, 'data.data');
                 profileDataObj = setLoggedUserData(profileSpecifiedData);
@@ -1940,42 +2157,26 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
                   window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
                 }
 
-                checkoutBody = createCheckoutDataBody(values, {
+                checkoutBody = createCheckoutDataBody(ticketsQuantity, values, {
                   emailLogged: emailLogged,
                   firstNameLogged: firstNameLogged,
                   lastNameLogged: lastNameLogged
                 }, showDOB);
-                _context5.next = 30;
+                _context5.next = 41;
                 return postOnCheckout(checkoutBody, access_token_register);
 
-              case 30:
+              case 41:
                 res = _context5.sent;
                 handleSubmit(values, formikHelpers, res);
-                _context5.next = 37;
+                _context5.next = 48;
                 break;
 
-              case 34:
-                _context5.prev = 34;
-                _context5.t0 = _context5["catch"](0);
-
-                if (axios.isAxiosError(_context5.t0)) {
-                  error = _context5.t0 == null ? void 0 : (_e$response = _context5.t0.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message;
-
-                  if (_includes(error, 'You must be aged')) {
-                    formikHelpers.setFieldError('holderAge', error);
-                  }
-
-                  if (error != null && error.password) {
-                    formikHelpers.setFieldError('password', error.password);
-                    formikHelpers.setFieldError('confirmPassword', error.password);
-                  }
-
-                  if (error != null && error.email) {
-                    setAlreadyHasUser(true);
-                    setShowModalLogin(true);
-                  }
+              case 45:
+                _context5.prev = 45;
+                _context5.t1 = _context5["catch"](0);
 
-                  if (((_e$response2 = _context5.t0.response) == null ? void 0 : _e$response2.data.error) === 'invalid_token') {
+                if (axios.isAxiosError(_context5.t1)) {
+                  if (((_e$response2 = _context5.t1.response) == null ? void 0 : _e$response2.data.error) === 'invalid_token') {
                     if (typeof window !== 'undefined') {
                       window.localStorage.removeItem('user_data');
                       window.localStorage.removeItem('access_token');
@@ -1983,14 +2184,16 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
                       setShowModalLogin(true);
                     }
                   }
+
+                  onSubmitError(_context5.t1);
                 }
 
-              case 37:
+              case 48:
               case "end":
                 return _context5.stop();
             }
           }
-        }, _callee5, null, [[0, 34]]);
+        }, _callee5, null, [[0, 45], [17, 28]]);
       }));
 
       function onSubmit(_x2, _x3) {
@@ -2007,7 +2210,9 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
       setStates: setStates,
       setFieldValue: props.setFieldValue,
       setValues: props.setValues,
-      setUserValues: setUserValues
+      setUserValues: setUserValues,
+      onGetStatesSuccess: onGetStatesSuccess,
+      onGetStatesError: onGetStatesError
     }), React__default.createElement("div", {
       className: "billing-info-container " + theme
     }, !isLoggedIn && React__default.createElement("div", {
@@ -2018,6 +2223,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
       className: "login-register-button",
       type: "button",
       onClick: function onClick() {
+        onLogin();
         setShowModalLogin(true);
       }
     }, "Login"))), _map(data, function (item) {
@@ -2034,13 +2240,13 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
         key: id
       }, React__default.createElement("p", {
         className: labelClassName
-      }, label), _map(fields, function (group, index) {
+      }, label), _map(fields, function (group) {
         var groupClassname = group.groupClassname,
             groupItems = group.groupItems,
             groupLabel = group.groupLabel,
             groupLabelClassName = group.groupLabelClassName;
-        return React__default.createElement("div", {
-          key: index
+        return React__default.createElement(SectionContainer, {
+          key: group.id
         }, !isLoggedIn && React__default.createElement("div", {
           className: groupLabelClassName
         }, groupLabel), React__default.createElement("div", {
@@ -2073,16 +2279,43 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
           }));
         })));
       }));
-    }), React__default.createElement("div", {
-      style: {
-        display: 'flex',
-        padding: 20,
-        justifyContent: 'center'
-      }
-    }, React__default.createElement(Button, {
+    }), showTicketHolderName && React__default.createElement("div", null, React__default.createElement("p", null, ticketHoldersFields.label), _map(new Array(ticketsQuantity), function (_item, index) {
+      return React__default.createElement("div", {
+        key: index
+      }, React__default.createElement("h5", null, "Ticket ", index + 1), _map(ticketHoldersFields.fields, function (group) {
+        var groupClassname = group.groupClassname,
+            groupItems = group.groupItems;
+        return React__default.createElement("div", {
+          key: group.id
+        }, React__default.createElement("div", {
+          className: groupClassname
+        }, _map(groupItems, function (element) {
+          return React__default.createElement("div", {
+            className: element.className,
+            key: element.name + "-" + index
+          }, React__default.createElement(formik.Field, {
+            name: element.name + "-" + index,
+            key: element.name + "-" + index,
+            label: element.label,
+            type: element.type,
+            required: true,
+            component: element.type === 'checkbox' ? CheckboxField : CustomField,
+            validate: combineValidators(element.required ? requiredValidator : function () {}, element.onValidate ? element.onValidate : function () {})
+          }));
+        })));
+      }));
+    })), React__default.createElement("div", {
+      className: "button-container"
+    }, React__default.createElement(LoadingButton, {
       type: "submit",
       variant: "contained",
-      className: "login-register-button"
+      className: "login-register-button",
+      loadingIndicator: React__default.createElement(material.CircularProgress, {
+        color: "inherit",
+        size: 26
+      }),
+      loading: props.isSubmitting,
+      disabled: props.isSubmitting
     }, buttonName))));
   }), showModalLogin && React__default.createElement(LoginModal, {
     onClose: function onClose() {
@@ -2090,17 +2323,23 @@ var BillingInfoContainer = function BillingInfoContainer(_ref4) {
     },
     onLogin: function onLogin() {
       setShowModalLogin(false);
+      setUserExpired(false);
     },
     alreadyHasUser: alreadyHasUser,
     userExpired: userExpired,
-    setUserExpired: setUserExpired
+    onAuthorizeSuccess: onAuthorizeSuccess,
+    onAuthorizeError: onAuthorizeError,
+    onGetProfileDataSuccess: onGetProfileDataSuccess,
+    onGetProfileDataError: onGetProfileDataError
   }), showModalRegister && React__default.createElement(RegisterModal, {
     onClose: function onClose() {
       setShowModalRegister(false);
     },
     onRegister: function onRegister() {
       setShowModalRegister(false);
-    }
+    },
+    onGetProfileDataSuccess: onGetProfileDataSuccess,
+    onGetProfileDataError: onGetProfileDataError
   }));
 };
 
@@ -2407,7 +2646,13 @@ var PaymentContainer = function PaymentContainer(_ref) {
       errorText = _ref.errorText,
       checkoutData = _ref.checkoutData,
       _ref$onErrorClose = _ref.onErrorClose,
-      onErrorClose = _ref$onErrorClose === void 0 ? _identity : _ref$onErrorClose;
+      onErrorClose = _ref$onErrorClose === void 0 ? _identity : _ref$onErrorClose,
+      _ref$onGetPaymentData = _ref.onGetPaymentDataSuccess,
+      onGetPaymentDataSuccess = _ref$onGetPaymentData === void 0 ? function () {} : _ref$onGetPaymentData,
+      _ref$onGetPaymentData2 = _ref.onGetPaymentDataError,
+      onGetPaymentDataError = _ref$onGetPaymentData2 === void 0 ? function () {} : _ref$onGetPaymentData2,
+      _ref$onPaymentError = _ref.onPaymentError,
+      onPaymentError = _ref$onPaymentError === void 0 ? function () {} : _ref$onPaymentError;
 
   var _useState = React.useState(initialReviewValues),
       reviewData = _useState[0],
@@ -2458,17 +2703,19 @@ var PaymentContainer = function PaymentContainer(_ref) {
                   currency: order_details == null ? void 0 : order_details.currency
                 };
                 setOrderData(_orderData);
+                onGetPaymentDataSuccess(response.data);
               }
 
-              _context.next = 10;
+              _context.next = 11;
               break;
 
             case 7:
               _context.prev = 7;
               _context.t0 = _context["catch"](0);
               setError(_get(_context.t0, 'response.data.message'));
+              onGetPaymentDataError(_context.t0.response);
 
-            case 10:
+            case 11:
             case "end":
               return _context.stop();
           }
@@ -2509,15 +2756,16 @@ var PaymentContainer = function PaymentContainer(_ref) {
                 setPaymentIsLoading(false);
               }
 
-              _context2.next = 14;
+              _context2.next = 15;
               break;
 
             case 11:
               _context2.prev = 11;
               _context2.t0 = _context2["catch"](0);
               setError(_get(_context2.t0, 'response.data.message'));
+              onPaymentError(_context2.t0.response);
 
-            case 14:
+            case 15:
             case "end":
               return _context2.stop();
           }
@@ -2586,7 +2834,11 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
       _ref$shareButtons = _ref.shareButtons,
       shareButtons = _ref$shareButtons === void 0 ? [] : _ref$shareButtons,
       _ref$shareLink = _ref.shareLink,
-      shareLink = _ref$shareLink === void 0 ? '' : _ref$shareLink;
+      shareLink = _ref$shareLink === void 0 ? '' : _ref$shareLink,
+      _ref$onGetConfirmatio = _ref.onGetConfirmationDataSuccess,
+      onGetConfirmationDataSuccess = _ref$onGetConfirmatio === void 0 ? function () {} : _ref$onGetConfirmatio,
+      _ref$onGetConfirmatio2 = _ref.onGetConfirmationDataError,
+      onGetConfirmationDataError = _ref$onGetConfirmatio2 === void 0 ? function () {} : _ref$onGetConfirmatio2;
   var inputRef = React.useRef(null);
 
   var _useState = React.useState({}),
@@ -2607,7 +2859,7 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
               dataEncoded = typeof window !== 'undefined' && window.localStorage.getItem('checkoutData');
 
               if (!dataEncoded) {
-                _context.next = 14;
+                _context.next = 16;
                 break;
               }
 
@@ -2621,21 +2873,23 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
               response = _context.sent;
               _data = _get(response, 'data.data.attributes');
               setData(_data);
-              _context.next = 14;
+              onGetConfirmationDataSuccess(response.data);
+              _context.next = 16;
               break;
 
-            case 12:
-              _context.prev = 12;
+            case 13:
+              _context.prev = 13;
               _context.t0 = _context["catch"](4);
+              onGetConfirmationDataError(_context.t0.response);
 
-            case 14:
+            case 16:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[4, 12]]);
+      }, _callee, null, [[4, 13]]);
     }))();
-  }, []);
+  }, [onGetConfirmationDataSuccess, onGetConfirmationDataError]);
   return React__default.createElement("div", {
     className: "confirmation-page"
   }, React__default.createElement("p", {
@@ -2854,7 +3108,13 @@ var TicketsContainer = function TicketsContainer(_ref) {
       eventId = _ref.eventId,
       onAddToCartSuccess = _ref.onAddToCartSuccess,
       _ref$contentStyle = _ref.contentStyle,
-      contentStyle = _ref$contentStyle === void 0 ? {} : _ref$contentStyle;
+      contentStyle = _ref$contentStyle === void 0 ? {} : _ref$contentStyle,
+      _ref$onAddToCartError = _ref.onAddToCartError,
+      onAddToCartError = _ref$onAddToCartError === void 0 ? function () {} : _ref$onAddToCartError,
+      _ref$onGetTicketsSucc = _ref.onGetTicketsSuccess,
+      onGetTicketsSuccess = _ref$onGetTicketsSucc === void 0 ? function () {} : _ref$onGetTicketsSucc,
+      _ref$onGetTicketsErro = _ref.onGetTicketsError,
+      onGetTicketsError = _ref$onGetTicketsErro === void 0 ? function () {} : _ref$onGetTicketsErro;
 
   var _useState = React.useState({}),
       selectedTickets = _useState[0],
@@ -2931,6 +3191,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
                     return _isObject(item);
                   });
                   setTickets(_tickets);
+                  onGetTicketsSuccess(response.data);
                 }
 
                 _context.next = 11;
@@ -2939,7 +3200,10 @@ var TicketsContainer = function TicketsContainer(_ref) {
               case 8:
                 _context.prev = 8;
                 _context.t0 = _context["catch"](0);
-                console.log('e', _context.t0);
+
+                if (axios.isAxiosError(_context.t0)) {
+                  onGetTicketsError(_context.t0);
+                }
 
               case 11:
                 _context.prev = 11;
@@ -3022,7 +3286,10 @@ var TicketsContainer = function TicketsContainer(_ref) {
             case 13:
               _context2.prev = 13;
               _context2.t0 = _context2["catch"](6);
-              console.log('e', _context2.t0);
+
+              if (axios.isAxiosError(_context2.t0)) {
+                onAddToCartError(_context2.t0);
+              }
 
             case 16:
               _context2.prev = 16;
@@ -3062,13 +3329,13 @@ var TicketsContainer = function TicketsContainer(_ref) {
         setPromoCodeUpdated(promoCode);
       }
     }
-  }), React__default.createElement(Button$1, {
+  }), React__default.createElement(Button, {
     className: "promo-apply-button",
     placeholder: "Promo Code",
     onClick: function onClick() {
       setPromoCodeUpdated(promoCode);
     }
-  }, "Apply")), !showPromoInput && !isAllTicketsSoldOut ? React__default.createElement(Button$1, {
+  }, "Apply")), !showPromoInput && !isAllTicketsSoldOut ? React__default.createElement(Button, {
     className: "promo-code-button",
     placeholder: "Promo Codes",
     onClick: function onClick() {
@@ -3079,7 +3346,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
     style: {
       display: 'none'
     }
-  }), !isAllTicketsSoldOut && React__default.createElement(Button$1, {
+  }), !isAllTicketsSoldOut && React__default.createElement(Button, {
     "aria-hidden": true,
     className: "book-button " + (handleBookIsLoading || _isEmpty(selectedTickets) || Object.values(selectedTickets)[0] === 0 ? 'disabled' : ''),
     onClick: !handleBookIsLoading && !_isEmpty(selectedTickets) && Object.values(selectedTickets)[0] > 0 ? handleBook : function () {}
@@ -3088,6 +3355,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
 
 exports.BillingInfoContainer = BillingInfoContainer;
 exports.ConfirmationContainer = ConfirmationContainer;
+exports.LoginModal = LoginModal;
 exports.PaymentContainer = PaymentContainer;
 exports.TicketsContainer = TicketsContainer;
 exports.createFixedFloatNormalizer = createFixedFloatNormalizer;