tf-checkout-react 1.0.95 → 1.0.97

package/dist/api/index.d.ts

@@ -19,6 +19,7 @@ export declare const getAccessToken: (data: FormData) => Promise<import("axios")
 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>>;
 export declare const getProfileData: (accessToken: any) => Promise<any>;
 export declare const getCountries: () => Promise<import("axios").AxiosResponse<any, any>>;
 export declare const getConfirmationData: (orderHash: string) => Promise<import("axios").AxiosResponse<any, any>>;

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Loader(): JSX.Element;

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

@@ -0,0 +1,5 @@
+export { CheckboxField } from './CheckboxField';
+export { CustomField } from './CustomField';
+export { FormikPhoneNumberField } from './FormikPhoneNumberField';
+export { Loader } from './Loader';
+export { SelectField } from './SelectField';

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

@@ -6,8 +6,9 @@ export interface IPromoCodeSectionProps {
     isPromotionsEnabled: boolean;
     isAllTicketsSoldOut: boolean;
     isAccessCodeEnabled?: boolean;
+    isPromoLoading?: boolean;
     setPromoCode: (value: string) => void;
     setPromoCodeUpdated: (value: string) => void;
     setShowPromoInput: (value: boolean) => void;
 }
-export declare const PromoCodeSection: ({ promoCode, promoCodeIsApplied, showPromoInput, isPromotionsEnabled, setPromoCode, setPromoCodeUpdated, setShowPromoInput, isAccessCodeEnabled, }: IPromoCodeSectionProps) => JSX.Element;
+export declare const PromoCodeSection: ({ promoCode, promoCodeIsApplied, showPromoInput, isPromotionsEnabled, setPromoCode, setPromoCodeUpdated, setShowPromoInput, isAccessCodeEnabled, isPromoLoading, }: IPromoCodeSectionProps) => JSX.Element;

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

@@ -22,17 +22,17 @@ var Box = _interopDefault(require('@mui/material/Box'));
 var _flatMapDeep = _interopDefault(require('lodash/flatMapDeep'));
 var _isArray = _interopDefault(require('lodash/isArray'));
 var nanoid = require('nanoid');
-var TextField = _interopDefault(require('@mui/material/TextField'));
-var styles = require('@mui/styles');
 var FormGroup = _interopDefault(require('@mui/material/FormGroup'));
 var FormControlLabel = _interopDefault(require('@mui/material/FormControlLabel'));
 var Checkbox = _interopDefault(require('@mui/material/Checkbox'));
-var Select = _interopDefault(require('@mui/material/Select'));
+var styles = require('@mui/styles');
+var TextField = _interopDefault(require('@mui/material/TextField'));
 var MuiPhoneNumber = _interopDefault(require('material-ui-phone-number'));
+var CircularProgress = _interopDefault(require('@mui/material/CircularProgress'));
+var Select = _interopDefault(require('@mui/material/Select'));
 var styles$1 = require('@mui/material/styles');
 var Backdrop = _interopDefault(require('@mui/material/Backdrop'));
 var Container = _interopDefault(require('@mui/material/Container'));
-var CircularProgress = _interopDefault(require('@mui/material/CircularProgress'));
 var Alert = _interopDefault(require('@mui/material/Alert'));
 var reactStripeJs = require('@stripe/react-stripe-js');
 var stripeJs = require('@stripe/stripe-js');
@@ -1275,6 +1275,12 @@ var handlePaymentSuccess = function handlePaymentSuccess(orderHash) {
   });
   return res;
 };
+var handleFreeSuccess = function handleFreeSuccess(orderHash) {
+  var res = publicRequest.post("v1/order/" + orderHash + "/complete_free_registration")["catch"](function (error) {
+    throw error;
+  });
+  return res;
+};
 var getProfileData = function getProfileData(accessToken) {
   return publicRequest.get('/customer/profile/', {
     headers: _extends({}, ttfHeaders, {
@@ -1912,6 +1918,26 @@ var assingUniqueIds = function assingUniqueIds(data) {
   });
 };
 
+var _excluded$1 = ["label", "field", "selectOptions", "theme", "setFieldValue"];
+var CheckboxField = function CheckboxField(_ref) {
+  var _rest$form, _field$name, _rest$form2, _field$name2;
+
+  var label = _ref.label,
+      field = _ref.field,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+
+  var customTheme = styles.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 : ""])
+  }, 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);
+};
+
 var CustomField = function CustomField(_ref) {
   var label = _ref.label,
       _ref$type = _ref.type,
@@ -1961,76 +1987,6 @@ var CustomField = function CustomField(_ref) {
   }) : null);
 };
 
