tf-checkout-react 1.0.96-beta.0 → 1.0.99-beta.0

package/dist/api/index.d.ts

@@ -1,4 +1,4 @@
-import { AxiosInstance } from 'axios';
+import { AxiosInstance, AxiosResponse } from 'axios';
 interface IPublicRequest extends AxiosInstance {
     setGuestToken: (token: string) => void;
     setAccessToken: (token: string) => void;
@@ -7,29 +7,28 @@ interface IPublicRequest extends AxiosInstance {
 export declare const publicRequest: IPublicRequest;
 export declare const setXSourceOrigin: (sourceOrigin: string) => void;
 export declare const setCustomHeader: (response: any) => void;
-export declare const handleSetAccessToken: (token: any) => void;
-export declare function getEvent(id: string | number): Promise<import("axios").AxiosResponse<any, any>>;
-export declare function getTickets(id: string | number, promoCode: string): Promise<import("axios").AxiosResponse<any, any>>;
-export declare const addToCart: (id: string | number, data: any) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getCart: () => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const postOnCheckout: (data: any, accessToken: string) => Promise<import("axios").AxiosResponse<any, any>>;
+export declare function getEvent(id: string | number): Promise<AxiosResponse<any, any>>;
+export declare function getTickets(id: string | number, promoCode: string): Promise<AxiosResponse<any, any>>;
+export declare const addToCart: (id: string | number, data: any) => Promise<AxiosResponse<any, any>>;
+export declare const getCart: () => Promise<AxiosResponse<any, any>>;
+export declare const postOnCheckout: (data: any, accessToken?: string | undefined) => Promise<AxiosResponse<any, any>>;
 export declare const authorize: (data: {
     email: string;
     password: string;
-}) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const register: (data: FormData) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getAccessToken: (data: FormData) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getPaymentData: (hash: string) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const handlePaymentData: (orderHash: string, data: any) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const handlePaymentSuccess: (orderHash: string) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const handleFreeSuccess: (orderHash: string) => Promise<import("axios").AxiosResponse<any, any>>;
+}) => Promise<AxiosResponse<any, any>>;
+export declare const register: (data: FormData) => Promise<AxiosResponse<any, any>>;
+export declare const getAccessToken: (data: FormData) => Promise<AxiosResponse<any, any>>;
+export declare const getPaymentData: (hash: string) => Promise<AxiosResponse<any, any>>;
+export declare const handlePaymentData: (orderHash: string, data: any) => Promise<AxiosResponse<any, any>>;
+export declare const handlePaymentSuccess: (orderHash: string) => Promise<AxiosResponse<any, any>>;
+export declare const handleFreeSuccess: (orderHash: string) => Promise<AxiosResponse<any, any>>;
 export declare const getProfileData: (accessToken?: string | undefined) => Promise<any>;
-export declare const getCountries: () => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getConfirmationData: (orderHash: string) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getStates: (countryId: string) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getOrders: (page: number, limit: number, eventSlug: string) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getOrderDetails: (orderId: string) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const addToWaitingList: (id: number, data: any) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const getConditions: (eventId: string) => Promise<import("axios").AxiosResponse<any, any>>;
-export declare const postReferralVisits: (eventId: string, referralId: string) => Promise<import("axios").AxiosResponse<any, any>>;
+export declare const getCountries: () => Promise<AxiosResponse<any, any>>;
+export declare const getConfirmationData: (orderHash: string) => Promise<AxiosResponse<any, any>>;
+export declare const getStates: (countryId: string) => Promise<AxiosResponse<any, any>>;
+export declare const getOrders: (page: number, limit: number, eventSlug: string) => Promise<AxiosResponse<any, any>>;
+export declare const getOrderDetails: (orderId: string) => Promise<AxiosResponse<any, any>>;
+export declare const addToWaitingList: (id: number, data: any) => Promise<AxiosResponse<any, any>>;
+export declare const getConditions: (eventId: string) => Promise<AxiosResponse<any, any>>;
+export declare const postReferralVisits: (eventId: string, referralId: string) => Promise<AxiosResponse<any, any>>;
 export {};

package/dist/components/billing-info-container/index.d.ts

