tf-checkout-react 1.0.76 → 1.0.80

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/api/index.d.ts +1 -0
  2. package/dist/components/billing-info-container/index.d.ts +1 -1
  3. package/dist/components/common/FormikPhoneNumberField.d.ts +1 -1
  4. package/dist/components/countdown/index.d.ts +11 -0
  5. package/dist/components/orderDetailsContainer/ticketsTable.d.ts +13 -1
  6. package/dist/components/paymentContainer/index.d.ts +5 -2
  7. package/dist/components/ticketsContainer/PromoCodeSection.d.ts +2 -1
  8. package/dist/components/ticketsContainer/index.d.ts +9 -1
  9. package/dist/components/waitingList/index.d.ts +1 -2
  10. package/dist/tf-checkout-react.cjs.development.js +410 -154
  11. package/dist/tf-checkout-react.cjs.development.js.map +1 -1
  12. package/dist/tf-checkout-react.cjs.production.min.js +1 -1
  13. package/dist/tf-checkout-react.cjs.production.min.js.map +1 -1
  14. package/dist/tf-checkout-react.esm.js +411 -155
  15. package/dist/tf-checkout-react.esm.js.map +1 -1
  16. package/dist/tf-checkout-styles.css +1 -1
  17. package/dist/utils/downloadPDF.d.ts +1 -0
  18. package/dist/utils/index.d.ts +1 -0
  19. package/package.json +2 -1
  20. package/src/api/index.ts +9 -0
  21. package/src/components/billing-info-container/index.tsx +1 -1
  22. package/src/components/common/CheckboxField.tsx +13 -9
  23. package/src/components/common/CustomField.tsx +2 -2
  24. package/src/components/common/FormikPhoneNumberField.tsx +4 -3
  25. package/src/components/common/SelectField.tsx +2 -2
  26. package/src/components/countdown/index.tsx +89 -0
  27. package/src/components/countdown/style.css +10 -0
  28. package/src/components/loginModal/index.tsx +2 -0
  29. package/src/components/orderDetailsContainer/ticketsTable.tsx +66 -60
  30. package/src/components/paymentContainer/index.tsx +6 -3
  31. package/src/components/stripePayment/index.tsx +3 -3
  32. package/src/components/ticketsContainer/PromoCodeSection.tsx +42 -33
  33. package/src/components/ticketsContainer/TicketsSection.tsx +10 -6
  34. package/src/components/ticketsContainer/index.tsx +188 -70
  35. package/src/components/ticketsContainer/style.css +7 -0
  36. package/src/components/waitingList/index.tsx +3 -9
  37. package/src/components/waitingList/style.css +4 -2
  38. package/src/utils/downloadPDF.tsx +22 -0
  39. package/src/utils/index.ts +2 -1
@@ -44,6 +44,8 @@ var _has = _interopDefault(require('lodash/has'));
44
44
  var FormControl = _interopDefault(require('@mui/material/FormControl'));
45
45
  var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
46
46
  var SVG = _interopDefault(require('react-inlinesvg'));
47
+ var moment = _interopDefault(require('moment-timezone'));
48
+ var privateTheming = require('@mui/private-theming');
47
49
  var Table = _interopDefault(require('@mui/material/Table'));
48
50
  var TableBody = _interopDefault(require('@mui/material/TableBody'));
49
51
  var TableCell = _interopDefault(require('@mui/material/TableCell'));
@@ -994,6 +996,48 @@ var ErrorFocusInternal = /*#__PURE__*/function (_Component) {
994
996
 
995
997
  var ErrorFocus = /*#__PURE__*/formik.connect(ErrorFocusInternal);
996
998
 
999
+ var downloadPDF = function downloadPDF(pdfUrl) {
1000
+ if (typeof window === 'undefined') return;
1001
+ var accessToken = localStorage.getItem('access_token');
1002
+ if (!accessToken) return;
1003
+ fetch(pdfUrl, {
1004
+ headers: {
1005
+ Authorization: "Bearer " + accessToken
1006
+ }
1007
+ }).then( /*#__PURE__*/function () {
1008
+ var _ref = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(response) {
1009
+ var blobValue;
1010
+ return runtime_1.wrap(function _callee$(_context) {
1011
+ while (1) {
1012
+ switch (_context.prev = _context.next) {
1013
+ case 0:
1014
+ _context.next = 2;
1015
+ return response.blob();
1016
+
1017
+ case 2:
1018
+ blobValue = _context.sent;
1019
+ return _context.abrupt("return", blobValue);
1020
+
1021
+ case 4:
1022
+ case "end":
1023
+ return _context.stop();
1024
+ }
1025
+ }
1026
+ }, _callee);
1027
+ }));
1028
+
1029
+ return function (_x) {
1030
+ return _ref.apply(this, arguments);
1031
+ };
1032
+ }()).then(function (blobValue) {
1033
+ var file = new Blob([blobValue], {
1034
+ type: 'application/pdf'
1035
+ });
1036
+ var fileURL = URL.createObjectURL(file);
1037
+ window.open(fileURL);
1038
+ });
1039
+ };
1040
+
997
1041
  var createCheckoutDataBodyWithDefaultHolder = function createCheckoutDataBodyWithDefaultHolder(ticketsQuantity, logedInValues) {
998
1042
  var ticket_holders = [];
999
1043
  var first_name = _get(logedInValues, 'firstName') || _get(logedInValues, 'first_name') || '';
@@ -1134,6 +1178,14 @@ var handleSetAccessToken = function handleSetAccessToken(token) {
1134
1178
  }
1135
1179
  }
1136
1180
  };