-var _excluded$1 = ["label", "field", "selectOptions", "theme", "setFieldValue"];
-var CheckboxField = function CheckboxField(_ref) {
-  var _rest$form, _field$name, _rest$form2, _field$name2;
-
-  var label = _ref.label,
-      field = _ref.field,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
-
-  var customTheme = styles.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 : ""])
-  }, 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);
-};
-
-var SelectField = function SelectField(_ref) {
-  var label = _ref.label,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? 'text' : _ref$type,
-      field = _ref.field,
-      _ref$selectOptions = _ref.selectOptions,
-      selectOptions = _ref$selectOptions === void 0 ? [] : _ref$selectOptions,
-      _ref$form = _ref.form,
-      touched = _ref$form.touched,
-      errors = _ref$form.errors,
-      theme = _ref.theme;
-  var isTouched = Boolean(_get(touched, field.name));
-
-  var error = _get(errors, field.name);
-
-  var customTheme = styles.useTheme();
-  return React__default.createElement(material.FormControl, {
-    fullWidth: true
-  }, React__default.createElement(material.InputLabel, {
-    style: customTheme == null ? void 0 : customTheme.input,
-    htmlFor: field.name,
-    error: !!error && isTouched,
-    shrink: true
-  }, label), React__default.createElement(Select, Object.assign({
-    id: field.name,
-    label: label,
-    type: type,
-    fullWidth: true,
-    error: !!error && isTouched,
-    inputProps: {
-      id: field.name
-    },
-    "native": true,
-    className: theme,
-    MenuProps: {
-      className: theme
-    }
-  }, field, {
-    style: customTheme == null ? void 0 : customTheme.input
-  }), _map(selectOptions, function (option) {
-    return React__default.createElement("option", {
-      key: option.value,
-      value: option.value,
-      disabled: option.disabled
-    }, option.label);
-  })), isTouched && error ? React__default.createElement(material.FormHelperText, {
-    error: !!error && isTouched
-  }, error) : null);
-};
-
 var currencyNormalizerCreator = function currencyNormalizerCreator(value, currency) {
   return !value ? '' : "" + getCurrencySymbolByCurrency(currency) + value;
 };
@@ -2143,6 +2099,62 @@ var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
   }, rest));
 };
 
+function Loader() {
+  return React__default.createElement("div", {
+    className: "loader-container"
+  }, React__default.createElement(CircularProgress, null));
+}
+
+var SelectField = function SelectField(_ref) {
+  var label = _ref.label,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'text' : _ref$type,
+      field = _ref.field,
+      _ref$selectOptions = _ref.selectOptions,
+      selectOptions = _ref$selectOptions === void 0 ? [] : _ref$selectOptions,
+      _ref$form = _ref.form,
+      touched = _ref$form.touched,
+      errors = _ref$form.errors,
+      theme = _ref.theme;
+  var isTouched = Boolean(_get(touched, field.name));
+
+  var error = _get(errors, field.name);
+
+  var customTheme = styles.useTheme();
+  return React__default.createElement(material.FormControl, {
+    fullWidth: true
+  }, React__default.createElement(material.InputLabel, {
+    style: customTheme == null ? void 0 : customTheme.input,
+    htmlFor: field.name,
+    error: !!error && isTouched,
+    shrink: true
+  }, label), React__default.createElement(Select, Object.assign({
+    id: field.name,
+    label: label,
+    type: type,
+    fullWidth: true,
+    error: !!error && isTouched,
+    inputProps: {
+      id: field.name
+    },
+    "native": true,
+    className: theme,
+    MenuProps: {
+      className: theme
+    }
+  }, field, {
+    style: customTheme == null ? void 0 : customTheme.input
+  }), _map(selectOptions, function (option) {
+    return React__default.createElement("option", {
+      key: option.value,
+      value: option.value,
+      disabled: option.disabled
+    }, option.label);
+  })), isTouched && error ? React__default.createElement(material.FormHelperText, {
+    error: !!error && isTouched
+  }, error) : null);
+};
+
 var LogicRunner = function LogicRunner(_ref) {
   var values = _ref.values,
       setStates = _ref.setStates,
@@ -2688,7 +2700,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 _context6.prev = 0;
 
                 if (!isLoggedIn) {
-                  _context6.next = 17;
+                  _context6.next = 15;
                   break;
                 }
 
@@ -2716,14 +2728,10 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
               case 12:
                 _res = _context6.sent;
-                _context6.next = 15;
-                return getPaymentData(_res.data.data.attributes.hash);
-
-              case 15:
                 handleSubmit(values, formikHelpers, eventId, _res);
                 return _context6.abrupt("return");
 
-              case 17:
+              case 15:
                 checkoutBodyForRegistration = createCheckoutDataBody(ticketsQuantity.length, values, {
                   emailLogged: emailLogged,
                   firstNameLogged: firstNameLogged,
@@ -2731,11 +2739,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 }, showDOB);
                 bodyFormData = createRegisterFormData(values, checkoutBodyForRegistration);
                 access_token_register = null;
-                _context6.prev = 20;
-                _context6.next = 23;
+                _context6.prev = 18;
+                _context6.next = 21;
                 return register(bodyFormData);
 
-              case 23:
+              case 21:
                 resRegister = _context6.sent;
                 access_token_register = _get(resRegister, 'data.data.attributes.access_token');
                 refreshToken = _get(resRegister, 'data.data.attributes.refresh_token');
@@ -2745,12 +2753,12 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                   refreshToken: refreshToken
                 };
                 onRegisterSuccess(tokens);
