tf-checkout-react 1.3.30 → 1.3.33

package/dist/components/common/CheckboxField.d.ts

@@ -7,5 +7,5 @@ export interface ICheckboxField {
 interface IOtherProps {
     [key: string]: any;
 }
-export declare const CheckboxField: ({ label, field, selectOptions, theme, setFieldValue, disableDropdown, setPhoneValidationIsLoading, ...rest }: ICheckboxField & IOtherProps) => JSX.Element;
+export declare const CheckboxField: ({ label, field, selectOptions, theme, setFieldValue, disableDropdown, setPhoneValidationIsLoading, defaultCountry, dateFormat, datePlaceholder, ...rest }: ICheckboxField & IOtherProps) => JSX.Element;
 export {};

package/dist/components/common/DatePickerField.d.ts

@@ -10,5 +10,5 @@ export interface IDatePickerFieldProps {
 interface IOtherProps {
     [key: string]: any;
 }
-export declare const DatePickerField: ({ label, field, form, theme, useCompact, }: IDatePickerFieldProps & IOtherProps) => JSX.Element;
+export declare const DatePickerField: ({ label, field, form, theme, useCompact, dateFormat, datePlaceholder }: IDatePickerFieldProps & IOtherProps) => JSX.Element;
 export {};

package/dist/components/common/RadioGroupField/index.d.ts

@@ -0,0 +1,17 @@
+import { FieldInputProps, FormikProps } from 'formik';
+import React from 'react';
+interface IRadio {
+    id: string | number;
+    name: string | number;
+    value: string | number;
+    [key: string]: any;
+}
+interface IRadioGroupField {
+    label?: string;
+    field: FieldInputProps<any>;
+    form: FormikProps<any>;
+    radios: IRadio[];
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+export declare const RadioGroupField: ({ label, field, radios, form: { errors, setFieldValue }, onChange, }: IRadioGroupField) => JSX.Element;
+export {};

package/dist/components/common/index.d.ts

@@ -4,3 +4,4 @@ export { FormikPhoneNumberField } from './FormikPhoneNumberField';
 export { PhoneNumberField } from './PhoneNumberField';
 export { Loader } from './Loader';
 export { SelectField } from './SelectField';
+export { RadioGroupField } from './RadioGroupField';

package/dist/components/ticketsContainer/index.d.ts

@@ -27,6 +27,8 @@ export interface IGetTickets {
     onGetTicketsError: (e: AxiosError) => void;
     onLogoutSuccess: () => void;
     onLogoutError: (e: AxiosError) => void;
+    onGetProfileDataSuccess: (response: any) => void;
+    onGetProfileDataError: (e: AxiosError) => void;
     onLoginSuccess: () => void;
     handleNotInvitedModalClose: () => void;
     handleInvalidLinkModalClose: () => void;
@@ -59,5 +61,5 @@ export interface ITicket {
 export interface ISelectedTickets {
     [key: string]: string | number;
 }
-export declare const TicketsContainer: ({ onLoginSuccess, getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, onLogoutSuccess, onLogoutError, theme, queryPromoCode, isPromotionsEnabled, themeOptions, isAccessCodeEnabled, hideSessionButtons, hideWaitingList, enableBillingInfoAutoCreate, isButtonScrollable, sortBySoldOut, disableCountdownLeadingZero, isLoggedIn, actionsSectionComponent: ActionsSectionComponent, ticketsHeaderComponent, hideTicketsHeader, enableInfluencersSection, enableAddOns, handleNotInvitedModalClose, handleInvalidLinkModalClose, ordersPath, }: IGetTickets) => JSX.Element;
+export declare const TicketsContainer: ({ onLoginSuccess, getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, onLogoutSuccess, onLogoutError, onGetProfileDataSuccess, onGetProfileDataError, theme, queryPromoCode, isPromotionsEnabled, themeOptions, isAccessCodeEnabled, hideSessionButtons, hideWaitingList, enableBillingInfoAutoCreate, isButtonScrollable, sortBySoldOut, disableCountdownLeadingZero, isLoggedIn, actionsSectionComponent: ActionsSectionComponent, ticketsHeaderComponent, hideTicketsHeader, enableInfluencersSection, enableAddOns, handleNotInvitedModalClose, handleInvalidLinkModalClose, ordersPath, }: IGetTickets) => JSX.Element;
 export {};

package/dist/constants/index.d.ts

@@ -0,0 +1 @@
+export declare const X_TF_ECOMMERCE = "X-TF-ECOMMERCE";

package/dist/hooks/useCookieListener.d.ts

@@ -0,0 +1 @@
+export declare const useCookieListener: (key: string, handler: (value: string | null) => void) => void;

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

@@ -10,6 +10,7 @@ var Button = _interopDefault(require('@mui/material/Button'));
 var styles = require('@mui/material/styles');
 var axios = _interopDefault(require('axios'));
 var formik = require('formik');
+var _find = _interopDefault(require('lodash/find'));
 var _get = _interopDefault(require('lodash/get'));
 var _identity = _interopDefault(require('lodash/identity'));
 var _includes = _interopDefault(require('lodash/includes'));
@@ -27,13 +28,18 @@ var TextField = _interopDefault(require('@mui/material/TextField'));
 var styles$1 = require('@mui/styles');
 var _isFunction = _interopDefault(require('lodash/isFunction'));
 var _isObject = _interopDefault(require('lodash/isObject'));
-var FormGroup = _interopDefault(require('@mui/material/FormGroup'));
-var FormControlLabel = _interopDefault(require('@mui/material/FormControlLabel'));
 var Checkbox = _interopDefault(require('@mui/material/Checkbox'));
+var FormControlLabel = _interopDefault(require('@mui/material/FormControlLabel'));
+var FormGroup = _interopDefault(require('@mui/material/FormGroup'));
 var MuiPhoneNumber = _interopDefault(require('material-ui-phone-number'));
 var _debounce = _interopDefault(require('lodash/debounce'));
 var CircularProgress = _interopDefault(require('@mui/material/CircularProgress'));
 var Select = _interopDefault(require('@mui/material/Select'));
+var FormControl = _interopDefault(require('@mui/material/FormControl'));
+var FormHelperText = _interopDefault(require('@mui/material/FormHelperText'));
+var FormLabel = _interopDefault(require('@mui/material/FormLabel'));
+var Radio = _interopDefault(require('@mui/material/Radio'));
+var RadioGroup = _interopDefault(require('@mui/material/RadioGroup'));
 var Yup = require('yup');
 var Box = _interopDefault(require('@mui/material/Box'));
 var Modal = _interopDefault(require('@mui/material/Modal'));
@@ -49,12 +55,10 @@ var stripeJs = require('@stripe/stripe-js');
 var reactShare = require('react-share');
 var privateTheming = require('@mui/private-theming');
 var jwt_decode = _interopDefault(require('jwt-decode'));
-var _find = _interopDefault(require('lodash/find'));
 var _some = _interopDefault(require('lodash/some'));
 var Button$1 = _interopDefault(require('react-bootstrap/Button'));
 var moment = _interopDefault(require('moment-timezone'));
 var _sortBy = _interopDefault(require('lodash/sortBy'));
-var FormControl = _interopDefault(require('@mui/material/FormControl'));
 var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
 var Autocomplete = _interopDefault(require('@mui/material/Autocomplete'));
 var Paper = _interopDefault(require('@mui/material/Paper'));
@@ -66,7 +70,6 @@ var TableHead = _interopDefault(require('@mui/material/TableHead'));
 var TablePagination = _interopDefault(require('@mui/material/TablePagination'));
 var TableRow = _interopDefault(require('@mui/material/TableRow'));
 var _has = _interopDefault(require('lodash/has'));
-var Radio = _interopDefault(require('@mui/material/Radio'));
 var _isNull = _interopDefault(require('lodash/isNull'));
 var _reverse = _interopDefault(require('lodash/reverse'));
 
@@ -1187,6 +1190,22 @@ var createMarkup = function createMarkup(data) {
   };
 };
 
+var setLoggedUserData = function setLoggedUserData(data) {
+  return {
+    id: data.id,
+    first_name: data.firstName,
+    last_name: data.lastName,
+    email: data.email,
+    confirmEmail: data.email,
+    city: (data == null ? void 0 : data.city) || '',
+    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) || '',
+    zip: (data == null ? void 0 : data.zip) || (data == null ? void 0 : data.zipCode) || ''
+  };
+};
+
 var isWindowDefined = typeof window !== 'undefined';
 var isDocumentDefined = typeof document !== 'undefined';
 
@@ -1466,7 +1485,7 @@ var getProfileData = function getProfileData(accessToken) {
   });
 };
 var getCountries = function getCountries() {
-  return publicRequest.get('/countries/');
+  return publicRequest.get('/countries/list');
 };
 var getConfirmationData = function getConfirmationData(orderHash) {
   return publicRequest.get("v1/order/" + orderHash + "/payment/complete");
@@ -1759,7 +1778,11 @@ var DatePickerField = function DatePickerField(_ref) {
       form = _ref.form,
       theme = _ref.theme,
       _ref$useCompact = _ref.useCompact,
-      useCompact = _ref$useCompact === void 0 ? true : _ref$useCompact;
+      useCompact = _ref$useCompact === void 0 ? true : _ref$useCompact,
+      _ref$dateFormat = _ref.dateFormat,
+      dateFormat = _ref$dateFormat === void 0 ? 'DD/MM/YYYY' : _ref$dateFormat,
+      _ref$datePlaceholder = _ref.datePlaceholder,
+      datePlaceholder = _ref$datePlaceholder === void 0 ? 'dd/mm/yyyy' : _ref$datePlaceholder;
   return React__default.createElement(styles.ThemeProvider, {
     theme: useCompact ? compactStyleTheme : {}
   }, React__default.createElement(LocalizationProvider.LocalizationProvider, {
@@ -1774,12 +1797,12 @@ var DatePickerField = function DatePickerField(_ref) {
     },
     showDaysOutsideCurrentMonth: true,
     disableFuture: true,
-    inputFormat: "DD/MM/YYYY",
+    inputFormat: dateFormat,
     mask: "__/__/____",
     renderInput: function renderInput(params) {
       return React__default.createElement(CustomField, Object.assign({}, params, {
         inputProps: _extends({}, params.inputProps, {
-          placeholder: 'dd/mm/yyyy'
+          placeholder: datePlaceholder
         }),
         theme: theme,
         field: _extends({}, field, {
@@ -1797,7 +1820,7 @@ var DatePickerField = function DatePickerField(_ref) {
   })));
 };
 
-var _excluded = ["label", "field", "selectOptions", "theme", "setFieldValue", "disableDropdown", "setPhoneValidationIsLoading"];
+var _excluded = ["label", "field", "selectOptions", "theme", "setFieldValue", "disableDropdown", "setPhoneValidationIsLoading", "defaultCountry", "dateFormat", "datePlaceholder"];
 var CheckboxField = function CheckboxField(_ref) {
   var _rest$form, _field$name, _rest$form2, _field$name2;
 
@@ -1807,14 +1830,14 @@ var CheckboxField = function CheckboxField(_ref) {
 
   var customTheme = styles$1.useTheme();
   return React__default.createElement(material.FormControl, {
-    error: !!(rest != null && (_rest$form = rest.form) != null && _rest$form.errors && rest.form.errors[(_field$name = field == null ? void 0 : field.name) != null ? _field$name : ""])
+    error: !!(rest != null && (_rest$form = rest.form) != null && _rest$form.errors && rest.form.errors[(_field$name = field == null ? void 0 : field.name) != null ? _field$name : ''])
   }, React__default.createElement(FormGroup, null, React__default.createElement(FormControlLabel, {
     control: React__default.createElement(Checkbox, Object.assign({}, field, rest)),
     label: label,
     componentsProps: {
       typography: customTheme == null ? void 0 : customTheme.checkbox
     }
-  })), !!(rest != null && (_rest$form2 = rest.form) != null && _rest$form2.errors && rest.form.errors[(_field$name2 = field == null ? void 0 : field.name) != null ? _field$name2 : ""]) ? React__default.createElement(material.FormHelperText, null, "Required") : null);
+  })), !!(rest != null && (_rest$form2 = rest.form) != null && _rest$form2.errors && rest.form.errors[(_field$name2 = field == null ? void 0 : field.name) != null ? _field$name2 : '']) ? React__default.createElement(material.FormHelperText, null, "Required") : null);
 };
 
 var PhoneNumberField = function PhoneNumberField(_ref) {
@@ -1999,6 +2022,48 @@ var SelectField = function SelectField(_ref) {
   }, error) : null);
 };
 
+var RadioGroupField = function RadioGroupField(_ref) {
+  var label = _ref.label,
+      field = _ref.field,
+      radios = _ref.radios,
+      _ref$form = _ref.form,
+      errors = _ref$form.errors,
+      setFieldValue = _ref$form.setFieldValue,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? _identity : _ref$onChange;
+  var radioId = "radio-" + field.name;
+
+  var error = _get(errors, field.name);
+
+  var handleChange = function handleChange(e) {
+    var value = e.target.value;
+    setFieldValue(field.name, value);
+    onChange(e);
+  };
+
+  return React__default.createElement(FormControl, null, error ? React__default.createElement(FormHelperText, {
+    className: "radio-error",
+    error: true
+  }, error) : null, label && React__default.createElement(FormLabel, {
+    id: radioId
+  }, label), React__default.createElement(RadioGroup, {
+    "aria-labelledby": radioId,
+    name: field.name,
+    value: field.value,
+    onChange: handleChange
+  }, radios.map(function (radio) {
+    var id = radio.id,
+        name = radio.name,
+        value = radio.value;
+    return React__default.createElement(FormControlLabel, {
+      key: id,
+      label: name,
+      value: value,
+      control: React__default.createElement(Radio, null)
+    });
+  })));
+};
+
 var SnackbarAlert = function SnackbarAlert(_ref) {
   var isOpen = _ref.isOpen,
       message = _ref.message,
@@ -2184,7 +2249,7 @@ var style$1 = {
   border: '1px solid white',
   outline: 'none'
 };
-var setLoggedUserData = function setLoggedUserData(data) {
+var setLoggedUserData$1 = function setLoggedUserData(data) {
   return {
     id: data.id,
     first_name: data.firstName,
@@ -2282,7 +2347,7 @@ var LoginModal = function LoginModal(_ref) {
 
               case 17:
                 profileSpecifiedData = _get(profileResponse, 'data.data');
-                profileDataObj = setLoggedUserData(profileSpecifiedData);
+                profileDataObj = setLoggedUserData$1(profileSpecifiedData);
 
                 if (typeof window !== 'undefined') {
                   window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
@@ -2716,7 +2781,7 @@ var createRegisterFormData = function createRegisterFormData(values, checkoutBod
 
   return bodyFormData;
 };
-var setLoggedUserData$1 = function setLoggedUserData(data) {
+var setLoggedUserData$2 = function setLoggedUserData(data) {
   return {
     id: data.id,
     first_name: data.firstName,
@@ -3054,6 +3119,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
 
   var themeMui = styles.createTheme(themeOptions);
   var isWindowDefined = typeof window !== 'undefined';
+  var defaultCountry = isWindowDefined ? window.localStorage.getItem('eventCountry') : '';
   var userData = isWindowDefined && window.localStorage.getItem('user_data') ? JSON.parse(window.localStorage.getItem('user_data') || '') : {};
   var access_token = isWindowDefined && window.localStorage.getItem('access_token') ? window.localStorage.getItem('access_token') || '' : '';
 
@@ -3125,13 +3191,17 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
       loading = _useState14[0],
       setLoading = _useState14[1];
 
-  var _useState15 = React.useState(null),
-      error = _useState15[0],
-      setError = _useState15[1];
+  var _useState15 = React.useState(true),
+      isCountriesLoading = _useState15[0],
+      setIsCountriesLoading = _useState15[1];
+
+  var _useState16 = React.useState(null),
+      error = _useState16[0],
+      setError = _useState16[1];
 
-  var _useState16 = React.useState(false),
-      phoneValidationIsLoading = _useState16[0],
-      setPhoneValidationIsLoading = _useState16[1];
+  var _useState17 = React.useState(false),
+      phoneValidationIsLoading = _useState17[0],
+      setPhoneValidationIsLoading = _useState17[1];
 
   var emailLogged = _get(userData, 'email', '') || _get(userValues, 'email', '');
 
@@ -3211,30 +3281,34 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
               case 3:
                 res = _context2.sent;
                 setCustomHeader(res);
-                setCountries(_map(_get(res, 'data.data'), function (item, key) {
+                setCountries(_map(_get(res, 'data.data'), function (item) {
                   return {
-                    label: item,
-                    value: key
+                    label: item.name,
+                    value: item.id,
+                    code: item.code
                   };
                 }));
+                setIsCountriesLoading(false);
                 onGetCountriesSuccess(res.data);
-                _context2.next = 12;
+                _context2.next = 14;
                 break;
 
-              case 9:
-                _context2.prev = 9;
+              case 10:
+                _context2.prev = 10;
                 _context2.t0 = _context2["catch"](0);
 
                 if (axios.isAxiosError(_context2.t0)) {
                   onGetCountriesError(_context2.t0);
                 }
 
-              case 12:
+                setIsCountriesLoading(false);
+
+              case 14:
               case "end":
                 return _context2.stop();
             }
           }
-        }, _callee2, null, [[0, 9]]);
+        }, _callee2, null, [[0, 10]]);
       }));
 
       return function fetchCountries() {
@@ -3313,7 +3387,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
             case 4:
               userDataResponse = _context4.sent;
               profileSpecifiedData = _get(userDataResponse, 'data.data');
-              profileDataObj = setLoggedUserData$1(profileSpecifiedData);
+              profileDataObj = setLoggedUserData$2(profileSpecifiedData);
               setUserValues(_extends({}, profileDataObj, {
                 firstName: profileDataObj.first_name,
                 lastName: profileDataObj.last_name
@@ -3444,7 +3518,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
 
   return React__default.createElement(styles.ThemeProvider, {
     theme: themeMui
-  }, loading && React__default.createElement(Backdrop, {
+  }, (loading || isCountriesLoading) && React__default.createElement(Backdrop, {
     sx: {
       color: '#fff',
       backgroundColor: '#000000bd',
@@ -3456,9 +3530,11 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
   })), !!expirationTime && enableTimer && React__default.createElement(TimerWidget$1, {
     expires_at: expirationTime,
     onCountdownFinish: onCountdownFinish
-  }), React__default.createElement(formik.Formik, {
+  }), !isCountriesLoading && React__default.createElement(formik.Formik, {
     initialValues: getInitialValues(dataWithUniqueIds, _extends({
-      country: _get(userData, 'country', '') || '1',
+      country: (_find(countries, function (item) {
+        return item.code.toLowerCase() === defaultCountry;
+      }) || {}).value || _get(userData, 'country', '') || '1',
       state: _get(userData, 'state', '') || '1',
       brand_opt_in: optedInFieldValue,
       ttf_opt_in: ttfOptIn
@@ -3503,7 +3579,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
               case 11:
                 updatedUserData = _context6.sent;
                 _profileSpecifiedData = _get(updatedUserData, 'data.data');
-                _profileDataObj = setLoggedUserData$1(_profileSpecifiedData);
+                _profileDataObj = setLoggedUserData$2(_profileSpecifiedData);
                 window.localStorage.setItem('user_data', JSON.stringify(_profileDataObj));
 
               case 15:
@@ -3577,7 +3653,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
               case 39:
                 profileData = _context6.sent;
                 profileSpecifiedData = _get(profileData, 'data.data');
-                profileDataObj = setLoggedUserData$1(profileSpecifiedData);
+                profileDataObj = setLoggedUserData$2(profileSpecifiedData);
 
                 if (isWindowDefined) {
                   window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
@@ -3745,7 +3821,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
           return ['password', 'confirmPassword', 'password-info'].includes(element.name) && isLoggedIn ? null : ['data_capture[wallet_address]'].includes(element.name) && hideWalletAddressField ? null : React__default.createElement(React__default.Fragment, {
             key: element.uniqueId
           }, React__default.createElement("div", {
-            className: element.className + " " + (props == null ? void 0 : props.errors[element.name])
+            className: element.className + " " + ((props == null ? void 0 : props.errors[element.name]) || '')
           }, element.component ? element.component : React__default.createElement(formik.Field, {
             setPhoneValidationIsLoading: element.type === 'phone' ? setPhoneValidationIsLoading : undefined,
             name: element.name,
@@ -3755,11 +3831,14 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
             validate: getValidateFunctions(element, states, props.values, props.errors),
             setFieldValue: props.setFieldValue,
             onBlur: props.handleBlur,
-            component: element.type === 'checkbox' ? CheckboxField : element.type === 'select' ? SelectField : element.type === 'phone' ? PhoneNumberField : element.type === 'date' ? DatePickerField : CustomField,
+            component: element.type === 'checkbox' ? CheckboxField : element.type === 'select' ? SelectField : element.type === 'phone' ? PhoneNumberField : element.type === 'date' ? DatePickerField : element.type === 'radio' ? RadioGroupField : CustomField,
             selectOptions: element.name === 'country' ? countries : element.name === 'state' ? states : [],
+            radios: element.radios,
             theme: theme,
             disableDropdown: element.disableDropdown,
-            defaultCountry: element.defaultCountry
+            defaultCountry: defaultCountry || element.defaultCountry,
+            dateFormat: element.format,
+            datePlaceholder: element.placeholder
           })));
         })));
       }));
@@ -3795,7 +3874,7 @@ var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref4) {
             }),
             disableDropdown: element.disableDropdown,
             setPhoneValidationIsLoading: setPhoneValidationIsLoading,
-            defaultCountry: element.defaultCountry
+            defaultCountry: defaultCountry || element.defaultCountry
           }));
         })));
       }));
