tf-checkout-react 1.0.71 → 1.0.75

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

@@ -28,10 +28,10 @@ var Select = _interopDefault(require('@mui/material/Select'));
 var MuiPhoneNumber = _interopDefault(require('material-ui-phone-number'));
 var styles = require('@mui/material/styles');
 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');
-var CircularProgress = _interopDefault(require('@mui/material/CircularProgress'));
 var reactShare = require('react-share');
 var _some = _interopDefault(require('lodash/some'));
 var _find = _interopDefault(require('lodash/find'));
@@ -43,6 +43,7 @@ var _has = _interopDefault(require('lodash/has'));
 var FormControl = _interopDefault(require('@mui/material/FormControl'));
 var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
 var Button$1 = _interopDefault(require('@mui/material/Button'));
+var SVG = _interopDefault(require('react-inlinesvg'));
 var Table = _interopDefault(require('@mui/material/Table'));
 var TableBody = _interopDefault(require('@mui/material/TableBody'));
 var TableCell = _interopDefault(require('@mui/material/TableCell'));
@@ -931,6 +932,10 @@ var setConfigs = function setConfigs(configs) {
   });
 
   publicRequest.setBaseUrl(CONFIGS.BASE_URL);
+
+  if (CONFIGS.X_SOURCE_ORIGIN) {
+    setXSourceOrigin(CONFIGS.X_SOURCE_ORIGIN);
+  }
 };
 
 var getQueryVariable = function getQueryVariable(variable) {
@@ -990,8 +995,6 @@ var ErrorFocusInternal = /*#__PURE__*/function (_Component) {
 var ErrorFocus = /*#__PURE__*/formik.connect(ErrorFocusInternal);
 
 var isWindowDefined = typeof window !== 'undefined';
-var discardedOrigins = ['http://localhost', 'gtsb.io', 'gatsbyjs.io', 'https://www.houseofx.nyc', 'https://tickets-staging.houseofx.nyc'];
-var origin = isWindowDefined && window.location.origin;
 var ttfHeaders = {
   Accept: 'application/vnd.api+json',
   'Content-Type': 'application/vnd.api+json'
@@ -1001,12 +1004,6 @@ if (isWindowDefined && localStorage.getItem('auth_guest_token')) {
   ttfHeaders['Authorization-Guest'] = /*#__PURE__*/localStorage.getItem('auth_guest_token');
 }
 
-if (isWindowDefined && !discardedOrigins.some(function (el) {
-  return origin && origin.includes(el);
-})) {
-  ttfHeaders['X-Source-Origin'] = 'houseofx.nyc';
-}
-
 var publicRequest = /*#__PURE__*/axios.create({
   baseURL: CONFIGS.BASE_URL || "https://www.ticketfairy.com/api",
   headers: ttfHeaders
@@ -1049,11 +1046,9 @@ publicRequest.interceptors.request.use(function (config) {
     config.headers = _updatedHeaders;
   }
 
-  if (isWindowDefined && !discardedOrigins.some(function (el) {
-    return origin && origin.includes(el);
-  })) {
+  if (CONFIGS.X_SOURCE_ORIGIN) {
     var _updatedHeaders2 = _extends({}, config.headers, {
-      'X-Source-Origin': 'houseofx.nyc'
+      'X-Source-Origin': CONFIGS.X_SOURCE_ORIGIN
     });
 
     config.headers = _updatedHeaders2;
@@ -1078,6 +1073,9 @@ publicRequest.setAccessToken = function (token) {
   return publicRequest.defaults.headers.common.Authorization = token;
 };
 
+var setXSourceOrigin = function setXSourceOrigin(sourceOrigin) {
+  ttfHeaders['X-Source-Origin'] = sourceOrigin;
+};
 var setCustomHeader = function setCustomHeader(response) {
   var guestHeaderResponseValue = _get(response, 'headers.authorization-guest');
 
@@ -1810,7 +1808,7 @@ var CustomField = function CustomField(_ref) {
   }) : null);
 };
 
-var _excluded$1 = ["label", "field", "selectOptions", "theme"];
+var _excluded$1 = ["label", "field", "selectOptions", "theme", "setFieldValue"];
 var CheckboxField = function CheckboxField(_ref) {
   var label = _ref.label,
       field = _ref.field,
@@ -1942,7 +1940,7 @@ var removePlusSign = function removePlusSign(string) {
   return string.replace('+', '');
 };
 
-var _excluded$2 = ["label", "field", "form", "setFieldValue"];
+var _excluded$2 = ["label", "field", "form", "setFieldValue", "selectOptions"];
 var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
   var label = _ref.label,
       field = _ref.field,
@@ -1971,22 +1969,6 @@ var FormikPhoneNumberField = function FormikPhoneNumberField(_ref) {
   }, rest));
 };
 
-var getImage = function getImage(name) {
-  if (name === void 0) {
-    name = '';
-  }
-
-  var image = '';
-
-  if (!name.trim().length) {
-    return image;
-  }
-
-  return image;
-};
-
-var TTFLOGO = /*#__PURE__*/getImage('logo-ttf.png');
-
 var LogicRunner = function LogicRunner(_ref) {
   var values = _ref.values,
       setStates = _ref.setStates,
@@ -2125,13 +2107,15 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       onAuthorizeSuccess = _ref3$onAuthorizeSucc === void 0 ? function () {} : _ref3$onAuthorizeSucc,
       _ref3$onAuthorizeErro = _ref3.onAuthorizeError,
       onAuthorizeError = _ref3$onAuthorizeErro === void 0 ? function () {} : _ref3$onAuthorizeErro,
-      _ref3$onLogin = _ref3.onLogin,
-      onLogin = _ref3$onLogin === void 0 ? function () {} : _ref3$onLogin,
+      onLogin = _ref3.onLogin,
       _ref3$onLoginSuccess = _ref3.onLoginSuccess,
       onLoginSuccess = _ref3$onLoginSuccess === void 0 ? function () {} : _ref3$onLoginSuccess,
       _ref3$isLoggedIn = _ref3.isLoggedIn,
       pIsLoggedIn = _ref3$isLoggedIn === void 0 ? false : _ref3$isLoggedIn,
-      fontFamily = _ref3.fontFamily;
+      _ref3$accountInfoTitl = _ref3.accountInfoTitle,
+      accountInfoTitle = _ref3$accountInfoTitl === void 0 ? '' : _ref3$accountInfoTitl,
+      fontFamily = _ref3.fontFamily,
+      hideLogo = _ref3.hideLogo;
   var themeMui = styles.createTheme({
     typography: {
       allVariants: {
@@ -2234,9 +2218,9 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     setIsLoggedIn(false);
   }, []);
   React.useEffect(function () {
-    isWindowDefined && window.document.addEventListener("auth_error", handleAuthErrors);
+    isWindowDefined && window.document.addEventListener('auth_error', handleAuthErrors);
     return function () {
-      isWindowDefined && window.document.removeEventListener("auth_error", handleAuthErrors);
+      isWindowDefined && window.document.removeEventListener('auth_error', handleAuthErrors);
     };
   }, [handleAuthErrors]);
   React.useEffect(function () {
@@ -2493,12 +2477,13 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
                     formikHelpers.setFieldError('confirmPassword', error.password);
                   }
 
-                  if (error != null && error.email) {
+                  if (error != null && error.email && !onLogin) {
+                    // False will stand for outside controll
                     setAlreadyHasUser(true);
                     setShowModalLogin(true);
                   }
 
-                  onRegisterError(_context5.t0);
+                  onRegisterError(_context5.t0, values.email);
                 }
 
                 return _context5.abrupt("return");
@@ -2576,19 +2561,23 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       className: "billing-info-container " + theme
     }, !isLoggedIn && React__default.createElement("div", {
       className: "account-actions-block"
-    }, React__default.createElement("div", null, "Got a ", React__default.createElement("strong", null, "TICKET"), "FAIRY account?"), React__default.createElement("div", null, "Login & skip ahead:"), React__default.createElement("div", {
+    }, React__default.createElement("div", null, accountInfoTitle), React__default.createElement("div", null, "Login & skip ahead:"), React__default.createElement("div", {
       className: "login-block"
     }, React__default.createElement("button", {
       className: "login-register-button",
       type: "button",
       onClick: function onClick() {
-        onLogin();
-        setShowModalLogin(true);
+        // If outside login needed to skip package login functionallity
+        if (onLogin) {
+          onLogin();
+        } else {
+          setShowModalLogin(true);
+        }
       }
-    }, "Login"), React__default.createElement("div", {
+    }, "Login"), !hideLogo && React__default.createElement("div", {
       className: "logo-image-container"
     }, React__default.createElement("img", {
-      src: TTFLOGO,
+      src: theme === 'dark' ? 'https://www.ticketfairy.com/resources/images/logo-ttf.svg' : 'https://www.ticketfairy.com/resources/images/logo-ttf-black.svg',
       alt: "nodata"
     })))), _map(dataWithUniqueIds, function (item) {
       var label = item.label,
@@ -2735,7 +2724,8 @@ var CheckoutForm = function CheckoutForm(_ref) {
       _ref$handleSetLoading = _ref.handleSetLoading,
       handleSetLoading = _ref$handleSetLoading === void 0 ? function () {} : _ref$handleSetLoading,
       _ref$conditions = _ref.conditions,
-      conditions = _ref$conditions === void 0 ? [] : _ref$conditions;
+      conditions = _ref$conditions === void 0 ? [] : _ref$conditions,
+      disableZipSection = _ref.disableZipSection;
   var stripe = reactStripeJs.useStripe();
   var elements = reactStripeJs.useElements();
 
@@ -2767,7 +2757,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
               _context.prev = 1;
               event.preventDefault();
 
-              if (postalCode) {
+              if (!(!postalCode && !disableZipSection)) {
                 _context.next = 7;
                 break;
               }
@@ -2792,10 +2782,14 @@ var CheckoutForm = function CheckoutForm(_ref) {
               address = {
                 city: billing_info.city,
                 line1: billing_info.street_address,
-                state: billing_info.state,
-                postal_code: postalCode
+                state: billing_info.state
               };
-              _context.next = 14;
+
+              if (!disableZipSection) {
+                address.postal_code = postalCode;
+              }
+
+              _context.next = 15;
               return stripe.createPaymentMethod({
                 type: 'card',
                 card: card || {
@@ -2806,11 +2800,11 @@ var CheckoutForm = function CheckoutForm(_ref) {
                 }
               });
 
-            case 14:
+            case 15:
               paymentMethodReq = _context.sent;
 
               if (!paymentMethodReq.error) {
-                _context.next = 19;
+                _context.next = 20;
                 break;
               }
 
@@ -2818,18 +2812,18 @@ var CheckoutForm = function CheckoutForm(_ref) {
               handleSetLoading(false);
               return _context.abrupt("return");
 
-            case 19:
-              _context.next = 21;
+            case 20:
+              _context.next = 22;
               return stripe.confirmCardPayment(stripe_client_secret, {
                 payment_method: paymentMethodReq.paymentMethod.id
               });
 
-            case 21:
+            case 22:
               _yield$stripe$confirm = _context.sent;
               _error = _yield$stripe$confirm.error;
 
               if (!_error) {
-                _context.next = 27;
+                _context.next = 28;
                 break;
               }
 
@@ -2837,22 +2831,22 @@ var CheckoutForm = function CheckoutForm(_ref) {
               handleSetLoading(false);
               return _context.abrupt("return");
 
-            case 27:
+            case 28:
               onSubmit(null);
-              _context.next = 33;
+              _context.next = 34;
               break;
 
-            case 30:
-              _context.prev = 30;
+            case 31:
+              _context.prev = 31;
               _context.t0 = _context["catch"](1);
               onSubmit(_context.t0);
 
-            case 33:
+            case 34:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[1, 30]]);
+      }, _callee, null, [[1, 31]]);
     }));
 
     return function handleSubmit(_x) {
@@ -2913,7 +2907,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "Card number"), React__default.createElement(reactStripeJs.CardNumberElement, {
-    options: _extends({}, options, stripeCardOptions),
+    options: _extends({}, options.style, stripeCardOptions),
     onReady: _identity,
     onChange: _identity,
     onBlur: _identity,
@@ -2923,14 +2917,14 @@ var CheckoutForm = function CheckoutForm(_ref) {
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "Expiration date"), React__default.createElement(reactStripeJs.CardExpiryElement, {
-    options: _extends({}, options, stripeCardOptions)
+    options: _extends({}, options.style, stripeCardOptions)
   })), React__default.createElement("label", {
     className: "cvc_element"
   }, React__default.createElement("span", {
     className: "card_label_text"
   }, "CVC"), React__default.createElement(reactStripeJs.CardCvcElement, {
-    options: _extends({}, options, stripeCardOptions)
-  })), React__default.createElement("label", {
+    options: _extends({}, options.style, stripeCardOptions)
+  })), !disableZipSection && React__default.createElement("label", {
     className: "zip_element"
   }, React__default.createElement("p", {
     className: "card_label_text"
@@ -2960,8 +2954,28 @@ var CheckoutForm = function CheckoutForm(_ref) {
   }, isLoading ? React__default.createElement(CircularProgress, null) : "Pay " + getCurrencySymbolByCurrency(currency) + total))));
 };
 
-var publishableKey = CONFIGS.STRIPE_PUBLISHABLE_KEY || 'pk_test_3Ov1P1oP33A1cxaSjxWE0VjT';
-var stripePromise = /*#__PURE__*/stripeJs.loadStripe(publishableKey);
+var publishableKey = CONFIGS.STRIPE_PUBLISHABLE_KEY || '';
+
+var getStripePromise = function getStripePromise(reviewData) {
+  var stripePublishableKey = _get(reviewData, 'payment_method.stripe_publishable_key') || publishableKey;
+
+  var stripeAccount = _get(reviewData, 'payment_method.stripe_connected_account');
+
+  var options = {};
+
+  if (stripeAccount) {
+    options.stripeAccount = stripeAccount;
+  }
+
+  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: '',
@@ -2997,6 +3011,8 @@ var PaymentContainer = function PaymentContainer(_ref) {
       onPaymentError = _ref$onPaymentError === void 0 ? function () {} : _ref$onPaymentError,
       _ref$stripeCardOption = _ref.stripeCardOptions,
       stripeCardOptions = _ref$stripeCardOption === void 0 ? {} : _ref$stripeCardOption,
+      _ref$disableZipSectio = _ref.disableZipSection,
+      disableZipSection = _ref$disableZipSectio === void 0 ? false : _ref$disableZipSectio,
       fontFamily = _ref.fontFamily;
 
   var _useState = React.useState(initialReviewValues),
@@ -3015,9 +3031,13 @@ var PaymentContainer = function PaymentContainer(_ref) {
       paymentIsLoading = _useState4[0],
       setPaymentIsLoading = _useState4[1];
 
-  var _useState5 = React.useState([]),
-      conditions = _useState5[0],
-      setConditions = _useState5[1];
+  var _useState5 = React.useState(true),
+      paymentDataIsLoading = _useState5[0],
+      setPaymentDataIsLoading = _useState5[1];
+
+  var _useState6 = React.useState([]),
+      conditions = _useState6[0],
+      setConditions = _useState6[1];
 
   var showFormTitle = Boolean(formTitle);
   var showErrorText = Boolean(errorText);
@@ -3066,11 +3086,16 @@ var PaymentContainer = function PaymentContainer(_ref) {
               onGetPaymentDataError(_context.t0.response);
 
             case 11:
+              _context.prev = 11;
+              setPaymentDataIsLoading(false);
+              return _context.finish(11);
+
+            case 14:
             case "end":
               return _context.stop();
           }
         }
-      }, _callee, null, [[0, 7]]);
+      }, _callee, null, [[0, 7, 11, 14]]);
     }))();
   }, [checkoutData]); //just once
 