@@ -9,10 +9,7 @@ export interface IBillingInfoPage {
     data?: IBillingInfoData[];
     ticketHoldersFields?: IBillingInfoData;
     handleSubmit?: (values: FormikValues, formikHelpers: FormikHelpers<FormikValues>, eventId: any, res: any) => void;
-    onRegisterSuccess?: (value: {
-        accessToken: string;
-        refreshToken: string;
-    }) => void;
+    onRegisterSuccess?: () => void;
     onRegisterError?: (e: AxiosError, email: string) => void;
     onSubmitError?: (e: AxiosError) => void;
     onGetCartSuccess?: (res: any) => void;
@@ -42,5 +39,6 @@ export interface IBillingInfoPage {
     onSkipBillingPage: (data: any) => void;
     skipPage?: boolean;
     canSkipHolderNames?: boolean;
+    shouldFetchCountries?: boolean;
 }
-export declare const BillingInfoContainer: ({ data, ticketHoldersFields, initialValues, buttonName, handleSubmit, theme, onRegisterSuccess, onRegisterError, onSubmitError, onGetCartSuccess, onGetCartError, onGetCountriesSuccess, onGetCountriesError, onGetStatesSuccess, onGetStatesError, onGetProfileDataSuccess, onGetProfileDataError, onAuthorizeSuccess, onAuthorizeError, onLogin, onLoginSuccess, isLoggedIn: pIsLoggedIn, accountInfoTitle, hideLogo, themeOptions, onErrorClose, hideErrorsAlertSection, onSkipBillingPage, skipPage, canSkipHolderNames }: IBillingInfoPage) => JSX.Element;
+export declare const BillingInfoContainer: ({ data, ticketHoldersFields, initialValues, buttonName, handleSubmit, theme, onRegisterSuccess, onRegisterError, onSubmitError, onGetCartSuccess, onGetCartError, onGetCountriesSuccess, onGetCountriesError, onGetStatesSuccess, onGetStatesError, onGetProfileDataSuccess, onGetProfileDataError, onAuthorizeSuccess, onAuthorizeError, onLogin, onLoginSuccess, isLoggedIn: pIsLoggedIn, accountInfoTitle, hideLogo, themeOptions, onErrorClose, hideErrorsAlertSection, onSkipBillingPage, skipPage, canSkipHolderNames, shouldFetchCountries, }: IBillingInfoPage) => JSX.Element;

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

@@ -5,7 +5,8 @@ interface CountdownTypes {
     timezone?: string;
     title?: string;
     message?: string;
+    showMessage?: boolean;
     callback?: () => void;
 }
-declare function Countdown({ startDate, timezone, title, message, callback }: CountdownTypes): JSX.Element;
+declare function Countdown({ startDate, timezone, title, message, showMessage, callback }: CountdownTypes): JSX.Element;
 export default Countdown;

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

@@ -37,5 +37,5 @@ export interface ITicket {
 export interface ISelectedTickets {
     [key: string]: string | number;
 }
-export declare const TicketsContainer: ({ onLoginSuccess, getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, theme, queryPromoCode, isPromotionsEnabled, themeOptions, isAccessCodeEnabled, hideSessionButtons, hideWaitingList }: IGetTickets) => JSX.Element;
+export declare const TicketsContainer: ({ onLoginSuccess, getTicketsLabel, eventId, onAddToCartSuccess, contentStyle, onAddToCartError, onGetTicketsSuccess, onGetTicketsError, theme, queryPromoCode, isPromotionsEnabled, themeOptions, isAccessCodeEnabled, hideSessionButtons, hideWaitingList, }: IGetTickets) => JSX.Element;
 export {};

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

@@ -1113,9 +1113,12 @@ function setCustomCookie(name, value, days) {
     expires = '; expires=' + date.toUTCString();
   }
 
-  document.cookie = name + '=' + (value || '') + expires + '; path=/';
+  if (document) {
+    document.cookie = name + '=' + (value || '') + expires + '; path=/';
+  }
 }
 function getCookieByName(cname) {
+  if (!document) return '';
   var name = cname + '=';
   var ca = document.cookie.split(';');
 
@@ -1134,7 +1137,9 @@ function getCookieByName(cname) {
   return '';
 }
 function deleteCookieByName(name) {
-  document.cookie = name + '=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
+  if (document) {
+    document.cookie = name + '=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
+  }
 }
 
 var isWindowDefined = typeof window !== 'undefined';
@@ -1218,6 +1223,15 @@ publicRequest.interceptors.request.use(function (config) {
 
   return config;
 });
+publicRequest.interceptors.response.use(function (response) {
+  var xtfCookie = _get(response, 'headers.x-tf-ecommerce');
+
+  if (xtfCookie) {
+    setCustomCookie('X-TF-ECOMMERCE', xtfCookie);
+  }
+
+  return response;
+});
 
 publicRequest.setGuestToken = function (token) {
   return publicRequest.defaults.headers.common['Authorization-Guest'] = token;
@@ -1248,14 +1262,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
@@ -1404,7 +1410,7 @@ var LoginModal = function LoginModal(_ref) {
     },
     onSubmit: function () {
       var _onSubmit = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(_ref2) {
-        var email, password, body, resAutorize, xtfCookie, 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) {
@@ -1420,23 +1426,20 @@ var LoginModal = function LoginModal(_ref) {
                 return authorize(body);
 
               case 5:
-                resAutorize = _context.sent;
-                xtfCookie = _get(resAutorize, 'headers.x-tf-ecommerce');
-                setCustomCookie('X-TF-ECOMMERCE', xtfCookie);
                 profileResponse = null;
-                _context.prev = 9;
-                _context.next = 12;
+                _context.prev = 6;
+                _context.next = 9;
                 return getProfileData();
 
-              case 12:
+              case 9:
                 profileResponse = _context.sent;
                 onGetProfileDataSuccess(profileResponse.data);
-                _context.next = 20;
+                _context.next = 17;
                 break;
 
-              case 16:
-                _context.prev = 16;
-                _context.t0 = _context["catch"](9);
+              case 13:
+                _context.prev = 13;
+                _context.t0 = _context["catch"](6);
 
                 if (axios.isAxiosError(_context.t0)) {
                   onGetProfileDataError(_context.t0);
@@ -1444,7 +1447,7 @@ var LoginModal = function LoginModal(_ref) {
 
                 return _context.abrupt("return");
 
-              case 20:
+              case 17:
                 profileSpecifiedData = _get(profileResponse, 'data.data');
                 profileDataObj = {
                   id: profileSpecifiedData.id,
@@ -1460,11 +1463,11 @@ var LoginModal = function LoginModal(_ref) {
                 }
 
                 onLogin();
-                _context.next = 29;
+                _context.next = 26;
                 break;
 
-              case 26:
-                _context.prev = 26;
+              case 23:
+                _context.prev = 23;
                 _context.t1 = _context["catch"](1);
 
                 if (axios.isAxiosError(_context.t1)) {
@@ -1474,12 +1477,12 @@ var LoginModal = function LoginModal(_ref) {
                   setError((_context.t1 == null ? void 0 : _context.t1.message) || 'Error');
                 }
 
-              case 29:
+              case 26:
               case "end":
                 return _context.stop();
             }
           }
-        }, _callee, null, [[1, 26], [9, 16]]);
+        }, _callee, null, [[1, 23], [6, 13]]);
       }));
 
       function onSubmit(_x) {
@@ -1576,7 +1579,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) {
@@ -1594,27 +1597,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,
@@ -1624,18 +1624,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) {
@@ -2162,7 +2161,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 () {
@@ -2217,7 +2217,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 () {
@@ -2317,7 +2317,9 @@ 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;
 
   var themeMui = styles$1.createTheme(themeOptions);
   var isWindowDefined = typeof window !== 'undefined';
@@ -2491,7 +2493,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       };
     }();
 
-    fetchCountries();
+    shouldFetchCountries && fetchCountries();
     fetchCart();
   }, []); // fetch cart data
 