-                _context6.next = 35;
+                _context6.next = 33;
                 break;
 
-              case 31:
-                _context6.prev = 31;
-                _context6.t0 = _context6["catch"](20);
+              case 29:
+                _context6.prev = 29;
+                _context6.t0 = _context6["catch"](18);
 
                 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;
@@ -2775,11 +2783,11 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
                 return _context6.abrupt("return");
 
-              case 35:
-                _context6.next = 37;
+              case 33:
+                _context6.next = 35;
                 return getProfileData(access_token_register);
 
-              case 37:
+              case 35:
                 profileData = _context6.sent;
                 profileSpecifiedData = _get(profileData, 'data.data');
                 profileDataObj = setLoggedUserData(profileSpecifiedData);
@@ -2789,21 +2797,17 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                 }
 
                 checkoutBody = collectCheckoutBody(values);
-                _context6.next = 44;
+                _context6.next = 42;
                 return postOnCheckout(checkoutBody, access_token_register);
 
-              case 44:
+              case 42:
                 res = _context6.sent;
-                _context6.next = 47;
-                return getPaymentData(res.data.data.attributes.hash);
-
-              case 47:
                 handleSubmit(values, formikHelpers, eventId, res);
-                _context6.next = 53;
+                _context6.next = 49;
                 break;
 
-              case 50:
-                _context6.prev = 50;
+              case 46:
+                _context6.prev = 46;
                 _context6.t1 = _context6["catch"](0);
 
                 if (axios.isAxiosError(_context6.t1)) {
@@ -2827,12 +2831,12 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                   onSubmitError(_context6.t1);
                 }
 
-              case 53:
+              case 49:
               case "end":
                 return _context6.stop();
             }
           }
-        }, _callee6, null, [[0, 50], [20, 31]]);
+        }, _callee6, null, [[0, 46], [18, 29]]);
       }));
 
       function onSubmit(_x2, _x3) {
@@ -3337,12 +3341,6 @@ var getStripePromise = function getStripePromise(reviewData) {
   return stripeJs.loadStripe(stripePublishableKey, options);
 };
 
-function Loader() {
-  return React__default.createElement("div", {
-    className: "loader-container"
-  }, React__default.createElement(CircularProgress, null));
-}
-
 var initialOrderValues = {
   product_name: '',
   ticketType: '',
@@ -3414,9 +3412,9 @@ var PaymentContainer = function PaymentContainer(_ref) {
   var showFormTitle = Boolean(formTitle);
   var showErrorText = Boolean(errorText);
   var eventId = getQueryVariable('event_id');
+  var hash = checkoutData.hash,
+      total = checkoutData.total;
   React.useEffect(function () {
-    var hash = checkoutData.hash;
-
     _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
       var response, _cart$, attributes, cart, order_details, _order_details$ticket, ticket, _orderData;
 
@@ -3536,32 +3534,50 @@ var PaymentContainer = function PaymentContainer(_ref) {
 
             case 4:
               order_hash = reviewData.order_details.order_hash;
-              _context3.next = 7;
+
+              if (!(total === "0.00")) {
+                _context3.next = 11;
+                break;
+              }
+
+              _context3.next = 8;
+              return handleFreeSuccess(order_hash);
+
+            case 8:
+              _context3.t0 = _context3.sent;
+              _context3.next = 14;
+              break;
+
+            case 11:
+              _context3.next = 13;
               return handlePaymentSuccess(order_hash);
 
-            case 7:
-              paymentSuccessResponse = _context3.sent;
+            case 13:
+              _context3.t0 = _context3.sent;
+
+            case 14:
+              paymentSuccessResponse = _context3.t0;
 
               if (paymentSuccessResponse.status === 200) {
                 handlePayment(paymentSuccessResponse);
                 setPaymentIsLoading(false);
               }
 
-              _context3.next = 15;
+              _context3.next = 22;
               break;
 
-            case 11:
-              _context3.prev = 11;
-              _context3.t0 = _context3["catch"](0);
-              setError(_get(_context3.t0, 'response.data.message'));
-              onPaymentError(_context3.t0.response);
+            case 18:
+              _context3.prev = 18;
+              _context3.t1 = _context3["catch"](0);
+              setError(_get(_context3.t1, 'response.data.message'));
+              onPaymentError(_context3.t1.response);
 
-            case 15:
+            case 22:
             case "end":
               return _context3.stop();
           }
         }
-      }, _callee3, null, [[0, 11]]);
+      }, _callee3, null, [[0, 18]]);
     }));
 
     return function handlePaymentMiddleWare(_x) {
@@ -3603,7 +3619,7 @@ var PaymentContainer = function PaymentContainer(_ref) {
     }, label), React__default.createElement("div", {
       className: className + " order_info_text"
     }, normalizer(orderData[id], orderData.currency)));