@@ -3187,7 +3212,7 @@ var PaymentContainer = function PaymentContainer(_ref) {
     severity: "error",
     onClose: onErrorClose,
     variant: "filled"
-  }, error), React__default.createElement(Container, {
+  }, error), paymentDataIsLoading && React__default.createElement(Loader, null), !paymentDataIsLoading && React__default.createElement(Container, {
     maxWidth: "md"
   }, showFormTitle && React__default.createElement("h1", null, formTitle), React__default.createElement("div", {
     className: "order_info_text"
@@ -3215,9 +3240,9 @@ var PaymentContainer = function PaymentContainer(_ref) {
   }, "Please provide your payment information"), showErrorText && React__default.createElement("p", {
     className: "payment_info__error"
   }, errorText), React__default.createElement("div", null, React__default.createElement(reactStripeJs.Elements, {
-    stripe: stripePromise
+    stripe: getStripePromise(reviewData)
   }, React__default.createElement(CheckoutForm, {
-    stripe_client_secret: reviewData.payment_method.stripe_client_secret,
+    stripe_client_secret: _get(reviewData, 'payment_method.stripe_client_secret'),
     total: orderData.total,
     onSubmit: handlePaymentMiddleWare,
     error: error,
@@ -3228,7 +3253,8 @@ var PaymentContainer = function PaymentContainer(_ref) {
       return setPaymentIsLoading(value);
     },
     conditions: conditions,
-    stripeCardOptions: stripeCardOptions
+    stripeCardOptions: stripeCardOptions,
+    disableZipSection: disableZipSection
   })))))));
 };
 