@@ -2551,7 +2553,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
             case 0:
               _context4.prev = 0;
 
-              if (!(isWindowDefined && token || xtfCookie)) {
+              if (!(isWindowDefined && token || isLoggedIn)) {
                 _context4.next = 10;
                 break;
               }
@@ -2598,7 +2600,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
   React.useEffect(function () {
     fetchUserData(access_token);
-  }, [access_token, xtfCookie]);
+  }, [access_token, isLoggedIn]);
   React.useEffect(function () {
     var collectPaymentData = /*#__PURE__*/function () {
       var _ref7 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee5() {
@@ -2693,7 +2695,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     enableReinitialize: true,
     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, _e$response, _e$response$data, _error, profileData, profileSpecifiedData, profileDataObj, checkoutBody, res, _e$response2, _e$response3;
 
         return runtime_1.wrap(function _callee6$(_context6) {
           while (1) {
@@ -2740,27 +2742,18 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                   lastNameLogged: lastNameLogged
                 }, showDOB);
                 bodyFormData = createRegisterFormData(values, checkoutBodyForRegistration);
-                access_token_register = null;
-                _context6.prev = 18;
-                _context6.next = 21;
+                _context6.prev = 17;
+                _context6.next = 20;
                 return register(bodyFormData);
 
-              case 21:
-                resRegister = _context6.sent;
-                access_token_register = _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;
+              case 20:
+                onRegisterSuccess();
+                _context6.next = 27;
                 break;
 
-              case 29:
-                _context6.prev = 29;
-                _context6.t0 = _context6["catch"](18);
+              case 23:
+                _context6.prev = 23;
+                _context6.t0 = _context6["catch"](17);
 
                 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;
@@ -2785,11 +2778,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
                 return _context6.abrupt("return");
 
-              case 33:
-                _context6.next = 35;
-                return getProfileData(access_token_register);
+              case 27:
+                _context6.next = 29;
+                return getProfileData();
 
-              case 35:
+              case 29:
                 profileData = _context6.sent;
                 profileSpecifiedData = _get(profileData, 'data.data');
                 profileDataObj = setLoggedUserData(profileSpecifiedData);
@@ -2799,17 +2792,17 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 }
 
                 checkoutBody = collectCheckoutBody(values);
-                _context6.next = 42;
-                return postOnCheckout(checkoutBody, access_token_register);
+                _context6.next = 36;
+                return postOnCheckout(checkoutBody);
 
-              case 42:
+              case 36:
                 res = _context6.sent;
                 handleSubmit(values, formikHelpers, eventId, res);
-                _context6.next = 49;
+                _context6.next = 43;
                 break;
 
-              case 46:
-                _context6.prev = 46;
+              case 40:
+                _context6.prev = 40;
                 _context6.t1 = _context6["catch"](0);
 
                 if (axios.isAxiosError(_context6.t1)) {
@@ -2833,12 +2826,12 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                   onSubmitError(_context6.t1);
                 }
 
-              case 49:
+              case 43:
               case "end":
                 return _context6.stop();
             }
           }
-        }, _callee6, null, [[0, 46], [18, 29]]);
+        }, _callee6, null, [[0, 40], [17, 23]]);
       }));
 
       function onSubmit(_x2, _x3) {
@@ -2857,7 +2850,8 @@ 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, {
@@ -4069,12 +4063,13 @@ var TicketRow = function TicketRow(_ref) {
     }, option.value);
   })))));
   var returnValue = '';