1181
+ function getEvent(id) {
1182
+ var response = publicRequest.get("v1/event/" + id, {
1183
+ headers: ttfHeaders
1184
+ })["catch"](function (error) {
1185
+ throw error;
1186
+ });
1187
+ return response;
1188
+ }
1137
1189
  function getTickets(id, promoCode) {
1138
1190
  var response = publicRequest.get("v1/event/" + id + "/tickets/", {
1139
1191
  headers: promoCode ? _extends({}, ttfHeaders, {
@@ -1269,7 +1321,7 @@ var LoginModal = function LoginModal(_ref) {
1269
1321
  },
1270
1322
  onSubmit: function () {
1271
1323
  var _onSubmit = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(_ref2) {
1272
- var email, password, bodyFormData, resAutorize, bodyFormDataToken, resAccessToken, accessToken, profileResponse, profileSpecifiedData, profileDataObj, _e$response, _e$response$data, _error;
1324
+ var email, password, bodyFormData, resAutorize, bodyFormDataToken, resAccessToken, accessToken, profileResponse, profileSpecifiedData, profileDataObj, event, _e$response, _e$response$data, _error;
1273
1325
 
1274
1326
  return runtime_1.wrap(function _callee$(_context) {
1275
1327
  while (1) {
@@ -1348,6 +1400,8 @@ var LoginModal = function LoginModal(_ref) {
1348
1400
  if (typeof window !== 'undefined') {
1349
1401
  window.localStorage.setItem('user_data', JSON.stringify(profileDataObj));
1350
1402
  window.localStorage.setItem('access_token', accessToken);
1403
+ event = new window.CustomEvent('tf-login');
1404
+ window.document.dispatchEvent(event);
1351
1405
  }
1352
1406
 
1353
1407
  onLogin();
@@ -1837,10 +1891,10 @@ var CustomField = function CustomField(_ref) {
1837
1891
  }
1838
1892
  },
1839
1893
  InputLabelProps: {
1840
- sx: customTheme.input
1894
+ sx: customTheme == null ? void 0 : customTheme.input
1841
1895
  },
1842
1896
  inputProps: {
1843
- sx: customTheme.input
1897
+ sx: customTheme == null ? void 0 : customTheme.input
1844
1898
  }
1845
1899
  }, field), isSelectField ? _map(selectOptions, function (option) {
1846
1900
  return React__default.createElement("option", {
@@ -1853,18 +1907,22 @@ var CustomField = function CustomField(_ref) {
1853
1907
 
1854
1908
  var _excluded$1 = ["label", "field", "selectOptions", "theme", "setFieldValue"];
1855
1909
  var CheckboxField = function CheckboxField(_ref) {
1910
+ var _rest$form, _field$name, _rest$form2, _field$name2;
1911
+
1856
1912
  var label = _ref.label,
1857
1913
  field = _ref.field,
1858
1914
  rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
1859
1915
 
1860
1916
  var customTheme = styles.useTheme();
1861
- return React__default.createElement(FormGroup, null, React__default.createElement(FormControlLabel, {
1917
+ return React__default.createElement(material.FormControl, {
1918
+ 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 : ""])
1919
+ }, React__default.createElement(FormGroup, null, React__default.createElement(FormControlLabel, {
1862
1920
  control: React__default.createElement(Checkbox, Object.assign({}, field, rest)),
1863
1921
  label: label,
1864
1922
  componentsProps: {
1865
- typography: customTheme.checkbox
1923
+ typography: customTheme == null ? void 0 : customTheme.checkbox
1866
1924
  }
1867
- }));
1925
+ })), !!(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);
1868
1926
  };
1869
1927
 
1870
1928
  var SelectField = function SelectField(_ref) {
@@ -1886,7 +1944,7 @@ var SelectField = function SelectField(_ref) {
1886
1944
  return React__default.createElement(material.FormControl, {
1887
1945
  fullWidth: true
1888
1946
  }, React__default.createElement(material.InputLabel, {
1889
- style: customTheme.input,
1947
+ style: customTheme == null ? void 0 : customTheme.input,
1890
1948
  htmlFor: field.name,
1891
1949
  error: !!error && isTouched,
1892
1950
  shrink: true
@@ -1905,7 +1963,7 @@ var SelectField = function SelectField(_ref) {
1905
1963
  className: theme
1906
1964
  }
1907
1965
  }, field, {
1908
- style: customTheme.input
1966
+ style: customTheme == null ? void 0 : customTheme.input
1909
1967
  }), _map(selectOptions, function (option) {
1910
1968
  return React__default.createElement("option", {
1911
1969
  key: option.value,
@@ -1998,6 +2056,7 @@ var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
1998
2056
  _ref$form = _ref.form,
1999
2057
  touched = _ref$form.touched,
2000
2058
  errors = _ref$form.errors,
2059
+ initialValues = _ref$form.initialValues,
2001
2060
  setFieldValue = _ref.setFieldValue,
2002
2061
  rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
2003
2062
 
@@ -2007,6 +2066,7 @@ var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
2007
2066
  var customTheme = styles.useTheme();
2008
2067
  return React__default.createElement(MuiPhoneNumber, Object.assign({
2009
2068
  name: 'phone',
2069
+ value: initialValues.phone,
2010
2070
  onChange: function onChange(e) {
2011
2071
  return setFieldValue("phone", removePlusSign(e));
2012
2072
  },
@@ -2018,10 +2078,10 @@ var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
2018
2078
  helperText: isTouched && error,
2019
2079
  fullWidth: true,
2020
2080
  InputLabelProps: {
2021
- sx: customTheme.input
2081
+ sx: customTheme == null ? void 0 : customTheme.input
2022
2082
  },
2023
2083
  InputProps: {
2024
- sx: customTheme.input
2084
+ sx: customTheme == null ? void 0 : customTheme.input
2025
2085
  },
2026
2086
  autoFormat: false
2027
2087
  }, rest));
@@ -2964,7 +3024,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
2964
3024
  }, React__default.createElement("span", {
2965
3025
  className: "card_label_text"
2966
3026
  }, "Card number"), React__default.createElement(reactStripeJs.CardNumberElement, {
2967
- options: _extends({}, options.style, stripeCardOptions),
3027
+ options: _extends({}, options, stripeCardOptions),
2968
3028
  onReady: _identity,
2969
3029
  onChange: _identity,
2970
3030
  onBlur: _identity,
@@ -2974,13 +3034,13 @@ var CheckoutForm = function CheckoutForm(_ref) {
2974
3034
  }, React__default.createElement("span", {
2975
3035
  className: "card_label_text"
2976
3036
  }, "Expiration date"), React__default.createElement(reactStripeJs.CardExpiryElement, {
2977
- options: _extends({}, options.style, stripeCardOptions)
3037
+ options: _extends({}, options, stripeCardOptions)
2978
3038
  })), React__default.createElement("label", {
2979
3039
  className: "cvc_element"
2980
3040
  }, React__default.createElement("span", {
2981
3041
  className: "card_label_text"
2982
3042
  }, "CVC"), React__default.createElement(reactStripeJs.CardCvcElement, {
2983
- options: _extends({}, options.style, stripeCardOptions)
3043
+ options: _extends({}, options, stripeCardOptions)
2984
3044
  })), !disableZipSection && React__default.createElement("label", {
2985
3045
  className: "zip_element"
2986
3046
  }, React__default.createElement("p", {
@@ -3072,7 +3132,8 @@ var PaymentContainer = function PaymentContainer(_ref) {
3072
3132
  stripeCardOptions = _ref$stripeCardOption === void 0 ? {} : _ref$stripeCardOption,
3073
3133
  _ref$disableZipSectio = _ref.disableZipSection,
3074
3134
  disableZipSection = _ref$disableZipSectio === void 0 ? false : _ref$disableZipSectio,
3075
- themeOptions = _ref.themeOptions;
3135
+ themeOptions = _ref.themeOptions,
3136
+ elementsOptions = _ref.elementsOptions;
3076
3137
 
3077
3138
  var _useState = React.useState(initialReviewValues),
3078
3139
  reviewData = _useState[0],
@@ -3293,7 +3354,8 @@ var PaymentContainer = function PaymentContainer(_ref) {
3293
3354
  }, "Please provide your payment information"), showErrorText && React__default.createElement("p", {
3294
3355
  className: "payment_info__error"
3295
3356
  }, errorText), React__default.createElement("div", null, React__default.createElement(reactStripeJs.Elements, {
3296
- stripe: getStripePromise(reviewData)
3357
+ stripe: getStripePromise(reviewData),
3358
+ options: elementsOptions
3297
3359
  }, React__default.createElement(CheckoutForm, {
3298
3360
  stripe_client_secret: _get(reviewData, 'payment_method.stripe_client_secret'),
3299
3361
  total: orderData.total,
@@ -3776,12 +3838,14 @@ var TicketsSection = function TicketsSection(_ref) {
3776
3838
  style: {
3777
3839
  minWidth: 55
3778
3840
  }
3779
- }, React__default.createElement(TicketRow, {
3841
+ }, ticket.salesStarted ? React__default.createElement(TicketRow, {
3780
3842
  ticketTier: ticket,
3781
3843
  prevTicketTier: arr[i - 1],
3782
3844
  selectedTickets: selectedTickets,
3783
3845
  handleTicketSelect: ticketSelect
3784
- }))));
3846
+ }) : React__default.createElement("p", {
3847
+ className: 'ticket-not-started-message'
3848
+ }, "Sales not started"))));
3785
3849
  }));
3786
3850
  };
3787
3851
 
@@ -3801,8 +3865,7 @@ var generateQuantity = function generateQuantity(n) {
3801
3865
  var WaitingList = function WaitingList(_ref) {
3802
3866
  var _ref$tickets = _ref.tickets,
3803
3867
  tickets = _ref$tickets === void 0 ? {} : _ref$tickets,
3804
- eventId = _ref.eventId,
3805
- isPromotionsEnabled = _ref.isPromotionsEnabled;
3868
+ eventId = _ref.eventId;
3806
3869
 
3807
3870
  var _useState = React.useState(false),
3808
3871
  showSuccessMessage = _useState[0],
@@ -3877,9 +3940,7 @@ var WaitingList = function WaitingList(_ref) {
3877
3940
  className: "success-message"
3878
3941
  }, React__default.createElement("p", {
3879
3942
  className: "added-success-message"
3880
- }, "You've been added to the waiting list!"), React__default.createElement("p", null, "You'll be notified if tickets become available.")) : React__default.createElement(React__default.Fragment, null, !isPromotionsEnabled && React__default.createElement("p", {
3881
- className: "no-tickets-text"
3882
- }, "No tickets are currently available for this event."), React__default.createElement("h2", null, "WAITING LIST"), React__default.createElement(formik.Formik, {
3943
+ }, "You've been added to the waiting list!"), React__default.createElement("p", null, "You'll be notified if tickets become available.")) : React__default.createElement(React__default.Fragment, null, React__default.createElement("h2", null, "WAITING LIST"), React__default.createElement(formik.Formik, {
3883
3944
  initialValues: {
3884
3945
  ticketTypeId: '',
3885
3946
  quantity: '',
@@ -3969,10 +4030,37 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
3969
4030
  promoCodeIsApplied = _ref.promoCodeIsApplied,
3970
4031
  showPromoInput = _ref.showPromoInput,
3971
4032
  isPromotionsEnabled = _ref.isPromotionsEnabled,
3972
- isAllTicketsSoldOut = _ref.isAllTicketsSoldOut,
3973
4033
  setPromoCode = _ref.setPromoCode,
3974
4034
  setPromoCodeUpdated = _ref.setPromoCodeUpdated,
3975
- setShowPromoInput = _ref.setShowPromoInput;
4035
+ setShowPromoInput = _ref.setShowPromoInput,
4036
+ isAccessCodeEnabled = _ref.isAccessCodeEnabled;
4037
+
4038
+ var renderInputField = function renderInputField() {
4039
+ return React__default.createElement("div", {
4040
+ className: "promo-code-block"
4041
+ }, React__default.createElement("div", {
4042
+ className: "promo-code-block"
4043
+ }, React__default.createElement("p", {
4044
+ className: "promo-code-text"
4045
+ }, isAccessCodeEnabled ? 'Access code required' : 'Promo code')), React__default.createElement("input", {
4046
+ className: "promo-code-input",
4047
+ placeholder: "",
4048
+ onChange: function onChange(e) {
4049
+ setPromoCode(e.target.value);
4050
+ },
4051
+ onKeyPress: function onKeyPress(event) {
4052
+ if (event.key === 'Enter') {
4053
+ setPromoCodeUpdated(promoCode);
4054
+ }
4055
+ }
4056
+ }), React__default.createElement(Button$1, {
4057
+ className: "promo-submit-button",
4058
+ onClick: function onClick() {
4059
+ setPromoCodeUpdated(promoCode);
4060
+ }
4061
+ }, isAccessCodeEnabled ? 'ENTER' : 'APPLY'));
4062
+ };
4063
+
3976
4064
  return React__default.createElement("div", null, promoCodeIsApplied ? React__default.createElement("div", {
3977
4065
  className: "alert-info"
3978
4066
  }, React__default.createElement(SVG, {
@@ -3980,35 +4068,95 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
3980
4068
  preProcessor: function preProcessor(code) {
3981
4069
  return code.replace(/fill=".*?"/g, 'fill="currentColor"');
3982
4070
  }
3983
- }), React__default.createElement("p", null, "PROMO CODE APPLIED SUCCESSFULLY")) : null, showPromoInput && React__default.createElement("div", {
3984
- className: "promo-code-block"
3985
- }, React__default.createElement("input", {
3986
- placeholder: "Promo Code",
3987
- onChange: function onChange(e) {
3988
- setPromoCode(e.target.value);
3989
- },
3990
- onKeyPress: function onKeyPress(event) {
3991
- if (event.key === 'Enter') {
3992
- setPromoCodeUpdated(promoCode);
3993
- }
3994
- }
3995
- }), React__default.createElement(Button$1, {
3996
- className: "promo-apply-button",
3997
- placeholder: "Promo Code",
3998
- onClick: function onClick() {
3999
- setPromoCodeUpdated(promoCode);
4000
- }
4001
- }, "Apply")), isPromotionsEnabled && !showPromoInput && isAllTicketsSoldOut && React__default.createElement("p", {
4002
- className: "promo-code-text"
4003
- }, "Access code needed"), isPromotionsEnabled && !showPromoInput ? React__default.createElement(Button$1, {
4071
+ }), React__default.createElement("p", {
4072
+ className: "promo-code-success"
4073
+ }, "PROMO CODE APPLIED SUCCESSFULLY")) : null, showPromoInput && !promoCodeIsApplied && renderInputField(), isPromotionsEnabled && !showPromoInput && !isAccessCodeEnabled ? React__default.createElement(Button$1, {
4004
4074
  className: "promo-code-button",
4005
4075
  placeholder: "Promo Codes",
4006
4076
  onClick: function onClick() {
4007
4077
  setShowPromoInput(true);
4008
4078
  }
4009
- }, "Got a promo code? Click here") : null);
4079
+ }, "Got a promo code? Click here") : !isPromotionsEnabled && !showPromoInput && isAccessCodeEnabled && !promoCodeIsApplied ? renderInputField() : null);
4010
4080
  };
4011
4081
 
4082
+ var isTimeExpired = function isTimeExpired(startDate, timezone) {
4083
+ return !moment(startDate).isAfter(moment.tz(moment(), timezone).format('YYYY-MM-DD HH:mm:ss'));
4084
+ };
4085
+
4086
+ function Countdown(_ref) {
4087
+ var startDate = _ref.startDate,
4088
+ _ref$timezone = _ref.timezone,
4089
+ timezone = _ref$timezone === void 0 ? moment.tz.guess() : _ref$timezone,
4090
+ _ref$title = _ref.title,
4091
+ title = _ref$title === void 0 ? '' : _ref$title,
4092
+ _ref$message = _ref.message,
4093
+ message = _ref$message === void 0 ? '' : _ref$message,
4094
+ _ref$callback = _ref.callback,
4095
+ callback = _ref$callback === void 0 ? function () {} : _ref$callback;
4096
+
4097
+ var _useState = React.useState(''),
4098
+ duration = _useState[0],
4099
+ setDuration = _useState[1];
4100
+
4101
+ var _useState2 = React.useState(false),
4102
+ timeExpired = _useState2[0],
4103
+ setTimeExpired = _useState2[1];
4104
+
4105
+ React.useEffect(function () {
4106
+ setTimeExpired(isTimeExpired(startDate, timezone));
4107
+ }, []);
4108
+ React.useEffect(function () {
4109
+ var timer;
4110
+
4111
+ if (!timeExpired) {
4112
+ timer = setInterval(function () {
4113
+ if (isTimeExpired(startDate, timezone)) {
4114
+ clearInterval(timer);
4115
+ setTimeExpired(true);
4116
+ callback();
4117
+ }
4118
+
4119
+ var currentDate = moment.tz(moment(), timezone).format('YYYY-MM-DD HH:mm:ss');
4120
+ var diffTime = moment(startDate).diff(currentDate);
4121
+ var duration = moment.duration(diffTime);
4122
+ var dateArr = {
4123
+ year: duration.years(),
4124
+ month: duration.months(),
4125
+ day: duration.days(),
4126
+ hour: duration.hours(),
4127
+ minute: duration.minutes(),
4128
+ second: duration.seconds()
4129
+ };
4130
+ var timeLeft = '';
4131
+
4132
+ for (var date in dateArr) {
4133
+ var unit = dateArr[date] === 1 ? date : date + 's';
4134
+ var val = String(dateArr[date]).length === 1 ? '0' + dateArr[date] : dateArr[date];
4135
+
4136
+ if (timeLeft) {
4137
+ timeLeft += ", " + val + " " + unit;
4138
+ } else if (dateArr[date]) {
4139
+ timeLeft += val + " " + unit;
4140
+ }
4141
+ }
4142
+
4143
+ setDuration(timeLeft);
4144
+ }, 1000);
4145
+ }
4146
+
4147
+ return function () {
4148
+ clearInterval(timer);
4149
+ };
4150
+ }, [timeExpired]);
4151
+ return React__default.createElement(React__default.Fragment, null, !timeExpired && duration && React__default.createElement("div", {
4152
+ className: 'countdown'
4153
+ }, React__default.createElement("div", null, React__default.createElement("p", {
4154
+ className: 'title'
4155
+ }, title), React__default.createElement("p", null, duration)), React__default.createElement("p", {
4156
+ className: 'message'
4157
+ }, message)));
4158
+ }
4159
+
4012
4160
  function Loader$1() {
4013
4161
  return React__default.createElement("div", {
4014
4162
  className: "loader-container"
@@ -4016,7 +4164,8 @@ function Loader$1() {
4016
4164
  }
4017
4165
 
4018
4166
  var TicketsContainer = function TicketsContainer(_ref) {
4019
- var getTicketsLabel = _ref.getTicketsLabel,
4167
+ var onLoginSuccess = _ref.onLoginSuccess,
4168
+ getTicketsLabel = _ref.getTicketsLabel,
4020
4169
  eventId = _ref.eventId,
4021
4170
  onAddToCartSuccess = _ref.onAddToCartSuccess,
4022
4171
  _ref$contentStyle = _ref.contentStyle,
@@ -4032,43 +4181,60 @@ var TicketsContainer = function TicketsContainer(_ref) {
4032
4181
  _ref$queryPromoCode = _ref.queryPromoCode,
4033
4182
  queryPromoCode = _ref$queryPromoCode === void 0 ? '' : _ref$queryPromoCode,
4034
4183
  _ref$isPromotionsEnab = _ref.isPromotionsEnabled,
4035
- isPromotionsEnabled = _ref$isPromotionsEnab === void 0 ? true : _ref$isPromotionsEnab;
4184
+ isPromotionsEnabled = _ref$isPromotionsEnab === void 0 ? true : _ref$isPromotionsEnab,
4185
+ themeOptions = _ref.themeOptions,
4186
+ _ref$isAccessCodeEnab = _ref.isAccessCodeEnabled,
4187
+ isAccessCodeEnabled = _ref$isAccessCodeEnab === void 0 ? false : _ref$isAccessCodeEnab;
4036
4188
 
4037
4189
  var _useState = React.useState({}),
4038
4190
  selectedTickets = _useState[0],
4039
4191
  setSelectedTickets = _useState[1];
4040
4192
 
4041
- var _useState2 = React.useState([]),
4042
- tickets = _useState2[0],
4043
- setTickets = _useState2[1];
4193
+ var isWindowDefined = typeof window !== 'undefined';
4044
4194
 
4045
- var _useState3 = React.useState(false),
4046
- showWaitingList = _useState3[0],
4047
- setShowWaitingList = _useState3[1];
4195
+ var _useState2 = React.useState(isWindowDefined ? !!window.localStorage.getItem('access_token') : false),
4196
+ isLogged = _useState2[0],
4197
+ setIsLogged = _useState2[1];
4048
4198
 
4049
- var _useState4 = React.useState(false),
4050
- isLoading = _useState4[0],
4051
- setIsLoading = _useState4[1];
4199
+ var _React$useState = React__default.useState(false),
4200
+ showLoginModal = _React$useState[0],
4201
+ setShowLoginModal = _React$useState[1];
4202
+
4203
+ var _useState3 = React.useState([]),
4204
+ tickets = _useState3[0],
4205
+ setTickets = _useState3[1];
4206
+
4207
+ var _useState4 = React.useState(null),
4208
+ event = _useState4[0],
4209
+ setEvent = _useState4[1];
4052
4210
 
4053
4211
  var _useState5 = React.useState(false),
4054
- handleBookIsLoading = _useState5[0],
4055
- setHandleBookIsLoading = _useState5[1];
4212
+ showWaitingList = _useState5[0],
4213
+ setShowWaitingList = _useState5[1];
4214
+
4215
+ var _useState6 = React.useState(false),
4216
+ isLoading = _useState6[0],
4217
+ setIsLoading = _useState6[1];
4056
4218
 
4057
- var _useState6 = React.useState(''),
4058
- promoCode = _useState6[0],
4059
- setPromoCode = _useState6[1];
4219
+ var _useState7 = React.useState(false),
4220
+ handleBookIsLoading = _useState7[0],
4221
+ setHandleBookIsLoading = _useState7[1];
4060
4222
 
4061
- var _useState7 = React.useState(queryPromoCode),
4062
- promoCodeUpdated = _useState7[0],
4063
- setPromoCodeUpdated = _useState7[1];
4223
+ var _useState8 = React.useState(''),
4224
+ promoCode = _useState8[0],
4225
+ setPromoCode = _useState8[1];
4064
4226
 
4065
- var _useState8 = React.useState(false),
4066
- showPromoInput = _useState8[0],
4067
- setShowPromoInput = _useState8[1];
4227
+ var _useState9 = React.useState(queryPromoCode),
4228
+ promoCodeUpdated = _useState9[0],
4229
+ setPromoCodeUpdated = _useState9[1];
4068
4230
 
4069
- var _useState9 = React.useState(false),
4070
- promoCodeIsApplied = _useState9[0],
4071
- setPromoCodeIsApplied = _useState9[1];
4231
+ var _useState10 = React.useState(false),
4232
+ showPromoInput = _useState10[0],
4233
+ setShowPromoInput = _useState10[1];
4234
+
4235
+ var _useState11 = React.useState(false),
4236
+ promoCodeIsApplied = _useState11[0],
4237
+ setPromoCodeIsApplied = _useState11[1];
4072
4238
 
4073
4239
  React.useEffect(function () {
4074
4240
  if (typeof window !== 'undefined') {
@@ -4085,62 +4251,102 @@ var TicketsContainer = function TicketsContainer(_ref) {
4085
4251
  }
4086
4252
  }, []);
4087
4253
  React.useEffect(function () {
4088
- function getTicketsApi() {
4089
- return _getTicketsApi.apply(this, arguments);
4090
- }
4254
+ getTicketsApi();
4255
+ }, [eventId, promoCodeUpdated]);
4091
4256
 
4092
- function _getTicketsApi() {
4093
- _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
4094
- var response, attributes;
4095
- return runtime_1.wrap(function _callee$(_context) {
4096
- while (1) {
4097
- switch (_context.prev = _context.next) {
4098
- case 0:
4099
- _context.prev = 0;
4100
- setIsLoading(true);
4101
- _context.next = 4;
4102
- return getTickets(eventId, promoCodeUpdated);
4103
-
4104
- case 4:
4105
- response = _context.sent;
4106
-
4107
- if (response.data.success) {
4108
- setCustomHeader(response);
4109
- attributes = _get(response, 'data.data.attributes');
4110
- setPromoCodeIsApplied(attributes.ValidPromoCode);
4111
- setTickets(_get(attributes, 'tickets'));
4112
- setShowWaitingList(attributes.showWaitingList);
4113
- onGetTicketsSuccess(response.data);
4114
- }
4257
+ var handleLogout = function handleLogout() {
4258
+ if (isWindowDefined) {
4259
+ window.localStorage.removeItem('access_token');
4260
+ window.localStorage.removeItem('user_data');
4261
+ setIsLogged(false);
4115
4262
 
4116
- _context.next = 11;
4117
- break;
4263
+ var _event = new window.CustomEvent('tf-logout');
4118
4264
 
4119
- case 8:
4120
- _context.prev = 8;
4121
- _context.t0 = _context["catch"](0);
4265
+ window.document.dispatchEvent(_event);
4266
+ }
4267
+ };
4122
4268
 
4123
- if (axios.isAxiosError(_context.t0)) {
4124
- onGetTicketsError(_context.t0);
4125
- }
4269
+ var handleExternalLogin = function handleExternalLogin() {
4270
+ setIsLogged(true);
4271
+ };
4126
4272
 
4127
- case 11:
4128
- _context.prev = 11;
4129
- setIsLoading(false);
4130
- return _context.finish(11);
4273
+ var handleOnClose = function handleOnClose() {
4274
+ setShowLoginModal(false);
4275
+ };
4131
4276
 
4132
- case 14:
4133
- case "end":
4134
- return _context.stop();
4135
- }
4136
- }
4137
- }, _callee, null, [[0, 8, 11, 14]]);
4138
- }));
4139
- return _getTicketsApi.apply(this, arguments);
4277
+ var handleOnLogin = function handleOnLogin() {
4278
+ setShowLoginModal(false);
4279
+ setIsLogged(true);
4280
+
4281
+ if (onLoginSuccess) {
4282
+ onLoginSuccess();
4140
4283
  }
4284
+ };
4141
4285
 
4142
- getTicketsApi();
4143
- }, [eventId, promoCodeUpdated]);
4286
+ function getTicketsApi() {
4287
+ return _getTicketsApi.apply(this, arguments);
4288
+ }
4289
+
4290
+ function _getTicketsApi() {
4291
+ _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
4292
+ var response, eventResponse, attributes, _event2;
4293
+
4294
+ return runtime_1.wrap(function _callee2$(_context2) {
4295
+ while (1) {
4296
+ switch (_context2.prev = _context2.next) {
4297
+ case 0:
4298
+ _context2.prev = 0;
4299
+ setIsLoading(true);
4300
+ _context2.next = 4;
4301
+ return getTickets(eventId, promoCodeUpdated);
4302
+
4303
+ case 4:
4304
+ response = _context2.sent;
4305
+ _context2.next = 7;
4306
+ return getEvent(eventId);
4307
+
4308
+ case 7:
4309
+ eventResponse = _context2.sent;
4310
+
4311
+ if (response.data.success) {
4312
+ setCustomHeader(response);
4313
+ attributes = _get(response, 'data.data.attributes');
4314
+ setPromoCodeIsApplied(attributes.ValidPromoCode);
4315
+ setTickets(_get(attributes, 'tickets'));
4316
+ setShowWaitingList(attributes.showWaitingList);
4317
+ onGetTicketsSuccess(response.data);
4318
+ }
4319
+
4320
+ if (eventResponse.data.success) {
4321
+ _event2 = _get(eventResponse, 'data.data.attributes');
4322
+ setEvent(_event2);
4323
+ }
4324
+
4325
+ _context2.next = 15;
4326
+ break;
4327
+
4328
+ case 12:
4329
+ _context2.prev = 12;
4330
+ _context2.t0 = _context2["catch"](0);
4331
+
4332
+ if (axios.isAxiosError(_context2.t0)) {
4333
+ onGetTicketsError(_context2.t0);
4334
+ }
4335
+
4336
+ case 15:
4337
+ _context2.prev = 15;
4338
+ setIsLoading(false);
4339
+ return _context2.finish(15);
4340
+
4341
+ case 18:
4342
+ case "end":
4343
+ return _context2.stop();
4344
+ }
4345
+ }
4346
+ }, _callee2, null, [[0, 12, 15, 18]]);
4347
+ }));
4348
+ return _getTicketsApi.apply(this, arguments);
4349
+ }
4144
4350
 
4145
4351
  var handleTicketSelect = function handleTicketSelect(key, value) {
4146
4352
  setSelectedTickets(function (prevState) {
@@ -4154,15 +4360,21 @@ var TicketsContainer = function TicketsContainer(_ref) {
4154
4360
  });
4155
4361
  };
4156
4362
 
4363
+ var handleOrdersClick = function handleOrdersClick() {
4364
+ if (isWindowDefined) {
4365
+ window.location.href = '/orders';
4366
+ }
4367
+ };
4368
+
4157
4369
  var handleBook = /*#__PURE__*/function () {
4158
- var _ref3 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
4370
+ var _ref3 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
4159
4371
  var _product_options, _product_options2, _ticket_types;
4160
4372
 
4161
- 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, skipBillingPage, nameIsRequired, ageIsRequired, hash, isWindowDefined, userData, access_token, ticketsQuantity, checkoutBody, checkoutResult;
4373
+ 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, skipBillingPage, nameIsRequired, ageIsRequired, hash, _isWindowDefined, userData, access_token, ticketsQuantity, checkoutBody, checkoutResult;
4162
4374
 
4163
- return runtime_1.wrap(function _callee2$(_context2) {
4375
+ return runtime_1.wrap(function _callee$(_context) {
4164
4376
  while (1) {
4165
- switch (_context2.prev = _context2.next) {
4377
+ switch (_context.prev = _context.next) {
4166
4378
  case 0:
4167
4379
  setHandleBookIsLoading(true);
4168
4380
  ticket = _find(tickets, function (item) {
@@ -4183,15 +4395,15 @@ var TicketsContainer = function TicketsContainer(_ref) {
4183
4395
  }, _ticket_types)
4184
4396
  }
4185
4397
  };
4186
- _context2.prev = 6;
4187
- _context2.next = 9;
4398
+ _context.prev = 6;
4399
+ _context.next = 9;
4188
4400
  return addToCart(eventId, data);
4189
4401
 
4190
4402
  case 9:
4191
- result = _context2.sent;
4403
+ result = _context.sent;
4192
4404
 
4193
4405
  if (!(result.status === 200)) {
4194
- _context2.next = 27;
4406
+ _context.next = 27;
4195
4407
  break;
4196
4408
  }
4197
4409
 
@@ -4202,21 +4414,21 @@ var TicketsContainer = function TicketsContainer(_ref) {
4202
4414
  hash = '';
4203
4415
 
4204
4416
  if (!skipBillingPage) {
4205
- _context2.next = 26;
4417
+ _context.next = 26;
4206
4418
  break;
4207
4419
  }
4208
4420
 
4209
4421
  // Get user data for checkout data
4210
- isWindowDefined = typeof window !== 'undefined';
4211
- userData = isWindowDefined && window.localStorage.getItem('user_data') ? JSON.parse(window.localStorage.getItem('user_data') || '') : {};
4212
- access_token = isWindowDefined && window.localStorage.getItem('access_token') ? window.localStorage.getItem('access_token') || '' : '';
4422
+ _isWindowDefined = typeof window !== 'undefined';
4423
+ userData = _isWindowDefined && window.localStorage.getItem('user_data') ? JSON.parse(window.localStorage.getItem('user_data') || '') : {};
4424
+ access_token = _isWindowDefined && window.localStorage.getItem('access_token') ? window.localStorage.getItem('access_token') || '' : '';
4213
4425
  ticketsQuantity = Object.keys(selectedTickets).length;
4214
4426
  checkoutBody = createCheckoutDataBodyWithDefaultHolder(ticketsQuantity, userData);
4215
- _context2.next = 24;
4427
+ _context.next = 24;
4216
4428
  return postOnCheckout(checkoutBody, access_token);
4217
4429
 
4218
4430
  case 24:
4219
- checkoutResult = _context2.sent;
4431
+ checkoutResult = _context.sent;
4220
4432
  hash = _get(checkoutResult, 'data.data.attributes.hash');
4221
4433
 
4222
4434
  case 26:
@@ -4229,28 +4441,28 @@ var TicketsContainer = function TicketsContainer(_ref) {
4229
4441
  });
4230
4442
 
4231
4443
  case 27:
4232
- _context2.next = 32;
4444
+ _context.next = 32;
4233
4445
  break;
4234
4446
 
4235
4447
  case 29:
4236
- _context2.prev = 29;
4237
- _context2.t0 = _context2["catch"](6);
4448
+ _context.prev = 29;
4449
+ _context.t0 = _context["catch"](6);
4238
4450
 
4239
- if (axios.isAxiosError(_context2.t0)) {
4240
- onAddToCartError(_context2.t0);
4451
+ if (axios.isAxiosError(_context.t0)) {
4452
+ onAddToCartError(_context.t0);
4241
4453
  }
4242
4454
 
4243
4455
  case 32:
4244
- _context2.prev = 32;
4456
+ _context.prev = 32;
4245
4457
  setHandleBookIsLoading(false);
4246
- return _context2.finish(32);
4458
+ return _context.finish(32);
4247
4459
 
4248
4460
  case 35:
4249
4461
  case "end":
4250
- return _context2.stop();
4462
+ return _context.stop();
4251
4463
  }
4252
4464
  }
4253
- }, _callee2, null, [[6, 29, 32, 35]]);
4465
+ }, _callee, null, [[6, 29, 32, 35]]);
4254
4466
  }));
4255
4467
 
4256
4468
  return function handleBook() {
@@ -4258,10 +4470,29 @@ var TicketsContainer = function TicketsContainer(_ref) {
4258
4470
  };
4259
4471
  }();
4260
4472
 
4473
+ var updateTickets = function updateTickets() {
4474
+ getTicketsApi();
4475
+ };
4476
+
4261
4477
  var isAllTicketsSoldOut = !_some(tickets, function (item) {
4262
4478
  return !(item.sold_out || item.soldOut);
4263
4479
  });
4264
- return React__default.createElement("div", {
4480
+ var themeMui = material.createTheme(themeOptions);
4481
+ React.useEffect(function () {
4482
+ isWindowDefined && window.document.addEventListener('custom-logout', handleLogout);
4483
+ return function () {
4484
+ isWindowDefined && window.document.removeEventListener('custom-logout', handleLogout);
4485
+ };
4486
+ }, []);
4487
+ React.useEffect(function () {
4488
+ isWindowDefined && window.document.addEventListener('custom-login', handleExternalLogin);
4489
+ return function () {
4490
+ isWindowDefined && window.document.removeEventListener('custom-login', handleExternalLogin);
4491
+ };
4492
+ }, []);
4493
+ return React__default.createElement(privateTheming.ThemeProvider, {
4494
+ theme: themeMui
4495
+ }, React__default.createElement("div", {
4265
4496
  className: "get-tickets-page " + theme,
4266
4497
  style: contentStyle
4267
4498
  }, isLoading ? React__default.createElement(Loader$1, null) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
@@ -4269,10 +4500,15 @@ var TicketsContainer = function TicketsContainer(_ref) {
4269
4500
  selectedTickets: selectedTickets,
4270
4501
  handleTicketSelect: handleTicketSelect,
4271
4502
  promoCodeIsApplied: promoCodeIsApplied
4272
- }), showWaitingList && React__default.createElement(WaitingList, {
4503
+ }), event != null && event.salesEnded ? React__default.createElement("p", null, "Sales for this event are closed.") : event != null && event.salesStart ? React__default.createElement(Countdown, {
4504
+ startDate: event.salesStart,
4505
+ timezone: event.timezone,
4506
+ title: "Sales start in:",
4507
+ message: "No tickets are currently available for this event.",
4508
+ callback: updateTickets
4509
+ }) : null, showWaitingList && event.salesStarted && React__default.createElement(WaitingList, {
4273
4510
  tickets: tickets,
4274
- eventId: eventId,
4275
- isPromotionsEnabled: isPromotionsEnabled
4511
+ eventId: eventId
4276
4512
  }), React__default.createElement(PromoCodeSection, {
4277
4513
  promoCode: promoCode,
4278
4514
  promoCodeIsApplied: promoCodeIsApplied,
@@ -4281,12 +4517,30 @@ var TicketsContainer = function TicketsContainer(_ref) {
4281
4517
  setPromoCodeUpdated: setPromoCodeUpdated,
4282
4518
  setShowPromoInput: setShowPromoInput,
4283
4519
  isPromotionsEnabled: isPromotionsEnabled,
4520
+ isAccessCodeEnabled: isAccessCodeEnabled,
4284
4521
  isAllTicketsSoldOut: isAllTicketsSoldOut
4285
4522
  }), !isAllTicketsSoldOut && React__default.createElement(Button$1, {
4286
4523
  "aria-hidden": true,
4287
4524
  className: "book-button " + (handleBookIsLoading || _isEmpty(selectedTickets) || Object.values(selectedTickets)[0] === 0 ? 'disabled' : ''),
4288
4525
  onClick: !handleBookIsLoading && !_isEmpty(selectedTickets) && Object.values(selectedTickets)[0] > 0 ? handleBook : function () {}
4289
- }, getTicketsLabel || 'GET TICKETS')));
4526
+ }, getTicketsLabel || 'GET TICKETS'), isLogged ? React__default.createElement("div", {
4527
+ className: "session-wrapper"
4528
+ }, React__default.createElement("span", {
4529
+ className: "session-container"
4530
+ }, React__default.createElement(Button$1, {
4531
+ variant: "outline-light",
4532
+ className: "session-buttons",
4533
+ onClick: handleOrdersClick
4534
+ }, "My Orders")), React__default.createElement("span", {
4535
+ className: "session-container"
4536
+ }, React__default.createElement(Button$1, {
4537
+ variant: "outline-light",
4538
+ className: "session-buttons",
4539
+ onClick: handleLogout
4540
+ }, "Log out"))) : ''), showLoginModal ? React__default.createElement(LoginModal, {
4541
+ onClose: handleOnClose,
4542
+ onLogin: handleOnLogin
4543
+ }) : null));
4290
4544
  };
4291
4545
 
4292
4546
  var EventInfoItem = function EventInfoItem(_ref) {
@@ -4494,9 +4748,9 @@ var TicketsTable = function TicketsTable(_ref) {
4494
4748
  var _ref$tickets = _ref.tickets,
4495
4749
  tickets = _ref$tickets === void 0 ? [] : _ref$tickets;
4496
4750
  return React__default.createElement("div", {
4497
- className: 'tickets-box'
4751
+ className: "tickets-box"
4498
4752
  }, React__default.createElement("h4", {
4499
- className: 'sub-title'
4753
+ className: "sub-title"
4500
4754
  }, "Your Tickets"), React__default.createElement(TableContainer, {
4501
4755
  component: Paper
4502
4756
  }, React__default.createElement(Table, {
@@ -4506,14 +4760,16 @@ var TicketsTable = function TicketsTable(_ref) {
4506
4760
 
4507
4761
  return React__default.createElement(React.Fragment, {
4508
4762
  key: index
4509
- }, 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("a", {
4510
- className: 'download-button',
4511
- href: ticket.pdf_link,
4512
- download: true
4763
+ }, 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", {
4764
+ "aria-hidden": true,
4765
+ className: "download-button",
4766
+ onClick: function onClick() {
4767
+ return downloadPDF(ticket.pdf_link);
4768
+ }
4513
4769
  }, "Download"))), !!((_ticket$add_ons = ticket.add_ons) != null && _ticket$add_ons.length) && React__default.createElement(TableRow, null, React__default.createElement(TableCell, {
4514
4770
  colSpan: 5
4515
4771
  }, React__default.createElement(Table, {
4516
- className: 'ticket-add-on-table'
4772
+ className: "ticket-add-on-table"
4517
4773
  }, React__default.createElement(TableHead, null, React__default.createElement(TableRow, null, React__default.createElement(TableCell, null, "Add-On"), React__default.createElement(TableCell, null, "Status"))), React__default.createElement(TableBody, null, ticket.add_ons.map(function (add_on, index) {
4518
4774
  return React__default.createElement(TableRow, {
4519
4775
  key: index