@@ -3402,7 +3428,8 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
       _ref$onGetConfirmatio = _ref.onGetConfirmationDataSuccess,
       onGetConfirmationDataSuccess = _ref$onGetConfirmatio === void 0 ? function () {} : _ref$onGetConfirmatio,
       _ref$onGetConfirmatio2 = _ref.onGetConfirmationDataError,
-      onGetConfirmationDataError = _ref$onGetConfirmatio2 === void 0 ? function () {} : _ref$onGetConfirmatio2;
+      onGetConfirmationDataError = _ref$onGetConfirmatio2 === void 0 ? function () {} : _ref$onGetConfirmatio2,
+      orderHash = _ref.orderHash;
   var inputRef = React.useRef(null);
 
   var _useState = React.useState(null),
@@ -3418,15 +3445,17 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
-              dataEncoded = typeof window !== 'undefined' && window.localStorage.getItem('checkoutData');
+              dataEncoded = typeof window !== 'undefined' && window.localStorage.getItem('checkoutData') || '';
+              dataDecoded = dataEncoded ? JSON.parse(dataEncoded) : {
+                hash: orderHash
+              };
+              hash = dataDecoded.hash;
 
-              if (!dataEncoded) {
+              if (!hash) {
                 _context.next = 18;
                 break;
               }
 
-              dataDecoded = JSON.parse(dataEncoded);
-              hash = dataDecoded.hash;
               _context.prev = 4;
               _context.next = 7;
               return getConfirmationData(hash);
@@ -3536,13 +3565,13 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
     value: data.personal_share_link,
     onChange: onChangeShareLink
   }), React__default.createElement("div", {
-    className: 'share-by-link-copy-icon',
+    className: "share-by-link-copy-icon",
     onClick: function onClick() {
       return navigator.clipboard.writeText(_get(inputRef, 'current.value'));
     }
   }, React__default.createElement("img", {
     src: "https://img.icons8.com/office/50/000000/copy.png",
-    alt: 'copy'
+    alt: "copy"
   })))), (showDefaultShareButtons || !!shareButtons.length) && React__default.createElement(SocialButtons, {
     showDefaultShareButtons: showDefaultShareButtons,
     name: data.product_name,
@@ -3556,7 +3585,7 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
   }, "How much cheaper?"), _map(data.personal_share_sales, function (pricing, index) {
     return React__default.createElement("div", {
       key: index,
-      className: 'pricing-section_wrapper'
+      className: "pricing-section_wrapper"
     }, React__default.createElement("div", {
       className: "pricing-section_label"
     }, pricing.label, pricing.subLabel && React__default.createElement("div", {
@@ -3719,7 +3748,8 @@ var generateQuantity = function generateQuantity(n) {
 var WaitingList = function WaitingList(_ref) {
   var _ref$tickets = _ref.tickets,
       tickets = _ref$tickets === void 0 ? {} : _ref$tickets,
-      eventId = _ref.eventId;
+      eventId = _ref.eventId,
+      isPromotionsEnabled = _ref.isPromotionsEnabled;
 
   var _useState = React.useState(false),
       showSuccessMessage = _useState[0],
@@ -3794,7 +3824,7 @@ var WaitingList = function WaitingList(_ref) {
     className: "success-message"
   }, React__default.createElement("p", {
     className: "added-success-message"
-  }, "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("p", {
+  }, "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", {
     className: "no-tickets-text"
   }, "No tickets are currently available for this event."), React__default.createElement("h2", null, "WAITING LIST"), React__default.createElement(formik.Formik, {
     initialValues: {
@@ -3867,7 +3897,66 @@ var WaitingList = function WaitingList(_ref) {
   }) : 'ADD TO WAITING LIST')))));
 };
 
-function Loader() {
+var getImage = function getImage(name) {
+  if (name === void 0) {
+    name = '';
+  }
+
+  var image = '';
+
+  if (!name.trim().length) {
+    return image;
+  }
+
+  return image;
+};
+
+var PromoCodeSection = function PromoCodeSection(_ref) {
+  var promoCode = _ref.promoCode,
+      promoCodeIsApplied = _ref.promoCodeIsApplied,
+      showPromoInput = _ref.showPromoInput,
+      isPromotionsEnabled = _ref.isPromotionsEnabled,
+      isAllTicketsSoldOut = _ref.isAllTicketsSoldOut,
+      setPromoCode = _ref.setPromoCode,
+      setPromoCodeUpdated = _ref.setPromoCodeUpdated,
+      setShowPromoInput = _ref.setShowPromoInput;
+  return React__default.createElement("div", null, promoCodeIsApplied ? React__default.createElement("div", {
+    className: "alert-info"
+  }, React__default.createElement(SVG, {
+    src: getImage('done.svg'),
+    preProcessor: function preProcessor(code) {
+      return code.replace(/fill=".*?"/g, 'fill="currentColor"');
+    }
+  }), React__default.createElement("p", null, "PROMO CODE APPLIED SUCCESSFULLY")) : null, showPromoInput && React__default.createElement("div", {
+    className: "promo-code-block"
+  }, React__default.createElement("input", {
+    placeholder: "Promo Code",
+    onChange: function onChange(e) {
+      setPromoCode(e.target.value);
+    },
+    onKeyPress: function onKeyPress(event) {
+      if (event.key === 'Enter') {
+        setPromoCodeUpdated(promoCode);
+      }
+    }
+  }), React__default.createElement(Button, {
+    className: "promo-apply-button",
+    placeholder: "Promo Code",
+    onClick: function onClick() {
+      setPromoCodeUpdated(promoCode);
+    }
+  }, "Apply")), isPromotionsEnabled && !showPromoInput && isAllTicketsSoldOut && React__default.createElement("p", {
+    className: "promo-code-text"
+  }, "Access code needed"), isPromotionsEnabled && !showPromoInput ? React__default.createElement(Button, {
+    className: "promo-code-button",
+    placeholder: "Promo Codes",
+    onClick: function onClick() {
+      setShowPromoInput(true);
+    }
+  }, "Got a promo code? Click here") : null);
+};
+
+function Loader$1() {
   return React__default.createElement("div", {
     className: "loader-container"
   }, React__default.createElement(CircularProgress, null));
@@ -3888,7 +3977,9 @@ var TicketsContainer = function TicketsContainer(_ref) {
       _ref$theme = _ref.theme,
       theme = _ref$theme === void 0 ? 'light' : _ref$theme,
       _ref$queryPromoCode = _ref.queryPromoCode,
-      queryPromoCode = _ref$queryPromoCode === void 0 ? '' : _ref$queryPromoCode;
+      queryPromoCode = _ref$queryPromoCode === void 0 ? '' : _ref$queryPromoCode,
+      _ref$isPromotionsEnab = _ref.isPromotionsEnabled,
+      isPromotionsEnabled = _ref$isPromotionsEnab === void 0 ? true : _ref$isPromotionsEnab;
 
   var _useState = React.useState({}),
       selectedTickets = _useState[0],
@@ -4091,50 +4182,29 @@ var TicketsContainer = function TicketsContainer(_ref) {
   return React__default.createElement("div", {
     className: "get-tickets-page " + theme,
     style: contentStyle
-  }, isLoading ? React__default.createElement(Loader, null) : React__default.createElement(React__default.Fragment, null, showWaitingList ? React__default.createElement(WaitingList, {
-    tickets: tickets,
-    eventId: eventId
-  }) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
+  }, isLoading ? React__default.createElement(Loader$1, null) : React__default.createElement("div", null, React__default.createElement(TicketsSection, {
     ticketsList: tickets,
     selectedTickets: selectedTickets,
     handleTicketSelect: handleTicketSelect,
     promoCodeIsApplied: promoCodeIsApplied
-  }), promoCodeIsApplied ? React__default.createElement("div", {
-    className: "alert-info"
-  }, "Your promo code was applied successfully.") : null, showPromoInput && React__default.createElement("div", {
-    className: "promo-code-block"
-  }, React__default.createElement("input", {
-    placeholder: "Promo Code",
-    onChange: function onChange(e) {
-      setPromoCode(e.target.value);
-    },
-    onKeyPress: function onKeyPress(event) {
-      if (event.key === 'Enter') {
-        setPromoCodeUpdated(promoCode);
-      }
-    }
-  }), React__default.createElement(Button, {
-    className: "promo-apply-button",
-    placeholder: "Promo Code",
-    onClick: function onClick() {
-      setPromoCodeUpdated(promoCode);
-    }
-  }, "Apply")), !showPromoInput && !isAllTicketsSoldOut ? React__default.createElement(Button, {
-    className: "promo-code-button",
-    placeholder: "Promo Codes",
-    onClick: function onClick() {
-      setShowPromoInput(true);
-    }
-  }, "Got a promo code? Click here") : null, React__default.createElement("div", {
-    className: "test v1.0.19",
-    style: {
-      display: 'none'
-    }
+  }), showWaitingList && React__default.createElement(WaitingList, {
+    tickets: tickets,
+    eventId: eventId,
+    isPromotionsEnabled: isPromotionsEnabled
+  }), React__default.createElement(PromoCodeSection, {
+    promoCode: promoCode,
+    promoCodeIsApplied: promoCodeIsApplied,
+    showPromoInput: showPromoInput,
+    setPromoCode: setPromoCode,
+    setPromoCodeUpdated: setPromoCodeUpdated,
+    setShowPromoInput: setShowPromoInput,
+    isPromotionsEnabled: isPromotionsEnabled,
+    isAllTicketsSoldOut: isAllTicketsSoldOut
   }), !isAllTicketsSoldOut && React__default.createElement(Button, {
     "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 () {}
-  }, getTicketsLabel || 'GET TICKETS'))));
+  }, getTicketsLabel || 'GET TICKETS')));
 };
 
 var EventInfoItem = function EventInfoItem(_ref) {