tf-checkout-react 1.0.99 → 1.0.100-beta.2

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

@@ -32,33 +32,35 @@ var CircularProgress = _interopDefault(require('@mui/material/CircularProgress')
 var Select = _interopDefault(require('@mui/material/Select'));
 var styles$1 = require('@mui/material/styles');
 var Backdrop = _interopDefault(require('@mui/material/Backdrop'));
+var Countdown$1 = _interopDefault(require('react-countdown'));
+var _isNumber = _interopDefault(require('lodash/isNumber'));
+var SVG = _interopDefault(require('react-inlinesvg'));
+var DatePicker = _interopDefault(require('@mui/lab/DatePicker'));
+var AdapterMoment = _interopDefault(require('@mui/lab/AdapterMoment'));
+var LocalizationProvider = _interopDefault(require('@mui/lab/LocalizationProvider'));
 var Container = _interopDefault(require('@mui/material/Container'));
 var Alert = _interopDefault(require('@mui/material/Alert'));
 var reactStripeJs = require('@stripe/react-stripe-js');
 var stripeJs = require('@stripe/stripe-js');
-var Countdown$1 = _interopDefault(require('react-countdown'));
-var _isNumber = _interopDefault(require('lodash/isNumber'));
 var reactShare = require('react-share');
 var _some = _interopDefault(require('lodash/some'));
-var _every = _interopDefault(require('lodash/every'));
 var _find = _interopDefault(require('lodash/find'));
 var Button$1 = _interopDefault(require('react-bootstrap/Button'));
 var jwt_decode = _interopDefault(require('jwt-decode'));
 var _sortBy = _interopDefault(require('lodash/sortBy'));
 var FormControl = _interopDefault(require('@mui/material/FormControl'));
 var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
-var SVG = _interopDefault(require('react-inlinesvg'));
 var moment = _interopDefault(require('moment-timezone'));
 var privateTheming = require('@mui/private-theming');
 var Table = _interopDefault(require('@mui/material/Table'));
 var TableBody = _interopDefault(require('@mui/material/TableBody'));
-var TableCell = _interopDefault(require('@mui/material/TableCell'));
 var TableContainer = _interopDefault(require('@mui/material/TableContainer'));
-var TableHead = _interopDefault(require('@mui/material/TableHead'));
-var TableRow = _interopDefault(require('@mui/material/TableRow'));
 var Paper = _interopDefault(require('@mui/material/Paper'));
 var TablePagination = _interopDefault(require('@mui/material/TablePagination'));
 var Autocomplete = _interopDefault(require('@mui/material/Autocomplete'));
+var TableRow = _interopDefault(require('@mui/material/TableRow'));
+var TableCell = _interopDefault(require('@mui/material/TableCell'));
+var TableHead = _interopDefault(require('@mui/material/TableHead'));
 var _has = _interopDefault(require('lodash/has'));
 var yup = require('yup');
 var Radio = _interopDefault(require('@mui/material/Radio'));
@@ -1003,14 +1005,87 @@ var ErrorFocusInternal = /*#__PURE__*/function (_Component) {
 
 var ErrorFocus = /*#__PURE__*/formik.connect(ErrorFocusInternal);
 
+function getDomain(url, subdomain) {
+  var updatedUrl = url.replace(/(https?:\/\/)?(www.)?/i, '');
+
+  if (!subdomain) {
+    updatedUrl = updatedUrl.split('.');
+    updatedUrl = updatedUrl.slice(updatedUrl.length - 2).join('.');
+  }
+
+  if (updatedUrl.indexOf('/') !== -1) {
+    return updatedUrl.split('/')[0];
+  }
+
+  return updatedUrl;
+}
+
+function setCustomCookie(name, value, days) {
+  if (days === void 0) {
+    days = 5;
+  }
+
+  var expires = '';
+
+  if (days) {
+    var date = new Date();
+    date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
+    expires = '; expires=' + date.toUTCString();
+  }
+
+  if (typeof window !== 'undefined') {
+    var domain = getDomain(window.location.hostname);
+    document.cookie = name + '=' + (value || '') + expires + '; path=/' + ("; domain=" + domain);
+  }
+}
+function getCookieByName(cname) {
+  if (typeof window === 'undefined') return '';
+  var name = cname + '=';
+  var ca = document.cookie.split(';');
+
+  for (var i = 0; i < ca.length; i++) {
+    var c = ca[i];
+
+    while (c.charAt(0) == ' ') {
+      c = c.substring(1);
+    }
+
+    if (c.indexOf(name) == 0) {
+      return c.substring(name.length, c.length);
+    }
+  }
+
+  return '';
+}
+function deleteCookieByName(name) {
+  if (typeof window !== 'undefined') {
+    var domain = getDomain(window.location.hostname);
+    document.cookie = name + '=; Path=/' + ("; domain=" + domain) + '; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
+  }
+}
+
 var downloadPDF = function downloadPDF(pdfUrl) {
   if (typeof window === 'undefined') return;
+  var xtfCookie = getCookieByName('X-TF-ECOMMERCE');
   var accessToken = localStorage.getItem('access_token');
-  if (!accessToken) return;
-  fetch(pdfUrl, {
-    headers: {
+  if (!accessToken && !xtfCookie) return;
+  var headers = {};
+
+  if (accessToken) {
+    headers = {
       Authorization: "Bearer " + accessToken
-    }
+    };
+  }
+
+  if (xtfCookie) {
+    headers = {
+      'X-TF-ECOMMERCE': xtfCookie
+    };
+  }
+
+  return fetch(pdfUrl, {
+    headers: headers,
+    credentials: 'include'
   }).then( /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(response) {
       var blobValue, fileNameHeader, fileName;
@@ -1023,7 +1098,7 @@ var downloadPDF = function downloadPDF(pdfUrl) {
 
             case 2:
               blobValue = _context.sent;
-              fileNameHeader = response.headers.get("content-disposition") || '';
+              fileNameHeader = response.headers.get('content-disposition') || '';
               fileName = fileNameHeader.split('"')[1];
               return _context.abrupt("return", {
                 blobValue: blobValue,
@@ -1044,7 +1119,11 @@ var downloadPDF = function downloadPDF(pdfUrl) {
   }()).then(function (_ref2) {
     var blobValue = _ref2.blobValue,
         fileName = _ref2.fileName;
-    if (!fileName) return;
+
+    if (!fileName) {
+      throw Error('Something went wrong.');
+    }
+
     var file = new Blob([blobValue], {
       type: 'application/pdf'
     });
@@ -1055,21 +1134,27 @@ var downloadPDF = function downloadPDF(pdfUrl) {
     document.body.appendChild(link);
     link.click();
     document.body.removeChild(link);
+  })["catch"](function (error) {
+    return error;
   });
 };
 
-var createCheckoutDataBodyWithDefaultHolder = function createCheckoutDataBodyWithDefaultHolder(ticketsQuantity, logedInValues, includeDob) {
+var createCheckoutDataBodyWithDefaultHolder = function createCheckoutDataBodyWithDefaultHolder(ticketsQuantity, logedInValues, includeDob, userCredentials) {
   if (includeDob === void 0) {
     includeDob = false;
   }
 
+  if (userCredentials === void 0) {
+    userCredentials = {};
+  }
+
   var ticket_holders = [];
-  var first_name = _get(logedInValues, 'firstName') || _get(logedInValues, 'first_name') || '';
-  var last_name = _get(logedInValues, 'lastName', '') || _get(logedInValues, 'last_name') || '';
+  var first_name = _get(logedInValues, 'firstName') || _get(logedInValues, 'first_name') || _get(userCredentials, 'firstNameLogged') || '';
+  var last_name = _get(logedInValues, 'lastName') || _get(logedInValues, 'last_name') || _get(userCredentials, 'lastNameLogged') || '';
 
   var phone = _get(logedInValues, 'phone', '');
 
-  var email = _get(logedInValues, 'email', '');
+  var email = _get(logedInValues, 'email') || _get(userCredentials, 'emailLogged') || '';
 
   for (var i = 0; i <= ticketsQuantity - 1; i++) {
     var individualHolder = i ? {
@@ -1121,6 +1206,13 @@ var publicRequest = /*#__PURE__*/axios.create({
   headers: ttfHeaders
 });
 publicRequest.interceptors.response.use(function (response) {
+  var authGuestToken = _get(response, 'headers.authorization-guest');
+
+  if (isWindowDefined && authGuestToken) {
+    window.localStorage.setItem('auth_guest_token', authGuestToken);
+    publicRequest.setGuestToken(authGuestToken);
+  }
+
   return response;
 }, function (error) {
   var _error$response;
@@ -1129,7 +1221,6 @@ publicRequest.interceptors.response.use(function (response) {
     if (isWindowDefined) {
       var _error$response2, _error$response2$data;
 
-      window.localStorage.removeItem('auth_guest_token');
       window.localStorage.removeItem('user_data');
       window.localStorage.removeItem('access_token');
       var errorType = error == null ? void 0 : (_error$response2 = error.response) == null ? void 0 : (_error$response2$data = _error$response2.data) == null ? void 0 : _error$response2$data.error;
@@ -1140,6 +1231,13 @@ publicRequest.interceptors.response.use(function (response) {
     }
   }
 
+  var authGuestToken = _get(error, 'response.headers.authorization-guest');
+
+  if (isWindowDefined && authGuestToken) {
+    window.localStorage.setItem('auth_guest_token', authGuestToken);
+    publicRequest.setGuestToken(authGuestToken);
+  }
+
   return Promise.reject(error);
 });
 publicRequest.interceptors.request.use(function (config) {
@@ -1165,20 +1263,41 @@ publicRequest.interceptors.request.use(function (config) {
     config.headers = _updatedHeaders;
   }
 
-  if (CONFIGS.X_SOURCE_ORIGIN) {
+  if (getCookieByName('X-TF-ECOMMERCE')) {
     var _updatedHeaders2 = _extends({}, config.headers, {
-      'X-Source-Origin': CONFIGS.X_SOURCE_ORIGIN
+      'X-TF-ECOMMERCE': getCookieByName('X-TF-ECOMMERCE')
     });
 
     config.headers = _updatedHeaders2;
   }
 
+  if (CONFIGS.X_SOURCE_ORIGIN) {
+    var _updatedHeaders3 = _extends({}, config.headers, {
+      'X-Source-Origin': CONFIGS.X_SOURCE_ORIGIN
+    });
+
+    config.headers = _updatedHeaders3;
+  }
+
   if (CONFIGS.BASE_URL) {
     config.baseURL = CONFIGS.BASE_URL + '/api';
   }
 
   return config;
 });
+publicRequest.interceptors.response.use(function (response) {
+  var xtfCookie = _get(response, 'headers.x-tf-ecommerce');
+
+  var url = _get(response, 'config.url');
+
+  var method = _get(response, 'config.method');
+
+  if (xtfCookie && !(url === '/auth' && method === 'delete')) {
+    setCustomCookie('X-TF-ECOMMERCE', xtfCookie);
+  }
+
+  return response;
+});
 
 publicRequest.setGuestToken = function (token) {
   return publicRequest.defaults.headers.common['Authorization-Guest'] = token;
@@ -1209,14 +1328,6 @@ var setCustomHeader = function setCustomHeader(response) {
     }
   }
 };
-var handleSetAccessToken = function handleSetAccessToken(token) {
-  if (token) {
-    if (isWindowDefined) {
-      window.localStorage.setItem('access_token', token);
-      publicRequest.setAccessToken(token);
-    }
-  }
-};
 function getEvent(id) {
   var response = publicRequest.get("v1/event/" + id, {
     headers: ttfHeaders
@@ -1257,14 +1368,11 @@ var postOnCheckout = function postOnCheckout(data, accessToken) {
   return res;
 };
 var authorize = function authorize(data) {
-  return publicRequest.post("v1/oauth/authorize-rn?client_id=" + (CONFIGS.CLIENT_ID || 'e9d8f8922797b4621e562255afe90dbf'), data);
+  return publicRequest.post("/auth?clientId=" + (CONFIGS.CLIENT_ID || 'e9d8f8922797b4621e562255afe90dbf'), data);
 };
 var register = function register(data) {
   return publicRequest.post('v1/oauth/register-rn', data);
 };
-var getAccessToken = function getAccessToken(data) {
-  return publicRequest.post('v1/oauth/access_token', data);
-};
 var getPaymentData = function getPaymentData(hash) {
   var response = publicRequest.get("v1/order/" + hash + "/review/")["catch"](function (error) {
     throw error;
@@ -1325,8 +1433,17 @@ var postReferralVisits = function postReferralVisits(eventId, referralId) {
     referrer: "" + referralId
   });
 };
-var checkTicketStatus = function checkTicketStatus(hash) {
-  return publicRequest.post("v1/ticket/" + hash + "/status/");
+var logout = function logout() {
+  return publicRequest["delete"]('/auth');
+};
+var processTicket = function processTicket(hash) {
+  return publicRequest.post("v1/ticket/" + hash + "/process/");
+};
+var declineInvitation = function declineInvitation(hash) {
+  return publicRequest.post("v1/ticket/" + hash + "/decline");
+};
+var sendRSVPInfo = function sendRSVPInfo(eventId, data) {
+  return publicRequest.post("v1/event/" + eventId + "/send-rsvp-info", data);
 };
 
 var style = {
@@ -1346,10 +1463,6 @@ var LoginModal = function LoginModal(_ref) {
       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,
@@ -1382,7 +1495,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, profileResponse, profileSpecifiedData, profileDataObj, event, _e$response, _e$response$data, _error;
+        var email, password, body, profileResponse, profileSpecifiedData, profileDataObj, event, _e$response, _e$response$data, _error;
 
         return runtime_1.wrap(function _callee$(_context) {
           while (1) {
@@ -1390,66 +1503,36 @@ var LoginModal = function LoginModal(_ref) {
               case 0:
                 email = _ref2.email, password = _ref2.password;
                 _context.prev = 1;
-                bodyFormData = new FormData();
-                bodyFormData.append('email', email);
-                bodyFormData.append('password', password);
-                _context.next = 7;
-                return authorize(bodyFormData);
-
-              case 7:
-                resAutorize = _context.sent;
-                bodyFormDataToken = new FormData();
-                bodyFormDataToken.append('code', resAutorize.data.data.code);
-                bodyFormDataToken.append('scope', 'profile');
-                bodyFormDataToken.append('grant_type', 'authorization_code');
-                bodyFormDataToken.append('client_id', CONFIGS.CLIENT_ID || 'e9d8f8922797b4621e562255afe90dbf');
-                bodyFormDataToken.append('client_secret', CONFIGS.CLIENT_SECRET || 'b89c191eff22fdcf84ac9bfd88d005355a151ec2c83b26b9');
-                resAccessToken = null;
-                _context.prev = 15;
-                _context.next = 18;
-                return getAccessToken(bodyFormDataToken);
-
-              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");
+                body = {
+                  email: email,
+                  password: password
+                };
+                _context.next = 5;
+                return authorize(body);
 
-              case 26:
-                accessToken = _get(resAccessToken, 'data.access_token');
-                handleSetAccessToken(accessToken);
+              case 5:
                 profileResponse = null;
-                _context.prev = 29;
-                _context.next = 32;
-                return getProfileData(accessToken);
+                _context.prev = 6;
+                _context.next = 9;
+                return getProfileData();
 
-              case 32:
+              case 9:
                 profileResponse = _context.sent;
                 onGetProfileDataSuccess(profileResponse.data);
-                _context.next = 40;
+                _context.next = 17;
                 break;
 
-              case 36:
-                _context.prev = 36;
-                _context.t1 = _context["catch"](29);
+              case 13:
+                _context.prev = 13;
+                _context.t0 = _context["catch"](6);
 
-                if (axios.isAxiosError(_context.t1)) {
-                  onGetProfileDataError(_context.t1);
+                if (axios.isAxiosError(_context.t0)) {
+                  onGetProfileDataError(_context.t0);
                 }
 
                 return _context.abrupt("return");
 
-              case 40:
+              case 17:
                 profileSpecifiedData = _get(profileResponse, 'data.data');
                 profileDataObj = {
                   id: profileSpecifiedData.id,
@@ -1460,32 +1543,31 @@ var LoginModal = function LoginModal(_ref) {
 
                 if (typeof window !== 'undefined') {
                   window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
-                  window.localStorage.setItem('access_token', accessToken);
                   event = new window.CustomEvent('tf-login');
                   window.document.dispatchEvent(event);
                 }
 
                 onLogin();
-                _context.next = 49;
+                _context.next = 26;
                 break;
 
-              case 46:
-                _context.prev = 46;
-                _context.t2 = _context["catch"](1);
+              case 23:
+                _context.prev = 23;
+                _context.t1 = _context["catch"](1);
 
-                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';
+                if (axios.isAxiosError(_context.t1)) {
+                  _error = (_context.t1 == null ? void 0 : (_e$response = _context.t1.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message) || 'Error';
                   setError(_error);
-                } else if (_context.t2 instanceof Error) {
-                  setError((_context.t2 == null ? void 0 : _context.t2.message) || 'Error');
+                } else if (_context.t1 instanceof Error) {
+                  setError((_context.t1 == null ? void 0 : _context.t1.message) || 'Error');
                 }
 
-              case 49:
+              case 26:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee, null, [[1, 46], [15, 22], [29, 36]]);
+        }, _callee, null, [[1, 23], [6, 13]]);
       }));
 
       function onSubmit(_x) {
@@ -1582,7 +1664,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, profileResponse, profileSpecifiedData, profileDataObj;
+        var firstName, lastName, email, password, confirmPassword, bodyFormData, profileResponse, profileSpecifiedData, profileDataObj;
         return runtime_1.wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
@@ -1600,27 +1682,24 @@ var RegisterModal = function RegisterModal(_ref) {
                 return register(bodyFormData);
 
               case 11:
-                resRegister = _context.sent;
-                access_token = _get(resRegister, 'data.data.attributes.access_token');
-                handleSetAccessToken(access_token);
                 profileResponse = null;
-                _context.prev = 15;
-                _context.next = 18;
-                return getProfileData(access_token);
+                _context.prev = 12;
+                _context.next = 15;
+                return getProfileData();
 
-              case 18:
+              case 15:
                 profileResponse = _context.sent;
                 onGetProfileDataSuccess(profileResponse.data);
-                _context.next = 26;
+                _context.next = 23;
                 break;
 
-              case 22:
-                _context.prev = 22;
-                _context.t0 = _context["catch"](15);
+              case 19:
+                _context.prev = 19;
+                _context.t0 = _context["catch"](12);
                 onGetProfileDataError(_context.t0.response);
                 return _context.abrupt("return");
 
-              case 26:
+              case 23:
                 profileSpecifiedData = _get(profileResponse, 'data.data');
                 profileDataObj = {
                   id: profileSpecifiedData.id,
@@ -1630,18 +1709,17 @@ var RegisterModal = function RegisterModal(_ref) {
                 };
 
                 if (typeof window !== 'undefined') {
-                  window.localStorage.setItem('access_token', access_token);
                   window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
                 }
 
                 onClose();
 
-              case 30:
+              case 27:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee, null, [[15, 22]]);
+        }, _callee, null, [[12, 19]]);
       }));
 
       function onSubmit(_x) {
@@ -1795,6 +1873,7 @@ var createRegisterFormData = function createRegisterFormData(values, checkoutBod
   bodyFormData.append('password_confirmation', values.confirmPassword);
   bodyFormData.append('client_id', CONFIGS.CLIENT_ID || 'e9d8f8922797b4621e562255afe90dbf');
   bodyFormData.append('client_secret', CONFIGS.CLIENT_SECRET || 'b89c191eff22fdcf84ac9bfd88d005355a151ec2c83b26b9');
+  bodyFormData.append('check_cart_expiration', 'true');
 
   _forEach(checkoutBody.attributes, function (item, key) {
     bodyFormData.append(key, item);
@@ -1810,7 +1889,7 @@ var setLoggedUserData = function setLoggedUserData(data) {
     email: data.email,
     confirmEmail: data.email,
     city: (data == null ? void 0 : data.city) || '',
-    country: (data == null ? void 0 : data.country) || '',
+    country: (data == null ? void 0 : data.countryId) || (data == null ? void 0 : data.country) || '',
     phone: (data == null ? void 0 : data.phone) || '',
     street_address: (data == null ? void 0 : data.streetAddress) || '',
     state: (data == null ? void 0 : data.stateId) || '',
@@ -1856,10 +1935,10 @@ var createCheckoutDataBody = function createCheckoutDataBody(ticketsQuantity, va
   });
   ticket_holders = filteredHolders.map(function (item, index) {
     return {
-      first_name: item["holderFirstName-" + index] || '',
-      last_name: item["holderLastName-" + index] || '',
+      first_name: !index ? item["holderFirstName-" + index] || logedInValues.firstNameLogged || '' : item["holderFirstName-" + index] || '',
+      last_name: !index ? item["holderLastName-" + index] || logedInValues.lastNameLogged || '' : item["holderLastName-" + index] || '',
       phone: item["holderPhone-" + index] || '',
-      email: item["holderEmail-" + index] || ''
+      email: !index ? item["holderEmail-" + index] || logedInValues.emailLogged || '' : item["holderEmail-" + index] || ''
     };
   });
   var filteredRestValue = {};
@@ -1910,6 +1989,14 @@ var getValidateFunctions = function getValidateFunctions(element, states, values
     validationFunctions.push(isSameEmail);
   }
 
+  if (element.name === 'confirmPassword') {
+    var isSame = function isSame(confirmPassword) {
+      return values.password !== confirmPassword ? 'Password confirmation does not match' : null;
+    };
+
+    validationFunctions.push(isSame);
+  }
+
   return combineValidators.apply(void 0, validationFunctions);
 };
 var assingUniqueIds = function assingUniqueIds(data) {
@@ -1961,13 +2048,21 @@ var CustomField = function CustomField(_ref) {
       touched = _ref$form.touched,
       errors = _ref$form.errors,
       submitCount = _ref$form.submitCount,
-      theme = _ref.theme;
+      theme = _ref.theme,
+      _ref$inputProps = _ref.inputProps,
+      pInputProps = _ref$inputProps === void 0 ? {} : _ref$inputProps,
+      _ref$InputProps = _ref.InputProps,
+      InputProps = _ref$InputProps === void 0 ? {} : _ref$InputProps,
+      inputRef = _ref.inputRef;
   var isSelectField = type === 'select';
 
   var error = _get(errors, field.name);
 
   var isTouched = Boolean(_get(touched, field.name)) || _includes(field.name, 'holder') && !!error && !!submitCount;
   var customTheme = styles.useTheme();
+  var inputProps = {
+    sx: customTheme == null ? void 0 : customTheme.input
+  };
   return React__default.createElement(TextField, Object.assign({
     id: field.name,
     label: label,
@@ -1984,12 +2079,11 @@ var CustomField = function CustomField(_ref) {
       }
     },
     InputLabelProps: {
-      sx: customTheme == null ? void 0 : customTheme.input,
-      shrink: field.name === 'holderAge' ? true : undefined
-    },
-    inputProps: {
       sx: customTheme == null ? void 0 : customTheme.input
-    }
+    },
+    InputProps: InputProps,
+    inputProps: _extends({}, inputProps, pInputProps),
+    inputRef: inputRef
   }, field), isSelectField ? _map(selectOptions, function (option) {
     return React__default.createElement("option", {
       key: option.value,
@@ -2167,6 +2261,204 @@ var SelectField = function SelectField(_ref) {
   }, error) : null);
 };
 
+var showZero = function showZero(value) {
+  if (value === void 0) {
+    value = 0;
+  }
+
+  var intNumber = Number(value);
+  return _isNumber(intNumber) ? intNumber >= 0 && intNumber < 10 ? '0' + intNumber : intNumber : null;
+};
+
+var getImage = function getImage(name) {
+  if (name === void 0) {
+    name = '';
+  }
+
+  var image = '';
+
+  if (!name.trim().length) {
+    return image;
+  }
+
+  return image;
+};
+
+var TimerWidget = function TimerWidget(_ref) {
+  var expires_at = _ref.expires_at,
+      buyLoading = _ref.buyLoading,
+      _ref$onCountdownFinis = _ref.onCountdownFinish,
+      onCountdownFinish = _ref$onCountdownFinis === void 0 ? function () {} : _ref$onCountdownFinis;
+
+  var _useState = React.useState(true),
+      showTimer = _useState[0],
+      setShowTimer = _useState[1];
+
+  var handleCountdownFinish = function handleCountdownFinish() {
+    setShowTimer(false);
+
+    if (!buyLoading) {
+      onCountdownFinish();
+    }
+  };
+
+  var _renderer = function renderer(_ref2) {
+    var minutes = _ref2.minutes,
+        seconds = _ref2.seconds,
+        completed = _ref2.completed,
+        handleCountdownFinish = _ref2.handleCountdownFinish;
+
+    if (completed) {
+      handleCountdownFinish();
+      return null;
+    }
+
+    return React__default.createElement("span", null, showZero(minutes), ":", showZero(seconds));
+  };
+
+  var hideTimer = function hideTimer() {
+    var timerRl = document.querySelector('.timer');
+
+    if (timerRl) {
+      timerRl.style.visibility = "hidden";
+    }
+  };
+
+  return showTimer && !!expires_at ? React__default.createElement("div", {
+    className: "timer"
+  }, React__default.createElement("div", {
+    className: 'close-icon',
+    onClick: hideTimer
+  }, React__default.createElement(SVG, {
+    src: getImage('cross.svg'),
+    width: '10',
+    height: '10',
+    fill: '#fff'
+  })), React__default.createElement("div", {
+    className: "toast-message"
+  }, React__default.createElement("p", null, "Please complete your purchase before the timer reaches zero."), React__default.createElement("p", {
+    className: "countdown"
+  }, React__default.createElement(Countdown$1, {
+    date: Date.now() + expires_at * 1000,
+    renderer: function renderer(props) {
+      return _renderer(_extends({}, props, {
+        handleCountdownFinish: handleCountdownFinish
+      }));
+    }
+  })))) : null;
+};
+
+var TimerWidget$1 = /*#__PURE__*/React.memo(TimerWidget);
+
+var SnackbarAlert = function SnackbarAlert(_ref) {
+  var isOpen = _ref.isOpen,
+      message = _ref.message,
+      type = _ref.type,
+      position = _ref.position,
+      _ref$autoHideDuration = _ref.autoHideDuration,
+      autoHideDuration = _ref$autoHideDuration === void 0 ? 3000 : _ref$autoHideDuration,
+      variant = _ref.variant,
+      onClose = _ref.onClose;
+  return React__default.createElement("div", {
+    className: "snackbar-alert-container"
+  }, React__default.createElement(material.Snackbar, {
+    autoHideDuration: autoHideDuration,
+    open: isOpen,
+    anchorOrigin: position || {
+      vertical: 'top',
+      horizontal: 'center'
+    },
+    onClose: onClose,
+    classes: {
+      root: 'snackbar-alert-snackbar-root'
+    }
+  }, React__default.createElement(material.Alert, {
+    severity: type,
+    onClose: onClose,
+    variant: variant || 'filled',
+    classes: {
+      icon: 'snackbar-alert-icon',
+      root: 'snackbar-alert-alert-root',
+      action: 'snackbar-alert-action',
+      message: 'snackbar-alert-message',
+      filled: 'snackbar-alert-filled'
+    }
+  }, message)));
+};
+
+var DATE_SIZE = 32;
+var compactStyles = {
+  '& > div': {
+    minWidth: 256
+  },
+  '& > div > div, & > div > div > div, & .MuiCalendarPicker-root': {
+    width: 256
+  },
+  '& .MuiTypography-caption': {
+    width: DATE_SIZE,
+    margin: 0
+  },
+  '& .PrivatePickersSlideTransition-root': {
+    minHeight: DATE_SIZE * 6
+  },
+  '& .PrivatePickersSlideTransition-root [role="row"]': {
+    margin: 0
+  },
+  '& .MuiPickersDay-dayWithMargin': {
+    margin: 0
+  },
+  '& .MuiPickersDay-root': {
+    width: DATE_SIZE,
+    height: DATE_SIZE
+  }
+};
+var compactStyleTheme = /*#__PURE__*/styles$1.createTheme({
+  components: {
+    MuiPaper: {
+      defaultProps: {
+        sx: compactStyles
+      }
+    }
+  }
+});
+var DatePickerField = function DatePickerField(_ref) {
+  var label = _ref.label,
+      field = _ref.field,
+      form = _ref.form,
+      theme = _ref.theme,
+      _ref$useCompact = _ref.useCompact,
+      useCompact = _ref$useCompact === void 0 ? true : _ref$useCompact;
+  return React__default.createElement(styles$1.ThemeProvider, {
+    theme: useCompact ? compactStyleTheme : {}
+  }, React__default.createElement(LocalizationProvider, {
+    dateAdapter: AdapterMoment
+  }, React__default.createElement(DatePicker, {
+    value: field.value || '',
+    onChange: function onChange(value) {
+      return form.setFieldValue(field.name, value);
+    },
+    PopperProps: {
+      placement: 'bottom-start'
+    },
+    showDaysOutsideCurrentMonth: true,
+    disableFuture: true,
+    inputFormat: "DD/MM/YYYY",
+    mask: "__/__/____",
+    renderInput: function renderInput(params) {
+      return React__default.createElement(CustomField, Object.assign({}, params, {
+        inputProps: _extends({}, params.inputProps, {
+          placeholder: 'dd/mm/yyyy'
+        }),
+        theme: theme,
+        field: field,
+        form: form,
+        label: label,
+        type: "tel"
+      }));
+    }
+  })));
+};
+
 var LogicRunner = function LogicRunner(_ref) {
   var values = _ref.values,
       setStates = _ref.setStates,
@@ -2174,7 +2466,8 @@ var LogicRunner = function LogicRunner(_ref) {
       setValues = _ref.setValues,
       setUserValues = _ref.setUserValues,
       onGetStatesSuccess = _ref.onGetStatesSuccess,
-      onGetStatesError = _ref.onGetStatesError;
+      onGetStatesError = _ref.onGetStatesError,
+      shouldFetchCountries = _ref.shouldFetchCountries;
   var prevCountry = React.useRef(values.country);
   React.useEffect(function () {
     var fetchStates = /*#__PURE__*/function () {
@@ -2229,7 +2522,7 @@ var LogicRunner = function LogicRunner(_ref) {
       };
     }();
 
-    fetchStates();
+    shouldFetchCountries && fetchStates();
   }, [values.country, setStates, setFieldValue]);
   var userDataEncoded = typeof window !== 'undefined' ? window.localStorage.getItem('user_data') : '';
   React.useEffect(function () {
@@ -2240,8 +2533,8 @@ var LogicRunner = function LogicRunner(_ref) {
           try {
             var parsedData = JSON.parse(userDataEncoded);
             var mappedValues = {
-              firstName: (parsedData == null ? void 0 : parsedData.first_name) || '',
-              lastName: (parsedData == null ? void 0 : parsedData.last_name) || '',
+              firstName: (parsedData == null ? void 0 : parsedData.first_name) || (parsedData == null ? void 0 : parsedData.firstName) || '',
+              lastName: (parsedData == null ? void 0 : parsedData.last_name) || (parsedData == null ? void 0 : parsedData.lastName) || '',
               email: (parsedData == null ? void 0 : parsedData.email) || '',
               phone: (parsedData == null ? void 0 : parsedData.phone) || '',
               confirmEmail: (parsedData == null ? void 0 : parsedData.email) || '',
@@ -2249,15 +2542,15 @@ var LogicRunner = function LogicRunner(_ref) {
               street_address: (parsedData == null ? void 0 : parsedData.street_address) || '',
               country: (parsedData == null ? void 0 : parsedData.country) || '1',
               zip: (parsedData == null ? void 0 : parsedData.zip) || '',
-              brand_opt_in: (parsedData == null ? void 0 : parsedData.brand_opt_in) || '',
+              brand_opt_in: (parsedData == null ? void 0 : parsedData.brand_opt_in) || false,
               city: (parsedData == null ? void 0 : parsedData.city) || '',
               confirmPassword: '',
               password: '',
-              'holderFirstName-0': (parsedData == null ? void 0 : parsedData.first_name) || '',
-              'holderLastName-0': (parsedData == null ? void 0 : parsedData.last_name) || '',
+              'holderFirstName-0': (parsedData == null ? void 0 : parsedData.first_name) || (parsedData == null ? void 0 : parsedData.firstName) || '',
+              'holderLastName-0': (parsedData == null ? void 0 : parsedData.last_name) || (parsedData == null ? void 0 : parsedData.lastName) || '',
               'holderEmail-0': (parsedData == null ? void 0 : parsedData.email) || ''
             };
-            setValues(mappedValues);
+            setValues(_extends({}, values, mappedValues));
             setUserValues(mappedValues);
           } catch (e) {}
         }
@@ -2329,7 +2622,13 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       _ref3$skipPage = _ref3.skipPage,
       skipPage = _ref3$skipPage === void 0 ? false : _ref3$skipPage,
       _ref3$canSkipHolderNa = _ref3.canSkipHolderNames,
-      canSkipHolderNames = _ref3$canSkipHolderNa === void 0 ? false : _ref3$canSkipHolderNa;
+      canSkipHolderNames = _ref3$canSkipHolderNa === void 0 ? false : _ref3$canSkipHolderNa,
+      _ref3$shouldFetchCoun = _ref3.shouldFetchCountries,
+      shouldFetchCountries = _ref3$shouldFetchCoun === void 0 ? true : _ref3$shouldFetchCoun,
+      _ref3$onCountdownFini = _ref3.onCountdownFinish,
+      onCountdownFinish = _ref3$onCountdownFini === void 0 ? function () {} : _ref3$onCountdownFini,
+      _ref3$enableTimer = _ref3.enableTimer,
+      enableTimer = _ref3$enableTimer === void 0 ? false : _ref3$enableTimer;
 
   var themeMui = styles$1.createTheme(themeOptions);
   var isWindowDefined = typeof window !== 'undefined';
@@ -2340,7 +2639,9 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       dataWithUniqueIds = _useState[0],
       setDataWithUniqueIds = _useState[1];
 
-  var _useState2 = React.useState(!!access_token),
+  var xtfCookie = getCookieByName('X-TF-ECOMMERCE');
+
+  var _useState2 = React.useState(!!(pIsLoggedIn || xtfCookie)),
       isLoggedIn = _useState2[0],
       setIsLoggedIn = _useState2[1];
 
@@ -2418,6 +2719,8 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
   var hideTtfOptIn = _get(cartInfoData, 'hide_ttf_opt_in', true);
 
+  var expirationTime = _get(cartInfoData, 'expiresAt');
+
   var flagRequirePhone = getQueryVariable('phone_required') === 'true'; // Get prevProps
 
   var prevData = React.useRef(data);
@@ -2448,10 +2751,10 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
   };
 
   React.useEffect(function () {
-    if ((pIsLoggedIn || access_token) && !isLoggedIn) {
-      setIsLoggedIn(true);
+    if (pIsLoggedIn !== isLoggedIn || xtfCookie) {
+      setIsLoggedIn(!!(pIsLoggedIn || xtfCookie));
     }
-  }, [pIsLoggedIn, isLoggedIn, access_token]); //just once
+  }, [pIsLoggedIn, isLoggedIn, xtfCookie]); //just once
 
   React.useEffect(function () {
     // fetch countries data
@@ -2500,7 +2803,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       };
     }();
 
-    fetchCountries();
+    shouldFetchCountries && fetchCountries();
     fetchCart();
   }, []); // fetch cart data
 
@@ -2560,7 +2863,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
             case 0:
               _context4.prev = 0;
 
-              if (!(isWindowDefined && token)) {
+              if (!(isWindowDefined && token || isLoggedIn)) {
                 _context4.next = 10;
                 break;
               }
@@ -2607,7 +2910,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
   React.useEffect(function () {
     fetchUserData(access_token);
-  }, [access_token]);
+  }, [access_token, isLoggedIn]);
   React.useEffect(function () {
     var collectPaymentData = /*#__PURE__*/function () {
       var _ref7 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee5() {
@@ -2617,7 +2920,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
             switch (_context5.prev = _context5.next) {
               case 0:
                 if (!(skipPage && !_isEmpty(ticketsQuantity) && !showDOB)) {
-                  _context5.next = 16;
+                  _context5.next = 17;
                   break;
                 }
 
@@ -2629,29 +2932,30 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
               case 6:
                 res = _context5.sent;
+                removeReferralKey();
                 onSkipBillingPage(_get(res, 'data.data.attributes'));
                 setLoading(false);
-                _context5.next = 14;
+                _context5.next = 15;
                 break;
 
-              case 11:
-                _context5.prev = 11;
+              case 12:
+                _context5.prev = 12;
                 _context5.t0 = _context5["catch"](3);
                 onSubmitError(_context5.t0);
 
-              case 14:
-                _context5.next = 17;
+              case 15:
+                _context5.next = 18;
                 break;
 
-              case 16:
+              case 17:
                 setLoading(false);
 
-              case 17:
+              case 18:
               case "end":
                 return _context5.stop();
             }
           }
-        }, _callee5, null, [[3, 11]]);
+        }, _callee5, null, [[3, 12]]);
       }));
 
       return function collectPaymentData() {
@@ -2662,47 +2966,62 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     collectPaymentData();
   }, [skipPage, ticketsQuantity]);
 
-  var collectCheckoutBody = function collectCheckoutBody(values) {
+  var collectCheckoutBody = function collectCheckoutBody(values, profileData) {
     var checkoutBody = {}; // Auto collect ticket holders name when it was skipped optionally
 
     if (showDOB && !showTicketHolders && canSkipHolderNames) {
-      checkoutBody = createCheckoutDataBodyWithDefaultHolder(ticketsQuantity.length, values, true);
-    } else {
-      checkoutBody = createCheckoutDataBody(ticketsQuantity.length, values, {
+      checkoutBody = createCheckoutDataBodyWithDefaultHolder(ticketsQuantity.length, values, true, {
         emailLogged: emailLogged,
         firstNameLogged: firstNameLogged,
         lastNameLogged: lastNameLogged
+      });
+    } else {
+      checkoutBody = createCheckoutDataBody(ticketsQuantity.length, values, {
+        emailLogged: emailLogged || profileData.email,
+        firstNameLogged: firstNameLogged || profileData.first_name || profileData.firstName,
+        lastNameLogged: lastNameLogged || profileData.last_name || profileData.lastName
       }, showDOB);
     }
 
     return checkoutBody;
-  }; // Displaying loader
+  };
 
+  var removeReferralKey = function removeReferralKey() {
+    localStorage.removeItem('referral_key');
+  };
 
-  if (loading) {
-    return React__default.createElement(Backdrop, {
-      sx: {
-        color: '#fff'
-      },
-      open: true
-    }, React__default.createElement(material.CircularProgress, {
-      color: "inherit"
-    }));
+  if (loading || enableTimer && !expirationTime && typeof window !== 'undefined') {
+    if (expirationTime === 0) {
+      // Redirect to homepage (countdown finished and browser reloaded case)
+      window.location.href = '/';
+    }
   }
 
   return React__default.createElement(styles$1.ThemeProvider, {
     theme: themeMui
-  }, React__default.createElement(formik.Formik, {
+  }, loading && React__default.createElement(Backdrop, {
+    sx: {
+      color: '#fff',
+      backgroundColor: '#000000bd',
+      zIndex: 1205
+    },
+    open: true
+  }, React__default.createElement(material.CircularProgress, {
+    color: "inherit"
+  })), !!expirationTime && enableTimer && React__default.createElement(TimerWidget$1, {
+    expires_at: expirationTime,
+    onCountdownFinish: onCountdownFinish
+  }), React__default.createElement(formik.Formik, {
     initialValues: getInitialValues(dataWithUniqueIds, _extends({}, initialValues, {
       country: _get(userData, 'country', '') || '1',
       state: _get(userData, 'state', '') || '1',
       brand_opt_in: optedInFieldValue,
       ttf_opt_in: ttfOptIn
     }), userValues),
-    enableReinitialize: true,
+    enableReinitialize: false,
     onSubmit: function () {
       var _onSubmit = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee6(values, formikHelpers) {
-        var updatedUserData, _profileSpecifiedData, _profileDataObj, _checkoutBody, _res, checkoutBodyForRegistration, bodyFormData, access_token_register, resRegister, refreshToken, tokens, _e$response, _e$response$data, _error, profileData, profileSpecifiedData, profileDataObj, checkoutBody, res, _e$response2, _e$response3;
+        var updatedUserData, _profileSpecifiedData, _profileDataObj, _checkoutBody, _res, checkoutBodyForRegistration, bodyFormData, resRegister, _xtfCookie, accessToken, refreshToken, userProfile, _e$response, _e$response$data, _error, profileData, profileSpecifiedData, profileDataObj, checkoutBody, res, _e$response2, _e$response3;
 
         return runtime_1.wrap(function _callee6$(_context6) {
           while (1) {
@@ -2711,7 +3030,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 _context6.prev = 0;
 
                 if (!isLoggedIn) {
-                  _context6.next = 15;
+                  _context6.next = 16;
                   break;
                 }
 
@@ -2733,43 +3052,47 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 }
 
               case 9:
-                _checkoutBody = collectCheckoutBody(values);
+                _checkoutBody = collectCheckoutBody(values, userData);
                 _context6.next = 12;
                 return postOnCheckout(_checkoutBody, access_token);
 
               case 12:
                 _res = _context6.sent;
+                removeReferralKey();
                 handleSubmit(values, formikHelpers, eventId, _res);
                 return _context6.abrupt("return");
 
-              case 15:
+              case 16:
                 checkoutBodyForRegistration = createCheckoutDataBody(ticketsQuantity.length, values, {
                   emailLogged: emailLogged,
                   firstNameLogged: firstNameLogged,
                   lastNameLogged: lastNameLogged
                 }, showDOB);
                 bodyFormData = createRegisterFormData(values, checkoutBodyForRegistration);
-                access_token_register = null;
                 _context6.prev = 18;
-                _context6.next = 21;
+                setLoading(true);
+                _context6.next = 22;
                 return register(bodyFormData);
 
-              case 21:
+              case 22:
                 resRegister = _context6.sent;
-                access_token_register = _get(resRegister, 'data.data.attributes.access_token');
+                _xtfCookie = _get(resRegister, 'headers.x-tf-ecommerce');
+                accessToken = _get(resRegister, 'data.data.attributes.access_token');
                 refreshToken = _get(resRegister, 'data.data.attributes.refresh_token');
-                handleSetAccessToken(access_token_register);
-                tokens = {
-                  accessToken: access_token_register,
-                  refreshToken: refreshToken
-                };
-                onRegisterSuccess(tokens);
-                _context6.next = 33;
+                userProfile = _get(resRegister, 'data.data.attributes.user_profile');
+                onRegisterSuccess({
+                  xtfCookie: _xtfCookie,
+                  accessToken: accessToken,
+                  refreshToken: refreshToken,
+                  userProfile: userProfile
+                });
+                _context6.next = 35;
                 break;
 
-              case 29:
-                _context6.prev = 29;
+              case 30:
+                _context6.prev = 30;
                 _context6.t0 = _context6["catch"](18);
+                setLoading(false);
 
                 if (axios.isAxiosError(_context6.t0)) {
                   _error = _context6.t0 == null ? void 0 : (_e$response = _context6.t0.response) == null ? void 0 : (_e$response$data = _e$response.data) == null ? void 0 : _e$response$data.message;
@@ -2789,16 +3112,20 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                     setShowModalLogin(true);
                   }
 
+                  if (_includes(_error, 'The cart is expired') && !hideErrorsAlertSection) {
+                    setError(_error);
+                  }
+
                   onRegisterError(_context6.t0, values.email);
                 }
 
                 return _context6.abrupt("return");
 
-              case 33:
-                _context6.next = 35;
-                return getProfileData(access_token_register);
-
               case 35:
+                _context6.next = 37;
+                return getProfileData();
+
+              case 37:
                 profileData = _context6.sent;
                 profileSpecifiedData = _get(profileData, 'data.data');
                 profileDataObj = setLoggedUserData(profileSpecifiedData);
@@ -2807,19 +3134,21 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                   window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
                 }
 
-                checkoutBody = collectCheckoutBody(values);
-                _context6.next = 42;
-                return postOnCheckout(checkoutBody, access_token_register);
+                checkoutBody = collectCheckoutBody(values, profileDataObj);
+                _context6.next = 44;
+                return postOnCheckout(checkoutBody);
 
-              case 42:
+              case 44:
                 res = _context6.sent;
+                removeReferralKey();
                 handleSubmit(values, formikHelpers, eventId, res);
-                _context6.next = 49;
+                _context6.next = 53;
                 break;
 
-              case 46:
-                _context6.prev = 46;
+              case 49:
+                _context6.prev = 49;
                 _context6.t1 = _context6["catch"](0);
+                setLoading(false);
 
                 if (axios.isAxiosError(_context6.t1)) {
                   if (((_e$response2 = _context6.t1.response) == null ? void 0 : _e$response2.data.error) === 'invalid_token') {
@@ -2831,23 +3160,24 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                     }
                   }
 
-                  if ((_e$response3 = _context6.t1.response) != null && _e$response3.data.message) {
-                    if (typeof document !== undefined) {
-                      document.body.scrollTop = document.documentElement.scrollTop = 0;
-                    }
-
+                  if ((_e$response3 = _context6.t1.response) != null && _e$response3.data.message && !hideErrorsAlertSection) {
                     setError(_get(_context6.t1, 'response.data.message'));
                   }
 
                   onSubmitError(_context6.t1);
                 }
 
-              case 49:
+              case 53:
+                _context6.prev = 53;
+                setLoading(false);
+                return _context6.finish(53);
+
+              case 56:
               case "end":
                 return _context6.stop();
             }
           }
-        }, _callee6, null, [[0, 46], [18, 29]]);
+        }, _callee6, null, [[0, 49, 53, 56], [18, 30]]);
       }));
 
       function onSubmit(_x2, _x3) {
@@ -2866,17 +3196,24 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       setValues: props.setValues,
       setUserValues: setUserValues,
       onGetStatesSuccess: onGetStatesSuccess,
-      onGetStatesError: onGetStatesError
+      onGetStatesError: onGetStatesError,
+      shouldFetchCountries: shouldFetchCountries
     }), React__default.createElement("div", {
       className: "billing-info-container " + theme
-    }, error && !hideErrorsAlertSection && React__default.createElement(material.Alert, {
-      severity: "error",
-      onClose: onErrorClose,
-      variant: "filled"
-    }, error), !isLoggedIn && React__default.createElement("div", {
+    }, React__default.createElement(SnackbarAlert, {
+      type: "error",
+      isOpen: !!error,
+      message: error || '',
+      onClose: function onClose() {
+        setError(null);
+        onErrorClose();
+      }
+    }), !isLoggedIn && React__default.createElement("div", {
       className: "account-actions-block"
-    }, React__default.createElement("div", null, accountInfoTitle), React__default.createElement("div", null, "Login & skip ahead:"), React__default.createElement("div", {
-      className: "login-block"
+    }, React__default.createElement("div", {
+      className: "action-item"
+    }, React__default.createElement("div", null, accountInfoTitle), React__default.createElement("div", null, "Login & skip ahead:")), React__default.createElement("div", {
+      className: "action-item login-block"
     }, React__default.createElement("button", {
       className: "login-register-button",
       type: "button",
@@ -2934,7 +3271,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
             validate: getValidateFunctions(element, states, props.values),
             setFieldValue: props.setFieldValue,
             onBlur: props.handleBlur,
-            component: element.type === 'checkbox' ? CheckboxField : element.type === 'select' ? SelectField : element.type === 'phone' ? FormikPhoneNumberField : CustomField,
+            component: element.type === 'checkbox' ? CheckboxField : element.type === 'select' ? SelectField : element.type === 'phone' ? FormikPhoneNumberField : element.type === 'date' ? DatePickerField : CustomField,
             selectOptions: element.name === 'country' ? countries : element.name === 'state' ? states : [],
             theme: theme
           })));
@@ -2942,7 +3279,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       }));
     }), !_isEmpty(ticketHoldersFields.fields) && React__default.createElement("div", {
       className: "ticket-holders-fields"
-    }, React__default.createElement("p", null, ticketHoldersFields.label), _map(ticketsQuantity, function (_item, index) {
+    }, React__default.createElement("h2", null, ticketHoldersFields.label), _map(ticketsQuantity, function (_item, index) {
       return React__default.createElement("div", {
         key: _item
       }, React__default.createElement("h5", null, "Ticket ", index + 1), _map(ticketHoldersFields.fields, function (group) {
@@ -3048,7 +3385,8 @@ var CheckoutForm = function CheckoutForm(_ref) {
       handleSetLoading = _ref$handleSetLoading === void 0 ? function () {} : _ref$handleSetLoading,
       _ref$conditions = _ref.conditions,
       conditions = _ref$conditions === void 0 ? [] : _ref$conditions,
-      disableZipSection = _ref.disableZipSection;
+      disableZipSection = _ref.disableZipSection,
+      paymentButtonText = _ref.paymentButtonText;
   var stripe = reactStripeJs.useStripe();
   var elements = reactStripeJs.useElements();
 
@@ -3076,7 +3414,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
-              handleSetLoading(true);
+              setStripeError(null);
               _context.prev = 1;
               event.preventDefault();
 
@@ -3136,17 +3474,18 @@ var CheckoutForm = function CheckoutForm(_ref) {
               return _context.abrupt("return");
 
             case 20:
-              _context.next = 22;
+              handleSetLoading(true);
+              _context.next = 23;
               return stripe.confirmCardPayment(stripe_client_secret, {
                 payment_method: paymentMethodReq.paymentMethod.id
               });
 
-            case 22:
+            case 23:
               _yield$stripe$confirm = _context.sent;
               _error = _yield$stripe$confirm.error;
 
               if (!_error) {
-                _context.next = 28;
+                _context.next = 29;
                 break;
               }
 
@@ -3154,22 +3493,22 @@ var CheckoutForm = function CheckoutForm(_ref) {
               handleSetLoading(false);
               return _context.abrupt("return");
 
-            case 28:
+            case 29:
               onSubmit(null);
-              _context.next = 34;
+              _context.next = 35;
               break;
 
-            case 31:
-              _context.prev = 31;
+            case 32:
+              _context.prev = 32;
               _context.t0 = _context["catch"](1);
               onSubmit(_context.t0);
 
-            case 34:
+            case 35:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[1, 31]]);
+      }, _callee, null, [[1, 32]]);
     }));
 
     return function handleSubmit(_x) {
@@ -3225,7 +3564,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
     onSubmit: handleSubmit
   }, React__default.createElement("div", {
     className: "card_form_inner"
-  }, React__default.createElement("label", {
+  }, React__default.createElement("div", {
     className: "card_number_element"
   }, React__default.createElement("span", {
     className: "card_label_text"
@@ -3235,19 +3574,21 @@ var CheckoutForm = function CheckoutForm(_ref) {
     onChange: _identity,
     onBlur: _identity,
     onFocus: _identity
-  })), React__default.createElement("label", {
+  })), React__default.createElement("div", {
+    className: "elements"
+  }, React__default.createElement("div", {
     className: "expiration_element"
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "Expiration date"), React__default.createElement(reactStripeJs.CardExpiryElement, {
     options: _extends({}, options, stripeCardOptions)
-  })), React__default.createElement("label", {
+  })), React__default.createElement("div", {
     className: "cvc_element"
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "CVC"), React__default.createElement(reactStripeJs.CardCvcElement, {
     options: _extends({}, options, stripeCardOptions)
-  })), !disableZipSection && React__default.createElement("label", {
+  }))), !disableZipSection && React__default.createElement("div", {
     className: "zip_element"
   }, React__default.createElement("p", {
     className: "card_label_text"
@@ -3276,64 +3617,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
     type: "submit"
   }, isLoading ? React__default.createElement(CircularProgress, {
     size: 26
-  }) : "Pay " + getCurrencySymbolByCurrency(currency) + total))));
-};
-
-var showZero = function showZero(value) {
-  if (value === void 0) {
-    value = 0;
-  }
-
-  var intNumber = Number(value);
-  return _isNumber(intNumber) ? intNumber >= 0 && intNumber < 10 ? '0' + intNumber : intNumber : null;
-};
-
-var TimerWidget = function TimerWidget(_ref) {
-  var expires_at = _ref.expires_at,
-      buyLoading = _ref.buyLoading,
-      _ref$onCountdownFinis = _ref.onCountdownFinish,
-      onCountdownFinish = _ref$onCountdownFinis === void 0 ? function () {} : _ref$onCountdownFinis;
-
-  var _useState = React.useState(true),
-      showTimer = _useState[0],
-      setShowTimer = _useState[1];
-
-  var handleCountdownFinish = function handleCountdownFinish() {
-    setShowTimer(false);
-
-    if (!buyLoading) {
-      onCountdownFinish();
-    }
-  };
-
-  var _renderer = function renderer(_ref2) {
-    var minutes = _ref2.minutes,
-        seconds = _ref2.seconds,
-        completed = _ref2.completed,
-        handleCountdownFinish = _ref2.handleCountdownFinish;
-
-    if (completed) {
-      handleCountdownFinish();
-      return null;
-    }
-
-    return React__default.createElement("span", null, showZero(minutes), ":", showZero(seconds));
-  };
-
-  return showTimer && !!expires_at ? React__default.createElement("div", {
-    className: "timer"
-  }, React__default.createElement("div", {
-    className: "toast-message"
-  }, React__default.createElement("p", null, "Please complete your purchase before the timer reaches zero."), React__default.createElement("p", {
-    className: "countdown"
-  }, React__default.createElement(Countdown$1, {
-    date: Date.now() + expires_at * 1000,
-    renderer: function renderer(props) {
-      return _renderer(_extends({}, props, {
-        handleCountdownFinish: handleCountdownFinish
-      }));
-    }
-  })))) : null;
+  }) : (paymentButtonText ? paymentButtonText : 'Pay') + " " + getCurrencySymbolByCurrency(currency) + total))));
 };
 
 var publishableKey = CONFIGS.STRIPE_PUBLISHABLE_KEY || '';
@@ -3394,7 +3678,10 @@ var PaymentContainer = function PaymentContainer(_ref) {
       _ref$onCountdownFinis = _ref.onCountdownFinish,
       onCountdownFinish = _ref$onCountdownFinis === void 0 ? function () {} : _ref$onCountdownFinis,
       _ref$enableTimer = _ref.enableTimer,
-      enableTimer = _ref$enableTimer === void 0 ? false : _ref$enableTimer;
+      enableTimer = _ref$enableTimer === void 0 ? false : _ref$enableTimer,
+      _ref$enablePaymentPla = _ref.enablePaymentPlan,
+      enablePaymentPlan = _ref$enablePaymentPla === void 0 ? false : _ref$enablePaymentPla,
+      paymentButtonText = _ref.paymentButtonText;
 
   var _useState = React.useState(initialReviewValues),
       reviewData = _useState[0],
@@ -3409,16 +3696,20 @@ var PaymentContainer = function PaymentContainer(_ref) {
       setError = _useState3[1];
 
   var _useState4 = React.useState(false),
-      paymentIsLoading = _useState4[0],
-      setPaymentIsLoading = _useState4[1];
+      showPaymentPlanSection = _useState4[0],
+      setShowPaymentPlanSection = _useState4[1];
+
+  var _useState5 = React.useState(false),
+      paymentIsLoading = _useState5[0],
+      setPaymentIsLoading = _useState5[1];
 
-  var _useState5 = React.useState(true),
-      paymentDataIsLoading = _useState5[0],
-      setPaymentDataIsLoading = _useState5[1];
+  var _useState6 = React.useState(true),
+      paymentDataIsLoading = _useState6[0],
+      setPaymentDataIsLoading = _useState6[1];
 
-  var _useState6 = React.useState([]),
-      conditions = _useState6[0],
-      setConditions = _useState6[1];
+  var _useState7 = React.useState([]),
+      conditions = _useState7[0],
+      setConditions = _useState7[1];
 
   var showFormTitle = Boolean(formTitle);
   var showErrorText = Boolean(errorText);
@@ -3536,37 +3827,36 @@ var PaymentContainer = function PaymentContainer(_ref) {
               _context3.prev = 0;
 
               if (!error) {
-                _context3.next = 4;
+                _context3.next = 3;
                 break;
               }
 
-              setPaymentIsLoading(false);
               throw error;
 
-            case 4:
+            case 3:
               order_hash = reviewData.order_details.order_hash;
 
-              if (!(total === "0.00")) {
-                _context3.next = 11;
+              if (!(total === '0.00')) {
+                _context3.next = 10;
                 break;
               }
 
-              _context3.next = 8;
+              _context3.next = 7;
               return handleFreeSuccess(order_hash);
 
-            case 8:
+            case 7:
               _context3.t0 = _context3.sent;
-              _context3.next = 14;
+              _context3.next = 13;
               break;
 
-            case 11:
-              _context3.next = 13;
+            case 10:
+              _context3.next = 12;
               return handlePaymentSuccess(order_hash);
 
-            case 13:
+            case 12:
               _context3.t0 = _context3.sent;
 
-            case 14:
+            case 13:
               paymentSuccessResponse = _context3.t0;
 
               if (paymentSuccessResponse.status === 200) {
@@ -3577,10 +3867,11 @@ var PaymentContainer = function PaymentContainer(_ref) {
               _context3.next = 22;
               break;
 
-            case 18:
-              _context3.prev = 18;
+            case 17:
+              _context3.prev = 17;
               _context3.t1 = _context3["catch"](0);
               setError(_get(_context3.t1, 'response.data.message'));
+              setPaymentIsLoading(false);
               onPaymentError(_context3.t1.response);
 
             case 22:
@@ -3588,7 +3879,7 @@ var PaymentContainer = function PaymentContainer(_ref) {
               return _context3.stop();
           }
         }
-      }, _callee3, null, [[0, 18]]);
+      }, _callee3, null, [[0, 17]]);
     }));
 
     return function handlePaymentMiddleWare(_x) {
@@ -3601,7 +3892,7 @@ var PaymentContainer = function PaymentContainer(_ref) {
     theme: themeMui
   }, React__default.createElement("div", {
     className: "payment_page"
-  }, !paymentIsLoading && !error && enableTimer && React__default.createElement(TimerWidget, {
+  }, enableTimer && React__default.createElement(TimerWidget$1, {
     expires_at: _get(reviewData, 'expires_at', 0),
     buyLoading: paymentIsLoading,
     onCountdownFinish: onCountdownFinish
@@ -3630,11 +3921,33 @@ var PaymentContainer = function PaymentContainer(_ref) {
     }, label), React__default.createElement("div", {
       className: className + " order_info_text"
     }, normalizer(orderData[id], orderData.currency)));
-  })), total !== "0.00" ? React__default.createElement("div", {
+  })), enablePaymentPlan && React__default.createElement("div", {
+    className: "payment_toggle"
+  }, React__default.createElement("label", {
+    htmlFor: "togBtn",
+    className: "switch"
+  }, React__default.createElement("input", {
+    type: "checkbox",
+    id: "togBtn",
+    disabled: true,
+    onChange: function onChange() {
+      return setShowPaymentPlanSection(!showPaymentPlanSection);
+    }
+  }), React__default.createElement("div", {
+    className: "slider round"
+  }), React__default.createElement("span", {
+    className: "tog_text"
+  }, "Click to checkout using Payment Plan"))), showPaymentPlanSection && React__default.createElement("div", {
+    className: "payment_plan"
+  }, React__default.createElement("h2", null, "PAYMENT PLAN"), React__default.createElement("div", {
+    className: "plan_block"
+  }, React__default.createElement("h3", null, "Mbrand Payment Plan Terms"), React__default.createElement("p", null, "By clicking on the \u201CConfirm Payment Plan\u201D button, you are starting your payment plan of 2 payments of $115.00, which will be drawn from your account every 2 weeks, with the first payment taken later today."), React__default.createElement("p", null, "This includes a non-refundable admin fee of $3.00 per payment."), React__default.createElement("p", {
+    className: "payment_note"
+  }, "NOTE: If today\u2019s payment fails, your payment plan will not activate, and your tickets will not be issued until you complete your final payment."), React__default.createElement("p", null, "If you do not complete your payements, your order will be canceled. Your first payment of $115.00, plus the non-refundable admin fee of $3.00 will not be refunded."), React__default.createElement("p", null, "Your payment will proceed with the card ending in **** 4242."))), total !== '0.00' ? React__default.createElement("div", {
     className: "payment_info"
   }, React__default.createElement("div", {
     className: "payment_info_label"
-  }, "Please provide your payment information"), showErrorText && React__default.createElement("p", {
+  }, "ORDER CONFIRMATION"), showErrorText && React__default.createElement("p", {
     className: "payment_info__error"
   }, errorText), React__default.createElement("div", null, React__default.createElement(reactStripeJs.Elements, {
     stripe: getStripePromise(reviewData),
@@ -3652,18 +3965,20 @@ var PaymentContainer = function PaymentContainer(_ref) {
     },
     conditions: conditions,
     stripeCardOptions: stripeCardOptions,
-    disableZipSection: disableZipSection
+    disableZipSection: disableZipSection,
+    paymentButtonText: paymentButtonText
   })))) : React__default.createElement("div", {
     className: "payment_button " + (paymentIsLoading ? 'disabled-payment-button' : '')
   }, React__default.createElement("button", {
     disabled: paymentIsLoading,
     type: "button",
     onClick: function onClick() {
+      setPaymentIsLoading(true);
       handlePaymentMiddleWare(null);
     }
   }, paymentIsLoading ? React__default.createElement(CircularProgress, {
     size: 26
-  }) : "Complete Registration")))));
+  }) : 'Complete Registration')))));
 };
 
 var config = {
@@ -3837,7 +4152,9 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
       onGetConfirmationDataSuccess = _ref$onGetConfirmatio === void 0 ? function () {} : _ref$onGetConfirmatio,
       _ref$onGetConfirmatio2 = _ref.onGetConfirmationDataError,
       onGetConfirmationDataError = _ref$onGetConfirmatio2 === void 0 ? function () {} : _ref$onGetConfirmatio2,
-      orderHash = _ref.orderHash;
+      orderHash = _ref.orderHash,
+      _ref$onLinkCopied = _ref.onLinkCopied,
+      onLinkCopied = _ref$onLinkCopied === void 0 ? function () {} : _ref$onLinkCopied;
   var inputRef = React.useRef(null);
 
   var _useState = React.useState(null),
@@ -3975,7 +4292,8 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
   }), React__default.createElement("div", {
     className: "share-by-link-copy-icon",
     onClick: function onClick() {
-      return navigator.clipboard.writeText(_get(inputRef, 'current.value'));
+      navigator.clipboard.writeText(_get(inputRef, 'current.value'));
+      onLinkCopied();
     }
   }, React__default.createElement("img", {
     src: "https://img.icons8.com/office/50/000000/copy.png",
@@ -4041,7 +4359,7 @@ var TicketRow = function TicketRow(_ref) {
   var isSalesClosed = !ticketTier.salesStarted || ticketTier.salesEnded;
   var options = getTicketSelectOptions(ticketTier.maxQuantity, ticketTier.minQuantity, ticketTier.multiplier);
   var ticketsClosedMessage = !ticketTier.salesStarted ? 'Sales not started' : 'Sales Ended';
-  var onSaleContent = isSalesClosed ? ticketsClosedMessage : React__default.createElement("div", {
+  var onSaleContent = React__default.createElement("div", {
     className: "get-tickets"
   }, React__default.createElement(Box, {
     className: "get-tickets__selectbox"
@@ -4071,17 +4389,17 @@ var TicketRow = function TicketRow(_ref) {
       value: option.value
     }, option.value);
   })))));
-  var returnValue = '';
+  var returnValue = ''; // ticketTier.soldOut === false --> means that ticket is in the stock
 
-  if (ticketTier.sold_out || !ticketTier.displayTicket || ticketTier.soldOut) {
-    returnValue = soldOutMessage;
-  }
+  var isSoldOut = ticketTier.sold_out || !ticketTier.displayTicket || ticketTier.soldOut || ticketTier.soldOut === false;
 
-  if (ticketTier.displayTicket) {
+  if (isSoldOut) {
+    returnValue = soldOutMessage;
+  } else if (isSalesClosed) {
+    returnValue = ticketsClosedMessage;
+  } else if (ticketTier.displayTicket && ticketTier.maxQuantity) {
     returnValue = onSaleContent;
-  }
-
-  if (_get(prevTicketTier, 'in_stock')) {
+  } else if (_get(prevTicketTier, 'in_stock')) {
     returnValue = 'SOON';
   }
 
@@ -4092,11 +4410,11 @@ var TicketsSection = function TicketsSection(_ref) {
   var ticketsList = _ref.ticketsList,
       selectedTickets = _ref.selectedTickets,
       handleTicketSelect = _ref.handleTicketSelect,
-      promoCodeIsApplied = _ref.promoCodeIsApplied;
-
-  var sortedTicketsList = _sortBy(ticketsList, 'sortOrder');
-
-  return React__default.createElement(React__default.Fragment, null, sortedTicketsList.map(function (ticket, i, arr) {
+      sortBySoldOut = _ref.sortBySoldOut,
+      ticketsHeaderComponent = _ref.ticketsHeaderComponent,
+      hideTicketsHeader = _ref.hideTicketsHeader;
+  var sortedTicketsList = sortBySoldOut ? _sortBy(_sortBy(ticketsList, 'sortOrder'), 'soldOut') : _sortBy(ticketsList, 'sortOrder');
+  return React__default.createElement(React__default.Fragment, null, !hideTicketsHeader && ticketsHeaderComponent, sortedTicketsList.map(function (ticket, i, arr) {
     var isSoldOut = ticket.sold_out || !ticket.displayTicket || ticket.soldOut;
 
     var ticketSelect = function ticketSelect(event) {
@@ -4106,12 +4424,12 @@ var TicketsSection = function TicketsSection(_ref) {
 
     var ticketIsDiscounted = false;
 
-    if (ticket.oldPrice && promoCodeIsApplied && !isSoldOut && ticket.oldPrice !== ticket.price) {
+    if (ticket.oldPrice && !isSoldOut && ticket.oldPrice !== ticket.price) {
       ticketIsDiscounted = true;
     }
 
-    var ticketIsFree = (+ticket.cost || +ticket.price) === 0;
-    var ticketPrice = isSoldOut ? 'SOLD OUT' : ticketIsFree ? 'FREE' : "$ " + (+ticket.cost || +ticket.price).toFixed(2);
+    var ticketIsFree = +ticket.price === 0;
+    var ticketPrice = isSoldOut ? 'SOLD OUT' : ticketIsFree ? 'FREE' : "$ " + (+ticket.price).toFixed(2);
     return React__default.createElement("div", {
       key: ticket.id || ticket.name,
       className: "event-detail__tier " + (isSoldOut ? 'disabled' : '')
@@ -4303,31 +4621,15 @@ var WaitingList = function WaitingList(_ref) {
   }) : 'ADD TO WAITING LIST')))));
 };
 
-var getImage = function getImage(name) {
-  if (name === void 0) {
-    name = '';
-  }
-
-  var image = '';
-
-  if (!name.trim().length) {
-    return image;
-  }
-
-  return image;
-};
-
 var PromoCodeSection = function PromoCodeSection(_ref) {
-  var promoCode = _ref.promoCode,
-      promoCodeIsApplied = _ref.promoCodeIsApplied,
+  var code = _ref.code,
+      codeIsApplied = _ref.codeIsApplied,
       showPromoInput = _ref.showPromoInput,
-      isPromotionsEnabled = _ref.isPromotionsEnabled,
-      setPromoCode = _ref.setPromoCode,
-      setPromoCodeUpdated = _ref.setPromoCodeUpdated,
+      setCode = _ref.setCode,
       setShowPromoInput = _ref.setShowPromoInput,
-      isAccessCodeEnabled = _ref.isAccessCodeEnabled,
-      isPromoLoading = _ref.isPromoLoading;
-  var isPromoCodeHasValue = !!promoCode.trim();
+      updateTickets = _ref.updateTickets,
+      setCodeIsApplied = _ref.setCodeIsApplied;
+  var isPromoCodeHasValue = !!code.trim();
 
   var renderInputField = function renderInputField() {
     return React__default.createElement("div", {
@@ -4336,30 +4638,30 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
       className: "promo-code-block"
     }, React__default.createElement("p", {
       className: "promo-code-text"
-    }, isAccessCodeEnabled ? 'Access code required' : 'Promo code')), React__default.createElement("input", {
+    }, "Promo code")), React__default.createElement("input", {
       className: "promo-code-input",
       placeholder: "",
       onChange: function onChange(e) {
-        setPromoCode(e.target.value);
+        setCode(e.target.value);
       },
       onKeyPress: function onKeyPress(event) {
         if (event.key === 'Enter' && isPromoCodeHasValue) {
-          setPromoCodeUpdated(promoCode);
           setShowPromoInput(false);
+          updateTickets(true, 'promo');
         }
       }
     }), React__default.createElement(Button$1, {
       className: "promo-submit-button",
       onClick: function onClick() {
         if (isPromoCodeHasValue) {
-          setPromoCodeUpdated(promoCode);
           setShowPromoInput(false);
+          updateTickets(true, 'promo');
         }
       }
-    }, isAccessCodeEnabled ? 'ENTER' : 'APPLY'));
+    }, "APPLY"));
   };
 
-  return isPromoLoading ? React__default.createElement(Loader, null) : React__default.createElement("div", null, promoCodeIsApplied ? React__default.createElement("div", {
+  return React__default.createElement("div", null, codeIsApplied ? React__default.createElement("div", {
     className: "alert-info"
   }, React__default.createElement(SVG, {
     src: getImage('done.svg'),
@@ -4368,13 +4670,46 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
     }
   }), React__default.createElement("p", {
     className: "promo-code-success"
-  }, "PROMO CODE APPLIED SUCCESSFULLY")) : null, showPromoInput && renderInputField(), isPromotionsEnabled && !showPromoInput && !isAccessCodeEnabled ? React__default.createElement(Button$1, {
+  }, "PROMO CODE APPLIED SUCCESSFULLY")) : null, !showPromoInput && React__default.createElement(Button$1, {
     className: "promo-code-button",
     placeholder: "Promo Codes",
     onClick: function onClick() {
+      setCodeIsApplied(false);
       setShowPromoInput(true);
     }
-  }, "Got a promo code? Click here") : !isPromotionsEnabled && !showPromoInput && isAccessCodeEnabled && !promoCodeIsApplied ? renderInputField() : null);
+  }, "Got a promo code? Click here"), showPromoInput && renderInputField());
+};
+
+var AccessCodeSection = function AccessCodeSection(_ref) {
+  var code = _ref.code,
+      setCode = _ref.setCode,
+      updateTickets = _ref.updateTickets;
+  var isAccessCodeHasValue = !!code.trim();
+  return React__default.createElement("div", {
+    className: "access-code-block"
+  }, React__default.createElement("div", {
+    className: "access-code-block"
+  }, React__default.createElement("p", {
+    className: "access-code-text"
+  }, "Access code required")), React__default.createElement("input", {
+    className: "access-code-input",
+    placeholder: "",
+    onChange: function onChange(e) {
+      setCode(e.target.value);
+    },
+    onKeyPress: function onKeyPress(event) {
+      if (event.key === 'Enter' && isAccessCodeHasValue) {
+        updateTickets(true);
+      }
+    }
+  }), React__default.createElement(Button$1, {
+    className: "access-submit-button",
+    onClick: function onClick() {
+      if (isAccessCodeHasValue) {
+        updateTickets(true);
+      }
+    }
+  }, "ENTER"));
 };
 
 var isTimeExpired = function isTimeExpired(startDate, timezone) {
@@ -4389,8 +4724,13 @@ function Countdown(_ref) {
       title = _ref$title === void 0 ? '' : _ref$title,
       _ref$message = _ref.message,
       message = _ref$message === void 0 ? '' : _ref$message,
+      _ref$showMessage = _ref.showMessage,
+      showMessage = _ref$showMessage === void 0 ? false : _ref$showMessage,
+      _ref$disableLeadingZe = _ref.disableLeadingZero,
+      disableLeadingZero = _ref$disableLeadingZe === void 0 ? false : _ref$disableLeadingZe,
       _ref$callback = _ref.callback,
-      callback = _ref$callback === void 0 ? function () {} : _ref$callback;
+      callback = _ref$callback === void 0 ? function () {} : _ref$callback,
+      isLoggedIn = _ref.isLoggedIn;
 
   var _useState = React.useState(''),
       duration = _useState[0],
@@ -4412,6 +4752,7 @@ function Countdown(_ref) {
           clearInterval(timer);
           setTimeExpired(true);
           callback();
+          return;
         }
 
         var currentDate = moment.tz(moment(), timezone).format('YYYY-MM-DD HH:mm:ss');
@@ -4429,7 +4770,11 @@ function Countdown(_ref) {
 
         for (var date in dateArr) {
           var unit = dateArr[date] === 1 ? date : date + 's';
-          var val = String(dateArr[date]).length === 1 ? '0' + dateArr[date] : dateArr[date];
+          var val = dateArr[date];
+
+          if (!disableLeadingZero && String(dateArr[date]).length === 1) {
+            val = '0' + dateArr[date];
+          }
 
           if (timeLeft) {
             timeLeft += ", " + val + " " + unit;
@@ -4447,10 +4792,10 @@ function Countdown(_ref) {
     };
   }, [timeExpired]);
   return React__default.createElement(React__default.Fragment, null, !timeExpired && duration && React__default.createElement("div", {
-    className: 'countdown'
+    className: "countdown " + (!isLoggedIn ? 'countdown-on-bottom' : '')
   }, React__default.createElement("div", null, React__default.createElement("p", {
     className: 'title'
-  }, title), React__default.createElement("p", null, duration)), React__default.createElement("p", {
+  }, title), React__default.createElement("p", null, duration)), showMessage && React__default.createElement("p", {
     className: 'message'
   }, message)));
 }
@@ -4462,7 +4807,8 @@ var ReferralLogic = function ReferralLogic(props) {
     if (isWindowDefined) {
       var params = new URL("" + window.location).searchParams;
       var referralId = params.get('ttf_r') || '';
-      var isAlreadyCounted = !!localStorage.getItem('referral_key');
+      var referralValue = [eventId, '.', referralId].join('');
+      var isAlreadyCounted = localStorage.getItem('referral_key') === referralValue;
 
       if (referralId && eventId && !isAlreadyCounted) {
         _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
@@ -4475,7 +4821,7 @@ var ReferralLogic = function ReferralLogic(props) {
                   return postReferralVisits("" + eventId, referralId);
 
                 case 3:
-                  localStorage.setItem('referral_key', [eventId, '.', referralId].join(''));
+                  localStorage.setItem('referral_key', referralValue);
                   _context.next = 8;
                   break;
 
@@ -4509,6 +4855,10 @@ var TicketsContainer = function TicketsContainer(_ref) {
       onGetTicketsSuccess = _ref$onGetTicketsSucc === void 0 ? function () {} : _ref$onGetTicketsSucc,
       _ref$onGetTicketsErro = _ref.onGetTicketsError,
       onGetTicketsError = _ref$onGetTicketsErro === void 0 ? function () {} : _ref$onGetTicketsErro,
+      _ref$onLogoutSuccess = _ref.onLogoutSuccess,
+      onLogoutSuccess = _ref$onLogoutSuccess === void 0 ? function () {} : _ref$onLogoutSuccess,
+      _ref$onLogoutError = _ref.onLogoutError,
+      onLogoutError = _ref$onLogoutError === void 0 ? function () {} : _ref$onLogoutError,
       _ref$theme = _ref.theme,
       theme = _ref$theme === void 0 ? 'light' : _ref$theme,
       _ref$queryPromoCode = _ref.queryPromoCode,
@@ -4521,62 +4871,82 @@ var TicketsContainer = function TicketsContainer(_ref) {
       _ref$hideSessionButto = _ref.hideSessionButtons,
       hideSessionButtons = _ref$hideSessionButto === void 0 ? false : _ref$hideSessionButto,
       _ref$hideWaitingList = _ref.hideWaitingList,
-      hideWaitingList = _ref$hideWaitingList === void 0 ? false : _ref$hideWaitingList;
+      hideWaitingList = _ref$hideWaitingList === void 0 ? false : _ref$hideWaitingList,
+      _ref$enableBillingInf = _ref.enableBillingInfoAutoCreate,
+      enableBillingInfoAutoCreate = _ref$enableBillingInf === void 0 ? true : _ref$enableBillingInf,
+      _ref$isButtonScrollab = _ref.isButtonScrollable,
+      isButtonScrollable = _ref$isButtonScrollab === void 0 ? false : _ref$isButtonScrollab,
+      _ref$sortBySoldOut = _ref.sortBySoldOut,
+      sortBySoldOut = _ref$sortBySoldOut === void 0 ? false : _ref$sortBySoldOut,
+      _ref$disableCountdown = _ref.disableCountdownLeadingZero,
+      disableCountdownLeadingZero = _ref$disableCountdown === void 0 ? false : _ref$disableCountdown,
+      _ref$isLoggedIn = _ref.isLoggedIn,
+      isLoggedIn = _ref$isLoggedIn === void 0 ? false : _ref$isLoggedIn,
+      ActionsSectionComponent = _ref.actionsSectionComponent,
+      ticketsHeaderComponent = _ref.ticketsHeaderComponent,
+      _ref$hideTicketsHeade = _ref.hideTicketsHeader,
+      hideTicketsHeader = _ref$hideTicketsHeade === void 0 ? false : _ref$hideTicketsHeade;
 
   var _useState = React.useState({}),
       selectedTickets = _useState[0],
       setSelectedTickets = _useState[1];
 
   var isWindowDefined = typeof window !== 'undefined';
+  var xtfCookie = getCookieByName('X-TF-ECOMMERCE');
 
-  var _useState2 = React.useState(isWindowDefined ? !!window.localStorage.getItem('access_token') : false),
+  var _useState2 = React.useState((isWindowDefined ? !!window.localStorage.getItem('access_token') : false) || !!xtfCookie),
       isLogged = _useState2[0],
       setIsLogged = _useState2[1];
 
-  var _React$useState = React__default.useState(false),
-      showLoginModal = _React$useState[0],
-      setShowLoginModal = _React$useState[1];
-
-  var _useState3 = React.useState([]),
-      tickets = _useState3[0],
-      setTickets = _useState3[1];
+  var _useState3 = React.useState(false),
+      showLoginModal = _useState3[0],
+      setShowLoginModal = _useState3[1];
 
-  var _useState4 = React.useState(null),
-      event = _useState4[0],
-      setEvent = _useState4[1];
+  var _useState4 = React.useState([]),
+      tickets = _useState4[0],
+      setTickets = _useState4[1];
 
-  var _useState5 = React.useState(false),
-      showWaitingList = _useState5[0],
-      setShowWaitingList = _useState5[1];
+  var _useState5 = React.useState(null),
+      event = _useState5[0],
+      setEvent = _useState5[1];
 
   var _useState6 = React.useState(false),
-      isLoading = _useState6[0],
-      setIsLoading = _useState6[1];
+      showWaitingList = _useState6[0],
+      setShowWaitingList = _useState6[1];
 
-  var _useState7 = React.useState(false),
-      isPromoLoading = _useState7[0],
-      setIsPromoLoading = _useState7[1];
+  var _useState7 = React.useState(true),
+      isLoading = _useState7[0],
+      setIsLoading = _useState7[1];
 
   var _useState8 = React.useState(false),
-      handleBookIsLoading = _useState8[0],
-      setHandleBookIsLoading = _useState8[1];
+      codeIsLoading = _useState8[0],
+      setCodeIsLoading = _useState8[1];
 
-  var _useState9 = React.useState(''),
-      promoCode = _useState9[0],
-      setPromoCode = _useState9[1];
+  var _useState9 = React.useState(false),
+      handleBookIsLoading = _useState9[0],
+      setHandleBookIsLoading = _useState9[1];
 
   var _useState10 = React.useState(getQueryVariable('r') || queryPromoCode),
-      promoCodeUpdated = _useState10[0],
-      setPromoCodeUpdated = _useState10[1];
+      code = _useState10[0],
+      setCode = _useState10[1];
 
   var _useState11 = React.useState(false),
       showPromoInput = _useState11[0],
       setShowPromoInput = _useState11[1];
 
   var _useState12 = React.useState(false),
-      promoCodeIsApplied = _useState12[0],
-      setPromoCodeIsApplied = _useState12[1];
+      codeIsApplied = _useState12[0],
+      setCodeIsApplied = _useState12[1];
 
+  var _useState13 = React.useState(isAccessCodeEnabled),
+      showAccessCodeSection = _useState13[0],
+      setShowAccessCodeSection = _useState13[1];
+
+  var _useState14 = React.useState(isPromotionsEnabled),
+      showPromoCodeSection = _useState14[0],
+      setShowPromoCodeSection = _useState14[1];
+
+  var ticketsContainerRef = React.useRef(null);
   React.useEffect(function () {
     if (typeof window !== 'undefined') {
       var access_token = window.localStorage.getItem('access_token');
@@ -4592,20 +4962,66 @@ var TicketsContainer = function TicketsContainer(_ref) {
     }
   }, []);
   React.useEffect(function () {
-    !!eventId && getTicketsApi(!!promoCodeUpdated);
-  }, [eventId, promoCodeUpdated]);
+    !!eventId && getTicketsApi();
+  }, [eventId]);
 
-  var handleLogout = function handleLogout() {
-    if (isWindowDefined) {
-      window.localStorage.removeItem('access_token');
-      window.localStorage.removeItem('user_data');
-      setIsLogged(false);
+  var handleLogout = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
+      var _event;
+
+      return runtime_1.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              _context.next = 3;
+              return logout();
 
-      var _event = new window.CustomEvent('tf-logout');
+            case 3:
+              onLogoutSuccess();
+
+              if (isWindowDefined) {
+                window.localStorage.removeItem('access_token');
+                window.localStorage.removeItem('user_data');
+                setIsLogged(false);
+                _event = new window.CustomEvent('tf-logout');
+                deleteCookieByName('X-TF-ECOMMERCE');
+                window.document.dispatchEvent(_event);
+              }
 
-      window.document.dispatchEvent(_event);
-    }
-  };
+              _context.next = 10;
+              break;
+
+            case 7:
+              _context.prev = 7;
+              _context.t0 = _context["catch"](0);
+              onLogoutError(_context.t0);
+
+            case 10:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[0, 7]]);
+    }));
+
+    return function handleLogout() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  React.useEffect(function () {
+    try {
+      if (typeof window !== 'undefined') {
+        var userData = window.localStorage.getItem('user_data') ? JSON.parse(window.localStorage.getItem('user_data') || '{}') : {};
+
+        if (userData.country === '') {
+          handleLogout();
+          window.open('https://www.ticketfairy.com/account/change_information?need_country=true');
+        }
+      }
+    } catch (e) {}
+  }, []);
 
   var handleExternalLogin = function handleExternalLogin() {
     setIsLogged(true);
@@ -4624,40 +5040,40 @@ var TicketsContainer = function TicketsContainer(_ref) {
     }
   };
 
-  function getTicketsApi(_x) {
+  function getTicketsApi(_x, _x2) {
     return _getTicketsApi.apply(this, arguments);
   }
 
   function _getTicketsApi() {
-    _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2(isUpdateingPromoCode) {
+    _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3(isUpdateingCode, type) {
       var response, eventResponse, attributes, _event2;
 
-      return runtime_1.wrap(function _callee2$(_context2) {
+      return runtime_1.wrap(function _callee3$(_context3) {
         while (1) {
-          switch (_context2.prev = _context2.next) {
+          switch (_context3.prev = _context3.next) {
             case 0:
-              _context2.prev = 0;
-              !isUpdateingPromoCode && setIsLoading(true);
-              setIsPromoLoading(true);
-              _context2.next = 5;
-              return getTickets(eventId, promoCodeUpdated);
+              _context3.prev = 0;
+              isUpdateingCode ? setCodeIsLoading(true) : setIsLoading(true);
+              _context3.next = 4;
+              return getTickets(eventId, code);
 
-            case 5:
-              response = _context2.sent;
-              _context2.next = 8;
+            case 4:
+              response = _context3.sent;
+              _context3.next = 7;
               return getEvent(eventId);
 
-            case 8:
-              eventResponse = _context2.sent;
+            case 7:
+              eventResponse = _context3.sent;
 
               if (response.data.success) {
-                setCustomHeader(response);
                 attributes = _get(response, 'data.data.attributes');
-                setPromoCodeIsApplied(attributes.ValidPromoCode);
+                type === 'promo' && setCodeIsApplied(attributes.ValidPromoCode);
                 setTickets(_get(attributes, 'tickets'));
                 setShowWaitingList(attributes.showWaitingList);
                 onGetTicketsSuccess(response.data);
-                setPromoCode('');
+                setCode('');
+                setShowAccessCodeSection(attributes.is_access_code);
+                setShowPromoCodeSection(attributes.isPromotionsEnabled);
               }
 
               if (eventResponse.data.success) {
@@ -4665,42 +5081,42 @@ var TicketsContainer = function TicketsContainer(_ref) {
                 setEvent(_event2);
               }
 
-              _context2.next = 16;
+              _context3.next = 15;
               break;
 
-            case 13:
-              _context2.prev = 13;
-              _context2.t0 = _context2["catch"](0);
+            case 12:
+              _context3.prev = 12;
+              _context3.t0 = _context3["catch"](0);
 
-              if (axios.isAxiosError(_context2.t0)) {
-                onGetTicketsError(_context2.t0);
+              if (axios.isAxiosError(_context3.t0)) {
+                onGetTicketsError(_context3.t0);
               }
 
-            case 16:
-              _context2.prev = 16;
+            case 15:
+              _context3.prev = 15;
               setIsLoading(false);
-              setIsPromoLoading(false);
-              return _context2.finish(16);
+              setCodeIsLoading(false);
+              return _context3.finish(15);
 
-            case 20:
+            case 19:
             case "end":
-              return _context2.stop();
+              return _context3.stop();
           }
         }
-      }, _callee2, null, [[0, 13, 16, 20]]);
+      }, _callee3, null, [[0, 12, 15, 19]]);
     }));
     return _getTicketsApi.apply(this, arguments);
   }
 
   var handleTicketSelect = function handleTicketSelect(key, value) {
     setSelectedTickets(function (prevState) {
-      var _ref2;
+      var _ref3;
 
       if (Object.keys(prevState)[0] !== key && !value) {
         return prevState;
       }
 
-      return _ref2 = {}, _ref2[key] = value, _ref2;
+      return _ref3 = {}, _ref3[key] = value, _ref3;
     });
   };
 
@@ -4711,14 +5127,14 @@ var TicketsContainer = function TicketsContainer(_ref) {
   };
 
   var handleBook = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
       var _product_options, _product_options2, _ticket_types;
 
-      var ticket, optionName, ticketId, ticketQuantity, data, result, _result$data$data$att, _result$data, _result$data$data, _result$data$data$att2, _result$data$data$att3, _result$data2, _result$data2$data, _result$data2$data$at, _result$data$data$att4, _result$data3, _result$data3$data, _result$data3$data$at, _result$data$data$att5, _result$data4, _result$data4$data, _result$data4$data$at, skipBillingPage, nameIsRequired, ageIsRequired, phoneIsRequired, hash, _isWindowDefined, userData, access_token, checkoutBody, checkoutResult;
+      var ticket, optionName, ticketId, ticketQuantity, data, result, _result$data$data$att, _result$data, _result$data$data, _result$data$data$att2, _result$data$data$att3, _result$data2, _result$data2$data, _result$data2$data$at, _result$data$data$att4, _result$data3, _result$data3$data, _result$data3$data$at, _result$data$data$att5, _result$data4, _result$data4$data, _result$data4$data$at, skipBillingPage, nameIsRequired, ageIsRequired, phoneIsRequired, hash, total, _isWindowDefined, userData, access_token, checkoutBody, checkoutResult;
 
-      return runtime_1.wrap(function _callee$(_context) {
+      return runtime_1.wrap(function _callee2$(_context2) {
         while (1) {
-          switch (_context.prev = _context.next) {
+          switch (_context2.prev = _context2.next) {
             case 0:
               setHandleBookIsLoading(true);
               ticket = _find(tickets, function (item) {
@@ -4739,27 +5155,27 @@ var TicketsContainer = function TicketsContainer(_ref) {
                   }, _ticket_types)
                 }
               };
-              _context.prev = 6;
-              _context.next = 9;
+              _context2.prev = 6;
+              _context2.next = 9;
               return addToCart(eventId, data);
 
             case 9:
-              result = _context.sent;
+              result = _context2.sent;
 
               if (!(result.status === 200)) {
-                _context.next = 27;
+                _context2.next = 33;
                 break;
               }
 
-              setCustomHeader(result);
               skipBillingPage = (_result$data$data$att = result == null ? void 0 : (_result$data = result.data) == null ? void 0 : (_result$data$data = _result$data.data) == null ? void 0 : (_result$data$data$att2 = _result$data$data.attributes) == null ? void 0 : _result$data$data$att2.skip_billing_page) != null ? _result$data$data$att : false;
               nameIsRequired = (_result$data$data$att3 = result == null ? void 0 : (_result$data2 = result.data) == null ? void 0 : (_result$data2$data = _result$data2.data) == null ? void 0 : (_result$data2$data$at = _result$data2$data.attributes) == null ? void 0 : _result$data2$data$at.names_required) != null ? _result$data$data$att3 : false;
               ageIsRequired = (_result$data$data$att4 = result == null ? void 0 : (_result$data3 = result.data) == null ? void 0 : (_result$data3$data = _result$data3.data) == null ? void 0 : (_result$data3$data$at = _result$data3$data.attributes) == null ? void 0 : _result$data3$data$at.age_required) != null ? _result$data$data$att4 : false;
               phoneIsRequired = (_result$data$data$att5 = result == null ? void 0 : (_result$data4 = result.data) == null ? void 0 : (_result$data4$data = _result$data4.data) == null ? void 0 : (_result$data4$data$at = _result$data4$data.attributes) == null ? void 0 : _result$data4$data$at.phone_required) != null ? _result$data$data$att5 : false;
               hash = '';
+              total = '';
 
               if (!skipBillingPage) {
-                _context.next = 26;
+                _context2.next = 32;
                 break;
               }
 
@@ -4768,65 +5184,79 @@ var TicketsContainer = function TicketsContainer(_ref) {
               userData = _isWindowDefined && window.localStorage.getItem('user_data') ? JSON.parse(window.localStorage.getItem('user_data') || '') : {};
               access_token = _isWindowDefined && window.localStorage.getItem('access_token') ? window.localStorage.getItem('access_token') || '' : '';
               checkoutBody = createCheckoutDataBodyWithDefaultHolder(ticketQuantity, userData);
-              _context.next = 24;
+
+              if (!enableBillingInfoAutoCreate) {
+                _context2.next = 28;
+                break;
+              }
+
+              _context2.next = 25;
               return postOnCheckout(checkoutBody, access_token);
 
-            case 24:
-              checkoutResult = _context.sent;
+            case 25:
+              _context2.t0 = _context2.sent;
+              _context2.next = 29;
+              break;
+
+            case 28:
+              _context2.t0 = null;
+
+            case 29:
+              checkoutResult = _context2.t0;
               hash = _get(checkoutResult, 'data.data.attributes.hash');
+              total = _get(checkoutResult, 'data.data.attributes.total');
 
-            case 26:
+            case 32:
               onAddToCartSuccess({
                 skip_billing_page: skipBillingPage,
                 names_required: nameIsRequired,
                 phone_required: phoneIsRequired,
                 age_required: ageIsRequired,
                 event_id: String(eventId),
-                hash: hash
+                hash: hash,
+                total: total
               });
 
-            case 27:
-              _context.next = 32;
+            case 33:
+              _context2.next = 38;
               break;
 
-            case 29:
-              _context.prev = 29;
-              _context.t0 = _context["catch"](6);
+            case 35:
+              _context2.prev = 35;
+              _context2.t1 = _context2["catch"](6);
 
-              if (axios.isAxiosError(_context.t0)) {
-                onAddToCartError(_context.t0);
+              if (axios.isAxiosError(_context2.t1)) {
+                onAddToCartError(_context2.t1);
               }
 
-            case 32:
-              _context.prev = 32;
+            case 38:
+              _context2.prev = 38;
               setHandleBookIsLoading(false);
-              return _context.finish(32);
+              return _context2.finish(38);
 
-            case 35:
+            case 41:
             case "end":
-              return _context.stop();
+              return _context2.stop();
           }
         }
-      }, _callee, null, [[6, 29, 32, 35]]);
+      }, _callee2, null, [[6, 35, 38, 41]]);
     }));
 
     return function handleBook() {
-      return _ref3.apply(this, arguments);
+      return _ref4.apply(this, arguments);
     };
   }();
 
-  var updateTickets = function updateTickets() {
-    getTicketsApi();
+  var updateTickets = function updateTickets(isUpdateingCode, type) {
+    getTicketsApi(isUpdateingCode, type);
   };
 
-  var isAllTicketsSoldOut = _every(tickets, function (item) {
-    return item.sold_out || item.soldOut;
-  });
-
   var isTicketOnSale = _some(tickets, function (item) {
     return item.salesStarted && !item.salesEnded && !item.soldOut;
   });
 
+  var eventHasTickets = !_isEmpty(tickets);
+  var isSalesClosed = event == null ? void 0 : event.salesEnded;
   var themeMui = material.createTheme(themeOptions);
   React.useEffect(function () {
     isWindowDefined && window.document.addEventListener('custom-logout', handleLogout);
@@ -4840,44 +5270,74 @@ var TicketsContainer = function TicketsContainer(_ref) {
       isWindowDefined && window.document.removeEventListener('custom-login', handleExternalLogin);
     };
   }, []);
+
+  var handleGetTicketClick = function handleGetTicketClick() {
+    if (!handleBookIsLoading && !_isEmpty(selectedTickets) && Object.values(selectedTickets)[0] > 0) {
+      handleBook();
+    } else {
+      if (isButtonScrollable && ticketsContainerRef && ticketsContainerRef.current) {
+        ticketsContainerRef.current.scrollIntoView({
+          behavior: 'smooth',
+          block: 'center',
+          inline: 'nearest'
+        });
+      }
+    }
+  };
+
+  var bookButtonIsDisabled = handleBookIsLoading || _isEmpty(selectedTickets) || Object.values(selectedTickets)[0] === 0;
+  var wrappedActionsSectionComponent = React__default.isValidElement(ActionsSectionComponent) ? React__default.cloneElement(ActionsSectionComponent, {
+    handleGetTicketClick: handleGetTicketClick,
+    isTicketOnSale: isTicketOnSale
+  }) : null;
+  var externalUrl = event == null ? void 0 : event.redirectUrl;
+  var eventSaleIsNotStarted = !(event != null && event.salesStarted) && (event == null ? void 0 : event.salesStart);
   return React__default.createElement(privateTheming.ThemeProvider, {
     theme: themeMui
-  }, React__default.createElement(ReferralLogic, {
+  }, !isLoading && React__default.createElement(ReferralLogic, {
     eventId: eventId
   }), React__default.createElement("div", {
     className: "get-tickets-page " + theme,
     style: contentStyle
-  }, isLoading ? React__default.createElement(Loader, null) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
+  }, isLoading ? React__default.createElement(Loader, null) : React__default.createElement("div", {
+    ref: ticketsContainerRef
+  }, !isSalesClosed && React__default.createElement(TicketsSection, {
     ticketsList: tickets,
     selectedTickets: selectedTickets,
     handleTicketSelect: handleTicketSelect,
-    promoCodeIsApplied: promoCodeIsApplied
-  }), event != null && event.salesEnded ? React__default.createElement("p", {
-    className: 'event-closed-message'
-  }, "Sales for this event are closed.") : !(event != null && event.salesStarted) && event != null && event.salesStart ? React__default.createElement(Countdown, {
+    sortBySoldOut: sortBySoldOut,
+    ticketsHeaderComponent: ticketsHeaderComponent,
+    hideTicketsHeader: hideTicketsHeader || _isEmpty(tickets)
+  }), externalUrl ? null : isSalesClosed ? React__default.createElement("p", {
+    className: "event-closed-message " + (!isLoggedIn ? 'event-closed-on-bottom' : '')
+  }, "Sales for this event are closed.") : eventSaleIsNotStarted ? React__default.createElement(Countdown, {
     startDate: event.salesStart,
     timezone: event.timezone,
     title: "Sales start in:",
     message: "No tickets are currently available for this event.",
-    callback: updateTickets
+    showMessage: !eventHasTickets,
+    callback: updateTickets,
+    disableLeadingZero: disableCountdownLeadingZero,
+    isLoggedIn: isLoggedIn
   }) : null, showWaitingList && event.salesStarted && !hideWaitingList && React__default.createElement(WaitingList, {
     tickets: tickets,
     eventId: eventId
-  }), React__default.createElement(PromoCodeSection, {
-    promoCode: promoCode,
-    promoCodeIsApplied: promoCodeIsApplied,
+  }), codeIsLoading ? React__default.createElement(Loader, null) : isSalesClosed ? null : showAccessCodeSection ? React__default.createElement(AccessCodeSection, {
+    code: code,
+    setCode: setCode,
+    updateTickets: updateTickets
+  }) : showPromoCodeSection ? React__default.createElement(PromoCodeSection, {
+    code: code,
+    codeIsApplied: codeIsApplied,
+    setCodeIsApplied: setCodeIsApplied,
     showPromoInput: showPromoInput,
-    setPromoCode: setPromoCode,
-    setPromoCodeUpdated: setPromoCodeUpdated,
     setShowPromoInput: setShowPromoInput,
-    isPromotionsEnabled: isPromotionsEnabled,
-    isAccessCodeEnabled: isAccessCodeEnabled,
-    isAllTicketsSoldOut: isAllTicketsSoldOut,
-    isPromoLoading: isPromoLoading
-  }), (isTicketOnSale || !(event != null && event.salesEnded)) && React__default.createElement(Button$1, {
+    setCode: setCode,
+    updateTickets: updateTickets
+  }) : null, wrappedActionsSectionComponent, !wrappedActionsSectionComponent && !eventSaleIsNotStarted && isTicketOnSale && !(event != null && event.salesEnded) && !externalUrl && React__default.createElement(Button$1, {
     "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 () {}
+    className: "book-button \n                  " + (bookButtonIsDisabled ? 'disabled' : '') + "  \n                  " + (isButtonScrollable ? 'is-scrollable' : '') + "\n                  " + (!isLoggedIn ? 'on-bottom' : '') + "\n                ",
+    onClick: handleGetTicketClick
   }, getTicketsLabel || 'GET TICKETS'), isLogged && !hideSessionButtons ? React__default.createElement("div", {
     className: "session-wrapper"
   }, React__default.createElement("span", {
@@ -4915,10 +5375,7 @@ var tableConfig = function tableConfig(key) {
   switch (key) {
     default:
       config = {
-        header: ['Order No.', 'Date', 'Event', 'Total'],
         body: [function (row) {
-          return row.id;
-        }, function (row) {
           return row.date;
         }, function (row) {
           return React__default.createElement(EventInfoItem, {
@@ -4987,16 +5444,30 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
 
   var _useState4 = React.useState(''),
       filter = _useState4[0],
-      setFilter = _useState4[1]; //just once
+      setFilter = _useState4[1];
+
+  var isWindowDefined = typeof window !== 'undefined';
+
+  var _useState5 = React.useState(isWindowDefined ? !!window.localStorage.getItem('access_token') : false),
+      isLogged = _useState5[0],
+      setIsLogged = _useState5[1];
+
+  var _useState6 = React.useState(false),
+      showModalLogin = _useState6[0],
+      setShowModalLogin = _useState6[1];
+
+  var _useState7 = React.useState(false),
+      userExpired = _useState7[0],
+      setUserExpired = _useState7[1]; //just once
 
 
   React.useEffect(function () {
     fetchData(1, limit, filter);
-  }, []);
+  }, [isLogged]);
 
   var fetchData = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(page, limit, filter) {
-      var response, _data;
+      var response, _data, _error$response;
 
       return runtime_1.wrap(function _callee$(_context) {
         while (1) {
@@ -5013,25 +5484,37 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
               _data = _get(response, 'data.data.attributes');
               _data.page -= 1;
               setData(_data);
-              _context.next = 14;
+              _context.next = 15;
               break;
 
             case 11:
               _context.prev = 11;
               _context.t0 = _context["catch"](0);
+
+              if (axios.isAxiosError(_context.t0)) {
+                if (((_error$response = _context.t0.response) == null ? void 0 : _error$response.data.error) === 'invalid_token') {
+                  if (isWindowDefined) {
+                    window.localStorage.removeItem('user_data');
+                    window.localStorage.removeItem('access_token');
+                    setUserExpired(true);
+                    setShowModalLogin(true);
+                  }
+                }
+              }
+
               onGetOrdersError(_context.t0);
 
-            case 14:
-              _context.prev = 14;
+            case 15:
+              _context.prev = 15;
               setLoading(false);
-              return _context.finish(14);
+              return _context.finish(15);
 
-            case 17:
+            case 18:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[0, 11, 14, 17]]);
+      }, _callee, null, [[0, 11, 15, 18]]);
     }));
 
     return function fetchData(_x, _x2, _x3) {
@@ -5057,7 +5540,24 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
     className: "my-ticket " + theme
   }, loading && React__default.createElement("div", {
     className: "loading"
-  }, React__default.createElement(CircularProgress, null)), data && React__default.createElement(React__default.Fragment, null, React__default.createElement(Autocomplete, {
+  }, React__default.createElement(CircularProgress, null)), !isLogged ? React__default.createElement("div", {
+    className: "account-actions-block"
+  }, React__default.createElement("div", {
+    className: "login-block"
+  }, React__default.createElement("button", {
+    className: "login-register-button",
+    type: "button",
+    onClick: function onClick() {
+      setShowModalLogin(true);
+    }
+  }, "Login"), React__default.createElement("div", {
+    className: "logo-image-container"
+  }, React__default.createElement("img", {
+    src: theme === 'dark' ? 'https://www.ticketfairy.com/resources/images/logo-ttf.svg' : 'https://www.ticketfairy.com/resources/images/logo-ttf-black.svg',
+    alt: "nodata"
+  })))) : null, data && React__default.createElement(React__default.Fragment, null, React__default.createElement("h2", null, "My Ticket Orders"), React__default.createElement("div", {
+    className: "order_event"
+  }, React__default.createElement(Autocomplete, {
     disablePortal: true,
     id: "combo-box-demo",
     getOptionLabel: function getOptionLabel(option) {
@@ -5073,16 +5573,14 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
         label: "Events"
       }));
     }
-  }), React__default.createElement(TableContainer, {
+  }), React__default.createElement("button", {
+    className: "clear"
+  }, "CLEAR")), React__default.createElement(TableContainer, {
     component: Paper,
     className: "my-ticket-table"
   }, React__default.createElement(Table, {
     "aria-label": "collapsible table"
-  }, React__default.createElement(TableHead, null, React__default.createElement(TableRow, null, tableConfig().header.map(function (column, index) {
-    return React__default.createElement(TableCell, {
-      key: index
-    }, column);
-  }), React__default.createElement(TableCell, null))), React__default.createElement(TableBody, null, (_data$orders = data.orders) == null ? void 0 : _data$orders.map(function (row) {
+  }, React__default.createElement(TableBody, null, (_data$orders = data.orders) == null ? void 0 : _data$orders.map(function (row) {
     return React__default.createElement(Row, {
       key: row.id,
       row: row,
@@ -5096,6 +5594,16 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
     page: data.page,
     onPageChange: handleChangePage,
     onRowsPerPageChange: handleChangeRowsPerPage
+  })), React__default.createElement(React__default.Fragment, null, showModalLogin && React__default.createElement(LoginModal, {
+    onClose: function onClose() {
+      setShowModalLogin(false);
+    },
+    onLogin: function onLogin() {
+      setShowModalLogin(false);
+      setUserExpired(false);
+      setIsLogged(true);
+    },
+    userExpired: userExpired
   })));
 };
 
@@ -5105,27 +5613,94 @@ var TicketsTable = function TicketsTable(_ref) {
       _ref$handleSellTicket = _ref.handleSellTicket,
       handleSellTicket = _ref$handleSellTicket === void 0 ? function () {} : _ref$handleSellTicket,
       _ref$handleRemoveFrom = _ref.handleRemoveFromResale,
-      handleRemoveFromResale = _ref$handleRemoveFrom === void 0 ? function () {} : _ref$handleRemoveFrom;
+      handleRemoveFromResale = _ref$handleRemoveFrom === void 0 ? function () {} : _ref$handleRemoveFrom,
+      _ref$icon = _ref.icon,
+      icon = _ref$icon === void 0 ? '' : _ref$icon;
+
+  var _useState = React.useState(null),
+      pdfError = _useState[0],
+      setPdfError = _useState[1];
+
   return React__default.createElement("div", {
     className: "tickets-box"
-  }, React__default.createElement("h4", {
+  }, React__default.createElement(SnackbarAlert, {
+    type: "error",
+    isOpen: !!pdfError,
+    message: pdfError || '',
+    onClose: function onClose() {
+      return setPdfError(null);
+    }
+  }), React__default.createElement("h4", {
     className: "sub-title"
   }, "Your Tickets"), React__default.createElement(TableContainer, {
     component: Paper
   }, React__default.createElement(Table, {
     "aria-label": "collapsible table"
-  }, React__default.createElement(TableHead, null, React__default.createElement(TableRow, null, React__default.createElement(TableCell, null, "Ticket ID"), React__default.createElement(TableCell, null, "Ticket Type"), React__default.createElement(TableCell, null, "Ticket Holder Name"), React__default.createElement(TableCell, null, "Status"), React__default.createElement(TableCell, null, "Download"), React__default.createElement(TableCell, null))), React__default.createElement(TableBody, null, tickets.map(function (ticket, index) {
+  }, React__default.createElement(TableHead, null, React__default.createElement(TableRow, null, React__default.createElement(TableCell, null), React__default.createElement(TableCell, null), React__default.createElement(TableCell, null), React__default.createElement(TableCell, null), React__default.createElement(TableCell, null), React__default.createElement(TableCell, null))), React__default.createElement(TableBody, null, tickets.map(function (ticket, index) {
     var _ticket$add_ons;
 
     return React__default.createElement(React.Fragment, {
       key: index
-    }, React__default.createElement(TableRow, null, React__default.createElement(TableCell, null, ticket.hash), React__default.createElement(TableCell, null, ticket.ticket_type), React__default.createElement(TableCell, null, ticket.holder_name), React__default.createElement(TableCell, null, ticket.status), React__default.createElement(TableCell, null, React__default.createElement("span", {
+    }, React__default.createElement(TableRow, null, React__default.createElement(TableCell, null, React__default.createElement("div", {
+      className: "cell-block"
+    }, React__default.createElement("span", null, "Ticket ID"), React__default.createElement("span", null, ticket.hash))), React__default.createElement(TableCell, null, React__default.createElement("div", {
+      className: "cell-block"
+    }, React__default.createElement("span", null, "Ticket Type"), React__default.createElement("span", null, ticket.ticket_type))), React__default.createElement(TableCell, null, React__default.createElement("div", {
+      className: "cell-block"
+    }, React__default.createElement("span", null, "Ticket Holder"), React__default.createElement("span", null, ticket.holder_name))), React__default.createElement(TableCell, null, React__default.createElement("div", {
+      className: "cell-block"
+    }, React__default.createElement("span", null, "Status"), React__default.createElement("span", null, ticket.status))), React__default.createElement(TableCell, null, ticket.status !== 'Sold' && React__default.createElement("div", {
+      className: "tb-download"
+    }, Boolean(icon) && React__default.createElement("img", {
+      src: icon,
+      alt: ""
+    }), React__default.createElement("span", {
       "aria-hidden": true,
       className: "action-button",
-      onClick: function onClick() {
-        return downloadPDF(ticket.pdf_link);
-      }
-    }, "Download")), React__default.createElement(TableCell, null, ticket.is_sellable && React__default.createElement("span", {
+      onClick: function () {
+        var _onClick = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
+          var pdfDownloadError;
+          return runtime_1.wrap(function _callee$(_context) {
+            while (1) {
+              switch (_context.prev = _context.next) {
+                case 0:
+                  _context.prev = 0;
+                  _context.next = 3;
+                  return downloadPDF(ticket.pdf_link);
+
+                case 3:
+                  pdfDownloadError = _context.sent;
+
+                  if (pdfDownloadError) {
+                    setPdfError(pdfDownloadError == null ? void 0 : pdfDownloadError.message);
+                  }
+
+                  _context.next = 10;
+                  break;
+
+                case 7:
+                  _context.prev = 7;
+                  _context.t0 = _context["catch"](0);
+
+                  if (_context.t0 && typeof _context.t0 === 'string') {
+                    setPdfError(_context.t0);
+                  }
+
+                case 10:
+                case "end":
+                  return _context.stop();
+              }
+            }
+          }, _callee, null, [[0, 7]]);
+        }));
+
+        function onClick() {
+          return _onClick.apply(this, arguments);
+        }
+
+        return onClick;
+      }()
+    }, "Download"))), React__default.createElement(TableCell, null, ticket.is_sellable && React__default.createElement("span", {
       "aria-hidden": true,
       className: "action-button",
       onClick: function onClick() {
@@ -5225,7 +5800,8 @@ var TicketResaleModal = function TicketResaleModal(_ref) {
       holder_name = ticket.holder_name,
       event_name = ticket.event_name,
       currency = ticket.currency,
-      resale_fee_amount = ticket.resale_fee_amount;
+      resale_fee_amount = ticket.resale_fee_amount,
+      ticket_type_is_active = ticket.ticket_type_is_active;
   return React__default.createElement(Modal, {
     open: true,
     onClose: onClose,
@@ -5298,13 +5874,13 @@ var TicketResaleModal = function TicketResaleModal(_ref) {
       label: 'Confirm Email address',
       type: 'text',
       component: CustomField
-    }))))), React__default.createElement("div", null, React__default.createElement(formik.Field, {
-      name: 'to',
-      label: 'I will sell my ticket to anyone who wants to buy it',
-      type: 'radio',
-      value: 'anyone',
+    }))))), ticket_type_is_active && React__default.createElement("div", null, React__default.createElement(formik.Field, {
+      name: "to",
+      label: "I will sell my ticket to anyone who wants to buy it",
+      type: "radio",
+      value: "anyone",
       component: RadioField
-    })), React__default.createElement("div", null, React__default.createElement("h4", null, "Terms of Resale"), React__default.createElement("p", null, "I confirm that I want to sell this ticket and that, if someone chooses to buy it, I will no longer own it or have the right to ask for it back."), React__default.createElement("p", null, "I also understand that, if no one chooses to buy it, it remains my property, is valid for entry to ", React__default.createElement("strong", null, event_name), " and I will not receive any refund."), React__default.createElement("p", null, "If my ticket is sold, the original card I used to buy my ticket will be refunded with the original amount paid, minus a small handling fee of ", React__default.createElement("strong", null, currency + resale_fee_amount), ", and that any existing refunds due to me for referring sales for this event are no longer valid."), React__default.createElement(formik.Field, {
+    })), React__default.createElement("div", null, React__default.createElement("h4", null, "Terms of Resale"), React__default.createElement("p", null, "I confirm that I want to sell this ticket and that, if someone chooses to buy it, I will no longer own it or have the right to ask for it back."), React__default.createElement("p", null, "I also understand that, if no one chooses to buy it, it remains my property, is valid for entry to ", React__default.createElement("strong", null, event_name), " and I will not receive any refund."), React__default.createElement("p", null, "If my ticket is sold, the original card I used to buy my ticket will be refunded with the original amount paid, minus a small handling fee of ", React__default.createElement("strong", null, (currency || '') + " " + (resale_fee_amount || '')), ", and that any existing refunds due to me for referring sales for this event are no longer valid."), React__default.createElement(formik.Field, {
       name: 'confirm',
       label: 'I agree',
       type: 'checkbox',
@@ -5364,10 +5940,14 @@ var getTotal = function getTotal(data) {
 var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
   var _data$items, _data$items$ticket_ty, _data$items2, _data$items2$add_ons;
 
-  var _ref$onGetOrdersSucce = _ref.onGetOrdersSuccess,
+  var _ref$columns = _ref.columns,
+      columns = _ref$columns === void 0 ? [] : _ref$columns,
+      _ref$onGetOrdersSucce = _ref.onGetOrdersSuccess,
       onGetOrdersSuccess = _ref$onGetOrdersSucce === void 0 ? function () {} : _ref$onGetOrdersSucce,
       _ref$onGetOrdersError = _ref.onGetOrdersError,
-      onGetOrdersError = _ref$onGetOrdersError === void 0 ? function () {} : _ref$onGetOrdersError;
+      onGetOrdersError = _ref$onGetOrdersError === void 0 ? function () {} : _ref$onGetOrdersError,
+      _ref$personalLinkIcon = _ref.personalLinkIcon,
+      personalLinkIcon = _ref$personalLinkIcon === void 0 ? '' : _ref$personalLinkIcon;
 
   var _useState = React.useState({}),
       data = _useState[0],
@@ -5437,7 +6017,15 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
   }, []);
 
   var handleSellTicket = function handleSellTicket(ticket) {
-    setActiveTicket(ticket);
+    var ticketTypesArr = data.items.ticket_types;
+
+    var sellTicketType = _find(ticketTypesArr, function (ticketType) {
+      return ticketType.hash === ticket.ticket_type_hash;
+    });
+
+    setActiveTicket(_extends({}, ticket, {
+      ticket_type_is_active: sellTicketType == null ? void 0 : sellTicketType.active
+    }));
     setShowResaleModal(true);
   };
 
@@ -5560,6 +6148,12 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     };
   }();
 
+  var orderSummery = "ID " + data.id + ", placed";
+
+  if (data.date) {
+    orderSummery += " " + data.date;
+  }
+
   return React__default.createElement("div", {
     className: "order-details"
   }, loading ? React__default.createElement("div", {
@@ -5568,19 +6162,45 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     className: "layout-title"
   }, "Order Details"), React__default.createElement("div", {
     className: "order-summary-box"
-  }, React__default.createElement("h4", {
+  }, React__default.createElement("div", {
+    className: "summary-block"
+  }, React__default.createElement("div", {
+    className: "summary-item"
+  }, React__default.createElement("h6", {
     className: "sub-title"
-  }, "Order Summary"), React__default.createElement("div", {
+  }, "Order Summary"), React__default.createElement("p", null, orderSummery)), React__default.createElement("div", {
+    className: "summary-item"
+  }, React__default.createElement("div", {
+    className: "return-button-container"
+  }, React__default.createElement("button", {
+    type: "button",
+    className: "return-button",
+    onClick: function onClick() {
+      if (typeof window !== 'undefined') {
+        window.location.assign('/orders');
+      }
+    }
+  }, "Back to Orders")))), React__default.createElement("div", {
     className: "personal-link"
-  }, React__default.createElement("b", null, "Your personal share link for this event is: "), React__default.createElement("a", {
+  }, React__default.createElement("div", {
+    className: "link-item"
+  }, React__default.createElement("span", null, "Personal Share Link: "), React__default.createElement("a", {
     href: data == null ? void 0 : data.personal_share_link,
     target: "_blank",
     rel: "noreferrer"
-  }, data == null ? void 0 : data.personal_share_link)), React__default.createElement(TableContainer, {
+  }, Boolean(personalLinkIcon) && React__default.createElement("img", {
+    src: personalLinkIcon,
+    alt: "Icon"
+  }), data == null ? void 0 : data.personal_share_link)), React__default.createElement("div", {
+    className: "link-item"
+  }, React__default.createElement("p", null, "So far, you\u2019ve referred " + data.sales_referred + " tickets"))), React__default.createElement(TableContainer, {
     component: Paper
   }, React__default.createElement(Table, {
+    className: "tt-type",
     "aria-label": "collapsible table"
-  }, React__default.createElement(TableHead, null, React__default.createElement(TableRow, null, React__default.createElement(TableCell, null, "Items"), React__default.createElement(TableCell, null, "Price"), React__default.createElement(TableCell, null, "Quantity"), React__default.createElement(TableCell, null, "Total"))), React__default.createElement(TableBody, null, data == null ? void 0 : (_data$items = data.items) == null ? void 0 : (_data$items$ticket_ty = _data$items.ticket_types) == null ? void 0 : _data$items$ticket_ty.map(function (ticket, index) {
+  }, React__default.createElement(TableHead, null, React__default.createElement(TableRow, null, _map(columns, function (item) {
+    return React__default.createElement(TableCell, null, item.label || '');
+  }))), React__default.createElement(TableBody, null, data == null ? void 0 : (_data$items = data.items) == null ? void 0 : (_data$items$ticket_ty = _data$items.ticket_types) == null ? void 0 : _data$items$ticket_ty.map(function (ticket, index) {
     return React__default.createElement(TableRow, {
       key: index
     }, React__default.createElement(TableCell, null, React__default.createElement("b", null, "Ticket Type: "), ticket.name), React__default.createElement(TableCell, null, ticket.currency + ticket.price), React__default.createElement(TableCell, null, ticket.quantity), React__default.createElement(TableCell, null, ticket.currency + ticket.total));
@@ -5594,17 +6214,7 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
     tickets: data.tickets,
     handleSellTicket: handleSellTicket,
     handleRemoveFromResale: handleRemoveFromResale
-  }), React__default.createElement("div", {
-    className: "return-button-container"
-  }, React__default.createElement("button", {
-    type: "button",
-    className: "return-button",
-    onClick: function onClick() {
-      if (typeof window !== 'undefined') {
-        window.location.assign('/orders');
-      }
-    }
-  }, "Return to Order History"))), showResaleModal && React__default.createElement(TicketResaleModal, {
+  })), showResaleModal && React__default.createElement(TicketResaleModal, {
     ticket: activeTicket,
     onClose: handleOnClose,
     onSubmit: handleOnSubmit
@@ -5616,80 +6226,293 @@ var OrderDetailsContainer = function OrderDetailsContainer(_ref) {
 };
 
 var TicketResaleContainer = function TicketResaleContainer(_ref) {
-  var _ref$onCheckTicketSta = _ref.onCheckTicketStatusSuccess,
-      onCheckTicketStatusSuccess = _ref$onCheckTicketSta === void 0 ? function () {} : _ref$onCheckTicketSta,
-      _ref$onCheckTicketSta2 = _ref.onCheckTicketStatusError,
-      onCheckTicketStatusError = _ref$onCheckTicketSta2 === void 0 ? function () {} : _ref$onCheckTicketSta2,
+  var _ref$onProcessTicketS = _ref.onProcessTicketSuccess,
+      onProcessTicketSuccess = _ref$onProcessTicketS === void 0 ? function () {} : _ref$onProcessTicketS,
+      _ref$onProcessTicketE = _ref.onProcessTicketError,
+      onProcessTicketError = _ref$onProcessTicketE === void 0 ? function () {} : _ref$onProcessTicketE,
+      _ref$onDeclineTicketP = _ref.onDeclineTicketPurchaseSuccess,
+      onDeclineTicketPurchaseSuccess = _ref$onDeclineTicketP === void 0 ? function () {} : _ref$onDeclineTicketP,
+      _ref$onDeclineTicketP2 = _ref.onDeclineTicketPurchaseError,
+      onDeclineTicketPurchaseError = _ref$onDeclineTicketP2 === void 0 ? function () {} : _ref$onDeclineTicketP2,
       orderHash = _ref.orderHash;
   var isWindowDefined = typeof window !== 'undefined';
 
-  var _useState = React.useState(null),
+  var _useState = React.useState(''),
       error = _useState[0],
       setError = _useState[1];
 
+  var _useState2 = React.useState(''),
+      successMessage = _useState2[0],
+      setSuccessMessage = _useState2[1];
+
   React.useEffect(function () {
     _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
-      var params, hash, response, data, age_required, names_required, event_id, _error$response, _error$response$data;
+      var params, hash, isDeclined, response, _error$response, _error$response$data, _response, data, age_required, names_required, event_id, _error$response2, _error$response2$data;
 
       return runtime_1.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
               if (!isWindowDefined) {
-                _context.next = 24;
+                _context.next = 38;
                 break;
               }
 
               params = new URL("" + window.location).searchParams;
-              hash = params.get('o') || orderHash || null;
+              hash = params.get('invitation_hash') || orderHash || null;
+              isDeclined = params.get('decline') || false;
 
               if (!hash) {
-                _context.next = 23;
+                _context.next = 37;
                 break;
               }
 
-              _context.prev = 4;
-              _context.next = 7;
-              return checkTicketStatus(hash);
+              if (!isDeclined) {
+                _context.next = 19;
+                break;
+              }
 
-            case 7:
+              _context.prev = 6;
+              _context.next = 9;
+              return declineInvitation(hash);
+
+            case 9:
               response = _context.sent;
-              data = _get(response, 'data.data.attributes');
+              onDeclineTicketPurchaseSuccess(response);
+              setSuccessMessage("Thanks for letting us know! We'll offer this ticket to someone else!");
+              _context.next = 18;
+              break;
+
+            case 14:
+              _context.prev = 14;
+              _context.t0 = _context["catch"](6);
+              setError(_context.t0 == null ? void 0 : (_error$response = _context.t0.response) == null ? void 0 : (_error$response$data = _error$response.data) == null ? void 0 : _error$response$data.message);
+              onDeclineTicketPurchaseError(_context.t0.response);
+
+            case 18:
+              return _context.abrupt("return");
+
+            case 19:
+              _context.prev = 19;
+              _context.next = 22;
+              return processTicket(hash);
+
+            case 22:
+              _response = _context.sent;
+              data = _get(_response, 'data.data.attributes');
               age_required = _get(data, 'age_required', false);
               names_required = _get(data, 'names_required', false);
               event_id = _get(data, 'event_id');
-              onCheckTicketStatusSuccess(response.data);
+              onProcessTicketSuccess(_response.data);
               window.location.href = "/billing/billing-info/?age_required=" + age_required + "&names_required=" + names_required + "&event_id=" + event_id;
-              _context.next = 21;
+              _context.next = 35;
               break;
 
-            case 16:
-              _context.prev = 16;
-              _context.t0 = _context["catch"](4);
-              console.log(_context.t0);
-              setError(_context.t0 == null ? void 0 : (_error$response = _context.t0.response) == null ? void 0 : (_error$response$data = _error$response.data) == null ? void 0 : _error$response$data.message);
-              onCheckTicketStatusError(_context.t0.response);
+            case 31:
+              _context.prev = 31;
+              _context.t1 = _context["catch"](19);
+              setError(_context.t1 == null ? void 0 : (_error$response2 = _context.t1.response) == null ? void 0 : (_error$response2$data = _error$response2.data) == null ? void 0 : _error$response2$data.message);
+              onProcessTicketError(_context.t1.response);
 
-            case 21:
-              _context.next = 24;
+            case 35:
+              _context.next = 38;
               break;
 
-            case 23:
+            case 37:
               window.location.href = '/';
 
-            case 24:
+            case 38:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[4, 16]]);
+      }, _callee, null, [[6, 14], [19, 31]]);
     }))();
   }, []);
   return React__default.createElement("div", {
     className: "ticket-resale-page"
   }, React__default.createElement("div", {
-    className: "error-block"
-  }, React__default.createElement("h3", null, error)));
+    className: "" + (successMessage ? 'success-block' : 'error-block')
+  }, React__default.createElement("h3", null, successMessage ? successMessage : error)));
+};
+
+var style$3 = {
+  position: 'absolute',
+  top: '10%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)',
+  minWidth: 480,
+  backgroundColor: '#e3e3e3',
+  border: '1px solid white',
+  outline: 'none',
+  padding: '14px',
+  maxHeight: '85vh',
+  overflow: 'auto'
+};
+var RedirectModal = function RedirectModal(_ref) {
+  var _ref$message = _ref.message,
+      message = _ref$message === void 0 ? 'Your cart has expired. Please click on "OK" to return to the ticket selection page.' : _ref$message,
+      _ref$onClickOk = _ref.onClickOk,
+      onClickOk = _ref$onClickOk === void 0 ? function () {} : _ref$onClickOk;
+  return React__default.createElement(Modal, {
+    open: true,
+    "aria-labelledby": "modal-modal-title",
+    "aria-describedby": "modal-modal-description",
+    className: "redirect-modal"
+  }, React__default.createElement(Box, {
+    style: style$3
+  }, React__default.createElement("p", null, message), React__default.createElement("div", {
+    className: "footer"
+  }, React__default.createElement("button", {
+    onClick: onClickOk
+  }, "OK"))));
+};
+
+var style$4 = {
+  position: 'absolute',
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)',
+  minWidth: 480,
+  backgroundColor: '#e3e3e3',
+  border: '1px solid white',
+  outline: 'none',
+  padding: '14px',
+  maxHeight: '85vh',
+  overflow: 'auto'
+};
+var RsvpContainer = function RsvpContainer(_ref) {
+  var _ref$showSection = _ref.showSection,
+      showSection = _ref$showSection === void 0 ? false : _ref$showSection,
+      eventId = _ref.eventId;
+  var userDataEncoded = typeof window !== 'undefined' ? window.localStorage.getItem('user_data') : '';
+  var parsedData = JSON.parse(userDataEncoded || '{}');
+
+  var _useState = React.useState(false),
+      loading = _useState[0],
+      setLoading = _useState[1];
+
+  var _useState2 = React.useState({
+    isOpen: false,
+    text: ''
+  }),
+      modal = _useState2[0],
+      setModal = _useState2[1];
+
+  var handleModalClose = function handleModalClose() {
+    setModal({
+      isOpen: false,
+      text: ''
+    });
+  };
+
+  var handleSubmit = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(values) {
+      var requestData, _yield$sendRSVPInfo, data, _error$response$data;
+
+      return runtime_1.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              _context.prev = 0;
+              setLoading(true);
+              requestData = {
+                data: {
+                  email: values.email
+                }
+              };
+              _context.next = 5;
+              return sendRSVPInfo(eventId, requestData);
+
+            case 5:
+              _yield$sendRSVPInfo = _context.sent;
+              data = _yield$sendRSVPInfo.data;
+              setModal({
+                isOpen: true,
+                text: data.message
+              });
+              _context.next = 13;
+              break;
+
+            case 10:
+              _context.prev = 10;
+              _context.t0 = _context["catch"](0);
+
+              if (_context.t0.response.status === 403) {
+                setModal({
+                  isOpen: true,
+                  text: (_error$response$data = _context.t0.response.data) == null ? void 0 : _error$response$data.message
+                });
+              }
+
+            case 13:
+              _context.prev = 13;
+              setLoading(false);
+              return _context.finish(13);
+
+            case 16:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[0, 10, 13, 16]]);
+    }));
+
+    return function handleSubmit(_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  if (!showSection) {
+    return null;
+  }
+
+  return React__default.createElement(React__default.Fragment, null, React__default.createElement(Modal, {
+    open: modal.isOpen,
+    onClose: handleModalClose,
+    "aria-labelledby": "modal-modal-title",
+    "aria-describedby": "modal-modal-description",
+    className: "rsvp-modal"
+  }, React__default.createElement(Box, {
+    style: style$4,
+    className: "rsvp-modal-box"
+  }, React__default.createElement("div", {
+    className: "rsvp-modal-container"
+  }, React__default.createElement("div", {
+    className: "rsvp-modal-header"
+  }, modal.text), React__default.createElement("div", {
+    className: "rsvp-modal-button"
+  }, React__default.createElement("button", {
+    onClick: handleModalClose
+  }, "OK"))))), React__default.createElement("div", {
+    className: "rsvp-container"
+  }, loading ? React__default.createElement(Loader, null) : React__default.createElement(React__default.Fragment, null, React__default.createElement("div", {
+    className: "rsvp-header"
+  }, "RSVP"), React__default.createElement("div", {
+    className: "rsvp-email-container"
+  }, React__default.createElement(formik.Formik, {
+    initialValues: {
+      email: (parsedData == null ? void 0 : parsedData.email) || ''
+    },
+    onSubmit: handleSubmit,
+    enableReinitialize: true
+  }, React__default.createElement(formik.Form, null, React__default.createElement("div", {
+    className: "rsvp-email-input-container"
+  }, React__default.createElement(formik.Field, {
+    name: "email",
+    label: "EMAIL ADDRESS",
+    type: "email",
+    validate: combineValidators(function (value) {
+      return requiredValidator(value, 'Please enter your Email');
+    }, function (value) {
+      return emailValidator(value);
+    }),
+    component: CustomField
+  })), React__default.createElement("div", {
+    className: "rsvp-button-container"
+  }, React__default.createElement(Button, {
+    type: "submit"
+  }, "RSVP"))))))));
 };
 
 exports.BillingInfoContainer = BillingInfoContainer;
@@ -5698,6 +6521,8 @@ exports.LoginModal = LoginModal;
 exports.MyTicketsContainer = MyTicketsContainer;
 exports.OrderDetailsContainer = OrderDetailsContainer;
 exports.PaymentContainer = PaymentContainer;
+exports.RedirectModal = RedirectModal;
+exports.RsvpContainer = RsvpContainer;
 exports.TicketResaleContainer = TicketResaleContainer;
 exports.TicketsContainer = TicketsContainer;
 exports.createFixedFloatNormalizer = createFixedFloatNormalizer;