@@ -4952,6 +5031,38 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
   }))))));
 };
 
+var X_TF_ECOMMERCE = 'X-TF-ECOMMERCE';
+
+var useCookieListener = function useCookieListener(key, handler) {
+  var getCookie = function getCookie() {
+    return getCookieByName(key);
+  };
+
+  var _useState = React.useState(),
+      intervalValue = _useState[0],
+      setIntervalValue = _useState[1];
+
+  var cookieRef = React.useRef(getCookie());
+
+  var handleCookieChange = function handleCookieChange() {
+    var currentCookie = getCookie();
+    var prevCookie = cookieRef.current;
+
+    if (currentCookie !== prevCookie) {
+      cookieRef.current = getCookie();
+      handler(cookieRef.current);
+    }
+  };
+
+  React.useEffect(function () {
+    var interval = setInterval(handleCookieChange, 500);
+    setIntervalValue(interval);
+    return function () {
+      intervalValue && clearInterval(intervalValue);
+    }; // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};
+
 var style$3 = {
   position: 'absolute',
   top: '50%',
@@ -5554,6 +5665,10 @@ var TicketsContainer = function TicketsContainer(_ref) {
       onLogoutSuccess = _ref$onLogoutSuccess === void 0 ? _identity : _ref$onLogoutSuccess,
       _ref$onLogoutError = _ref.onLogoutError,
       onLogoutError = _ref$onLogoutError === void 0 ? _identity : _ref$onLogoutError,
+      _ref$onGetProfileData = _ref.onGetProfileDataSuccess,
+      onGetProfileDataSuccess = _ref$onGetProfileData === void 0 ? _identity : _ref$onGetProfileData,
+      _ref$onGetProfileData2 = _ref.onGetProfileDataError,
+      onGetProfileDataError = _ref$onGetProfileData2 === void 0 ? _identity : _ref$onGetProfileData2,
       _ref$theme = _ref.theme,
       theme = _ref$theme === void 0 ? 'light' : _ref$theme,
       _ref$queryPromoCode = _ref.queryPromoCode,
@@ -5596,9 +5711,8 @@ var TicketsContainer = function TicketsContainer(_ref) {
       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) || !!xtfCookie),
+  var _useState2 = React.useState(Boolean(getCookieByName(X_TF_ECOMMERCE))),
       isLogged = _useState2[0],
       setIsLogged = _useState2[1];
 
@@ -5667,6 +5781,9 @@ var TicketsContainer = function TicketsContainer(_ref) {
       setIsInvalidLinkError = _useState18[1];
 
   var ticketsContainerRef = React.useRef(null);
+  useCookieListener(X_TF_ECOMMERCE, function (value) {
+    return setIsLogged(Boolean(value));
+  });
   React.useEffect(function () {
     if (typeof window !== 'undefined') {
       var access_token = window.localStorage.getItem('access_token');
@@ -5684,6 +5801,18 @@ var TicketsContainer = function TicketsContainer(_ref) {
   React.useEffect(function () {
     !!eventId && getTicketsApi();
   }, [eventId]);
+  React.useEffect(function () {
+    if (isLogged) {
+      fetchUserData().then(function (res) {
+        window.localStorage.setItem('user_data', JSON.stringify(res));
+        onGetProfileDataSuccess(res);
+      })["catch"](function (e) {
+        if (axios.isAxiosError(e)) {
+          onGetProfileDataError(e);
+        }
+      });
+    }
+  }, [isLogged]);
 
   var handleLogout = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
@@ -5752,26 +5881,26 @@ var TicketsContainer = function TicketsContainer(_ref) {
   }
 
   function _getTicketsApi() {
-    _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3(isUpdateingCode, type) {
+    _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee4(isUpdateingCode, type) {
       var _previewKey, response, eventResponse, attributes, _event2;
 
-      return runtime_1.wrap(function _callee3$(_context3) {
+      return runtime_1.wrap(function _callee4$(_context4) {
         while (1) {
-          switch (_context3.prev = _context3.next) {
+          switch (_context4.prev = _context4.next) {
             case 0:
-              _context3.prev = 0;
+              _context4.prev = 0;
               isUpdateingCode ? setCodeIsLoading(true) : setIsLoading(true);
               _previewKey = getQueryVariable('pk') || undefined;
-              _context3.next = 5;
+              _context4.next = 5;
               return getTickets(eventId, code, _previewKey);
 
             case 5:
-              response = _context3.sent;
-              _context3.next = 8;
+              response = _context4.sent;
+              _context4.next = 8;
               return getEvent(eventId, _previewKey);
 
             case 8:
-              eventResponse = _context3.sent;
+              eventResponse = _context4.sent;
 
               if (response.data.success) {
                 attributes = _get(response, 'data.data.attributes');
@@ -5788,32 +5917,36 @@ var TicketsContainer = function TicketsContainer(_ref) {
               if (eventResponse.data.success) {
                 _event2 = _get(eventResponse, 'data.data.attributes');
                 setEvent(_event2);
+
+                if (_event2.country && isWindowDefined) {
+                  window.localStorage.setItem('eventCountry', _event2.country);
+                }
               }
 
-              _context3.next = 16;
+              _context4.next = 16;
               break;
 
             case 13:
-              _context3.prev = 13;
-              _context3.t0 = _context3["catch"](0);
+              _context4.prev = 13;
+              _context4.t0 = _context4["catch"](0);
 
-              if (axios.isAxiosError(_context3.t0)) {
-                onGetTicketsError(_context3.t0);
-                setError(_get(_context3.t0, 'response.data.message'));
+              if (axios.isAxiosError(_context4.t0)) {
+                onGetTicketsError(_context4.t0);
+                setError(_get(_context4.t0, 'response.data.message'));
               }
 
             case 16:
-              _context3.prev = 16;
+              _context4.prev = 16;
               setIsLoading(false);
               setCodeIsLoading(false);
-              return _context3.finish(16);
+              return _context4.finish(16);
 
             case 20:
             case "end":
-              return _context3.stop();
+              return _context4.stop();
           }
         }
-      }, _callee3, null, [[0, 13, 16, 20]]);
+      }, _callee4, null, [[0, 13, 16, 20]]);
     }));
     return _getTicketsApi.apply(this, arguments);
   }
@@ -6012,6 +6145,41 @@ var TicketsContainer = function TicketsContainer(_ref) {
     getTicketsApi(isUpdateingCode, type);
   };
 
+  var fetchUserData = /*#__PURE__*/function () {
+    var _ref5 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3() {
+      var userDataResponse, profileData, profileDataObj;
+      return runtime_1.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              _context3.prev = 0;
+              _context3.next = 3;
+              return getProfileData();
+
+            case 3:
+              userDataResponse = _context3.sent;
+              profileData = _get(userDataResponse, 'data.data');
+              profileDataObj = setLoggedUserData(profileData);
+              return _context3.abrupt("return", profileDataObj);
+
+            case 9:
+              _context3.prev = 9;
+              _context3.t0 = _context3["catch"](0);
+              throw new Error(_context3.t0);
+
+            case 12:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3, null, [[0, 9]]);
+    }));
+
+    return function fetchUserData() {
+      return _ref5.apply(this, arguments);
+    };
+  }();
+
   var isTicketOnSale = _some(tickets, function (item) {
     return item.salesStarted && !item.salesEnded && !item.soldOut;
   });