-  })), React__default.createElement("div", {
+  })), total !== "0.00" ? React__default.createElement("div", {
     className: "payment_info"
   }, React__default.createElement("div", {
     className: "payment_info_label"
@@ -3626,7 +3642,17 @@ var PaymentContainer = function PaymentContainer(_ref) {
     conditions: conditions,
     stripeCardOptions: stripeCardOptions,
     disableZipSection: disableZipSection
-  })))))));
+  })))) : React__default.createElement("div", {
+    className: "payment_button " + (paymentIsLoading ? 'disabled-payment-button' : '')
+  }, React__default.createElement("button", {
+    disabled: paymentIsLoading,
+    type: "button",
+    onClick: function onClick() {
+      handlePaymentMiddleWare(null);
+    }
+  }, paymentIsLoading ? React__default.createElement(CircularProgress, {
+    size: 26
+  }) : "Complete Registration")))));
 };
 
 var config = {
@@ -4288,7 +4314,8 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
       setPromoCode = _ref.setPromoCode,
       setPromoCodeUpdated = _ref.setPromoCodeUpdated,
       setShowPromoInput = _ref.setShowPromoInput,
-      isAccessCodeEnabled = _ref.isAccessCodeEnabled;
+      isAccessCodeEnabled = _ref.isAccessCodeEnabled,
+      isPromoLoading = _ref.isPromoLoading;
   var isPromoCodeHasValue = !!promoCode.trim();
 
   var renderInputField = function renderInputField() {
@@ -4321,7 +4348,7 @@ var PromoCodeSection = function PromoCodeSection(_ref) {
     }, isAccessCodeEnabled ? 'ENTER' : 'APPLY'));
   };
 