+  var isSoldOut = ticketTier.sold_out || !ticketTier.displayTicket || ticketTier.soldOut;
 
-  if (ticketTier.sold_out || !ticketTier.displayTicket || ticketTier.soldOut) {
+  if (isSoldOut) {
     returnValue = soldOutMessage;
   }
 
-  if (ticketTier.displayTicket) {
+  if (ticketTier.displayTicket && !isSoldOut) {
     returnValue = onSaleContent;
   }
 
@@ -4108,7 +4103,7 @@ var TicketsSection = function TicketsSection(_ref) {
     }
 
     var ticketIsFree = (+ticket.cost || +ticket.price) === 0;
-    var ticketPrice = isSoldOut ? 'SOLD OUT' : ticketIsFree ? 'FREE' : "$ " + (+ticket.cost || +ticket.price).toFixed(2);
+    var ticketPrice = isSoldOut ? '' : ticketIsFree ? 'FREE' : "$ " + (+ticket.cost || +ticket.price).toFixed(2);
     return React__default.createElement("div", {
       key: ticket.id || ticket.name,
       className: "event-detail__tier " + (isSoldOut ? 'disabled' : '')
@@ -4385,6 +4380,8 @@ 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$callback = _ref.callback,
       callback = _ref$callback === void 0 ? function () {} : _ref$callback;
 
@@ -4446,7 +4443,7 @@ function Countdown(_ref) {
     className: 'countdown'
   }, 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)));
 }
@@ -4822,6 +4819,8 @@ var TicketsContainer = function TicketsContainer(_ref) {
     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);
@@ -4842,20 +4841,23 @@ var TicketsContainer = function TicketsContainer(_ref) {
   }), React__default.createElement("div", {
     className: "get-tickets-page " + theme,
     style: contentStyle
-  }, isLoading ? React__default.createElement(Loader$1, null) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
+  }, isLoading ? React__default.createElement(Loader$1, null) : React__default.createElement("div", null, !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'
+  }), isSalesClosed ? 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, {
     startDate: event.salesStart,
     timezone: event.timezone,
     title: "Sales start in:",
     message: "No tickets are currently available for this event.",
+    showMessage: !eventHasTickets,
     callback: updateTickets
-  }) : null, showWaitingList && event.salesStarted && !hideWaitingList && React__default.createElement(WaitingList, {
+  }) : !eventHasTickets ? React__default.createElement("p", {
+    className: "message"
+  }, "No tickets are currently available for this event.") : null, showWaitingList && event.salesStarted && !hideWaitingList && React__default.createElement(WaitingList, {
     tickets: tickets,
     eventId: eventId
   }), React__default.createElement(PromoCodeSection, {
@@ -4868,7 +4870,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
     isPromotionsEnabled: isPromotionsEnabled,
     isAccessCodeEnabled: isAccessCodeEnabled,
     isAllTicketsSoldOut: isAllTicketsSoldOut
-  }), (isTicketOnSale || !(event != null && event.salesEnded)) && React__default.createElement(Button$1, {
+  }), (isTicketOnSale || !(event != null && event.salesEnded)) && !isSalesClosed && (event == null ? void 0 : event.salesStarted) && 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 () {}