-  return React__default.createElement("div", null, promoCodeIsApplied ? React__default.createElement("div", {
+  return isPromoLoading ? React__default.createElement(Loader, null) : React__default.createElement("div", null, promoCodeIsApplied ? React__default.createElement("div", {
     className: "alert-info"
   }, React__default.createElement(SVG, {
     src: getImage('done.svg'),
@@ -4458,12 +4485,6 @@ var ReferralLogic = function ReferralLogic(props) {
   return null;
 };
 
-function Loader$1() {
-  return React__default.createElement("div", {
-    className: "loader-container"
-  }, React__default.createElement(CircularProgress, null));
-}
-
 var TicketsContainer = function TicketsContainer(_ref) {
   var onLoginSuccess = _ref.onLoginSuccess,
       getTicketsLabel = _ref.getTicketsLabel,
@@ -4522,24 +4543,28 @@ var TicketsContainer = function TicketsContainer(_ref) {
       setIsLoading = _useState6[1];
 
   var _useState7 = React.useState(false),
-      handleBookIsLoading = _useState7[0],
-      setHandleBookIsLoading = _useState7[1];
+      isPromoLoading = _useState7[0],
+      setIsPromoLoading = _useState7[1];
 
-  var _useState8 = React.useState(''),
-      promoCode = _useState8[0],
-      setPromoCode = _useState8[1];
+  var _useState8 = React.useState(false),
+      handleBookIsLoading = _useState8[0],
+      setHandleBookIsLoading = _useState8[1];
 
-  var _useState9 = React.useState(getQueryVariable('r') || queryPromoCode),
-      promoCodeUpdated = _useState9[0],
-      setPromoCodeUpdated = _useState9[1];
+  var _useState9 = React.useState(''),
+      promoCode = _useState9[0],
+      setPromoCode = _useState9[1];
 
-  var _useState10 = React.useState(false),
-      showPromoInput = _useState10[0],
-      setShowPromoInput = _useState10[1];
+  var _useState10 = React.useState(getQueryVariable('r') || queryPromoCode),
+      promoCodeUpdated = _useState10[0],
+      setPromoCodeUpdated = _useState10[1];
 
   var _useState11 = React.useState(false),
-      promoCodeIsApplied = _useState11[0],
-      setPromoCodeIsApplied = _useState11[1];
+      showPromoInput = _useState11[0],
+      setShowPromoInput = _useState11[1];
+
+  var _useState12 = React.useState(false),
+      promoCodeIsApplied = _useState12[0],
+      setPromoCodeIsApplied = _useState12[1];
 
   React.useEffect(function () {
     if (typeof window !== 'undefined') {
@@ -4556,7 +4581,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
     }
   }, []);
   React.useEffect(function () {
-    !!eventId && getTicketsApi();
+    !!eventId && getTicketsApi(!!promoCodeUpdated);
   }, [eventId, promoCodeUpdated]);
 
   var handleLogout = function handleLogout() {
@@ -4588,12 +4613,12 @@ var TicketsContainer = function TicketsContainer(_ref) {
     }
   };
 
-  function getTicketsApi() {
+  function getTicketsApi(_x) {
     return _getTicketsApi.apply(this, arguments);
   }
 
   function _getTicketsApi() {
-    _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
+    _getTicketsApi = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2(isUpdateingPromoCode) {
       var response, eventResponse, attributes, _event2;
 
       return runtime_1.wrap(function _callee2$(_context2) {
@@ -4601,16 +4626,17 @@ var TicketsContainer = function TicketsContainer(_ref) {
           switch (_context2.prev = _context2.next) {
             case 0:
               _context2.prev = 0;
-              setIsLoading(true);
-              _context2.next = 4;
+              !isUpdateingPromoCode && setIsLoading(true);
+              setIsPromoLoading(true);
+              _context2.next = 5;
               return getTickets(eventId, promoCodeUpdated);
 
-            case 4:
+            case 5:
               response = _context2.sent;
-              _context2.next = 7;
+              _context2.next = 8;
               return getEvent(eventId);
 
-            case 7:
+            case 8:
               eventResponse = _context2.sent;
 
               if (response.data.success) {
@@ -4628,28 +4654,29 @@ var TicketsContainer = function TicketsContainer(_ref) {
                 setEvent(_event2);
               }
 
-              _context2.next = 15;
+              _context2.next = 16;
               break;
 
-            case 12:
-              _context2.prev = 12;
+            case 13:
+              _context2.prev = 13;
               _context2.t0 = _context2["catch"](0);
 
               if (axios.isAxiosError(_context2.t0)) {
                 onGetTicketsError(_context2.t0);
               }
 
-            case 15:
-              _context2.prev = 15;
+            case 16:
+              _context2.prev = 16;
               setIsLoading(false);
-              return _context2.finish(15);
+              setIsPromoLoading(false);
+              return _context2.finish(16);
 
-            case 18:
+            case 20:
             case "end":
               return _context2.stop();
           }
         }
-      }, _callee2, null, [[0, 12, 15, 18]]);
+      }, _callee2, null, [[0, 13, 16, 20]]);
     }));
     return _getTicketsApi.apply(this, arguments);
   }
@@ -4807,7 +4834,7 @@ 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, null) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
     ticketsList: tickets,
     selectedTickets: selectedTickets,
     handleTicketSelect: handleTicketSelect,
@@ -4832,7 +4859,8 @@ var TicketsContainer = function TicketsContainer(_ref) {
     setShowPromoInput: setShowPromoInput,
     isPromotionsEnabled: isPromotionsEnabled,
     isAccessCodeEnabled: isAccessCodeEnabled,
-    isAllTicketsSoldOut: isAllTicketsSoldOut
+    isAllTicketsSoldOut: isAllTicketsSoldOut,
+    isPromoLoading: isPromoLoading
   }), (isTicketOnSale || !(event != null && event.salesEnded)) && React__default.createElement(Button$1, {
     "aria-hidden": true,
     className: "book-button " + (handleBookIsLoading || _isEmpty(selectedTickets) || Object.values(selectedTickets)[0] === 0 ? 'disabled' : ''),