tf-checkout-react 1.3.13 → 1.3.15

package/dist/tf-checkout-react.esm.js

@@ -11,7 +11,7 @@ import _isEmpty from 'lodash-es/isEmpty';
 import _isEqual from 'lodash-es/isEqual';
 import _map from 'lodash-es/map';
 import { nanoid } from 'nanoid';
-import React, { Component, useCallback, useEffect, useState, memo, useRef, Fragment } from 'react';
+import React, { Component, useState, useCallback, useEffect, memo, useRef, Fragment } from 'react';
 import _forEach from 'lodash-es/forEach';
 import { DatePicker } from '@mui/x-date-pickers';
 import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment';
@@ -1323,7 +1323,6 @@ function getEvent(id, pk) {
     var referralIdlocal = '';
 
     if (referral_key) {
-      // eslint-disable-next-line prefer-destructuring
       referralIdlocal = referral_key.split('.')[1];
     }
 
@@ -1344,9 +1343,11 @@ function getEvent(id, pk) {
   return response;
 }
 function getTickets(id, promoCode, pk) {
+  var invitationHash = getQueryVariable('invitation-hash');
   var response = publicRequest.get("v1/event/" + id + "/tickets", {
     params: {
-      pk: pk
+      pk: pk,
+      'invitation-hash': invitationHash
     },
     headers: promoCode ? _extends({}, ttfHeaders, {
       'Promotion-Event': String(id),
@@ -1604,6 +1605,11 @@ var CustomField = function CustomField(_ref) {
       _ref$InputProps = _ref.InputProps,
       InputProps = _ref$InputProps === void 0 ? {} : _ref$InputProps,
       inputRef = _ref.inputRef;
+
+  var _useState = useState(Boolean(field.value)),
+      isShrinked = _useState[0],
+      setIsShrinked = _useState[1];
+
   var isSelectField = type === 'select';
 
   var error = _get(errors, field.name);
@@ -1614,6 +1620,7 @@ var CustomField = function CustomField(_ref) {
     sx: customTheme == null ? void 0 : customTheme.input
   };
   return React.createElement(TextField, Object.assign({
+    placeholder: "",
     id: field.name,
     label: label,
     type: type,
@@ -1621,6 +1628,9 @@ var CustomField = function CustomField(_ref) {
     fullWidth: true,
     error: !!error && isTouched,
     helperText: isTouched && error,
+    onFocus: function onFocus() {
+      setIsShrinked(true);
+    },
     SelectProps: {
       "native": true,
       className: theme,
@@ -1629,12 +1639,21 @@ var CustomField = function CustomField(_ref) {
       }
     },
     InputLabelProps: {
-      sx: customTheme == null ? void 0 : customTheme.input
+      sx: customTheme == null ? void 0 : customTheme.input,
+      shrink: isShrinked || Boolean(field.value)
     },
     InputProps: InputProps,
     inputProps: _extends({}, inputProps, pInputProps),
     inputRef: inputRef
-  }, field), isSelectField ? _map(selectOptions, function (option) {
+  }, field, {
+    onBlur: function onBlur(e) {
+      setIsShrinked(Boolean(field.value));
+
+      if (field.onBlur) {
+        field.onBlur(e);
+      }
+    }
+  }), isSelectField ? _map(selectOptions, function (option) {
     return React.createElement("option", {
       key: option.value,
       value: option.value,
@@ -3056,6 +3075,9 @@ var BillingInfoContainer = /*#__PURE__*/React.memo(function (_ref4) {
   var expirationTime = _get(cartInfoData, 'expiresAt');
 
   var flagRequirePhone = getQueryVariable('phone_required') === 'true';
+  var collectOptionalWalletAddress = getQueryVariable('collect_optional_wallet_address') === 'true';
+  var collectMandatoryWalletAddress = getQueryVariable('collect_mandatory_wallet_address') === 'true';
+  var flagFreeTicket = getQueryVariable('free_ticket') === 'true';
   var hidePhoneField = getQueryVariable('hide_phone_field') === 'true'; // Get prevProps
 
   var prevData = useRef(data);
@@ -3625,6 +3647,23 @@ var BillingInfoContainer = /*#__PURE__*/React.memo(function (_ref4) {
             }
           }
 
+          if (el.name === 'data_capture[wallet_address]') {
+            if (collectOptionalWalletAddress) {
+              el.required = false;
+            }
+
+            if (collectMandatoryWalletAddress) {
+              el.required = true;
+            }
+          }
+
+          if (['street_address', 'country', 'state', 'city', 'zip'].includes(el.name)) {
+            if (flagFreeTicket) {
+              el.required = false;
+              return false;
+            }
+          }
+
           return true;
         }), function (element) {
           return ['password', 'confirmPassword', 'password-info'].includes(element.name) && isLoggedIn ? null : React.createElement(React.Fragment, {
@@ -3634,7 +3673,7 @@ var BillingInfoContainer = /*#__PURE__*/React.memo(function (_ref4) {
           }, element.component ? element.component : React.createElement(Field, {
             setPhoneValidationIsLoading: element.type === 'phone' ? setPhoneValidationIsLoading : undefined,
             name: element.name,
-            label: element.name === 'phone' ? "" + element.label + (flagRequirePhone ? '' : ' (optional)') + " " : element.label,
+            label: element.name === 'phone' ? "" + element.label + (flagRequirePhone ? '' : ' (optional)') + " " : element.name === 'data_capture[wallet_address]' ? "" + element.label + (collectOptionalWalletAddress ? ' (optional)' : '') + " " : element.label,
             type: element.type,
             fill: element.fill,
             validate: getValidateFunctions(element, states, props.values, props.errors),
@@ -4832,6 +4871,51 @@ var ConfirmationContainer = function ConfirmationContainer(_ref) {
   }))))));
 };
 
+var style$3 = {
+  position: 'absolute',
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)',
+  minWidth: 480,
+  backgroundColor: '#e3e3e3',
+  border: '1px solid white',
+  outline: 'none',
+  padding: '14px',
+  maxHeight: '85vh',
+  overflow: 'auto'
+};
+
+var ConfirmModal = function ConfirmModal(_ref) {
+  var _ref$message = _ref.message,
+      message = _ref$message === void 0 ? '' : _ref$message,
+      _ref$loading = _ref.loading,
+      loading = _ref$loading === void 0 ? false : _ref$loading,
+      _ref$hideCancelBtn = _ref.hideCancelBtn,
+      hideCancelBtn = _ref$hideCancelBtn === void 0 ? false : _ref$hideCancelBtn,
+      _ref$onClose = _ref.onClose,
+      onClose = _ref$onClose === void 0 ? _identity : _ref$onClose,
+      _ref$onConfirm = _ref.onConfirm,
+      onConfirm = _ref$onConfirm === void 0 ? _identity : _ref$onConfirm;
+  return React.createElement(Modal$1, {
+    open: true,
+    onClose: onClose,
+    "aria-labelledby": "modal-modal-title",
+    "aria-describedby": "modal-modal-description",
+    className: "confirm-modal"
+  }, React.createElement(Box$1, {
+    style: style$3
+  }, React.createElement("p", null, message), React.createElement("div", {
+    className: "footer"
+  }, !hideCancelBtn && React.createElement(Button, {
+    onClick: onClose,
+    disabled: loading
+  }, "Cancel"), React.createElement(Button, {
+    onClick: onConfirm
+  }, loading ? React.createElement(CircularProgress, {
+    size: "22px"
+  }) : 'OK'))));
+};
+
 var isTimeExpired = function isTimeExpired(startDate, timezone) {
   return !moment(startDate).isAfter(moment.tz(moment(), timezone).format('YYYY-MM-DD HH:mm:ss'));
 };
@@ -5410,7 +5494,11 @@ var TicketsContainer = function TicketsContainer(_ref) {
       _ref$enableInfluencer = _ref.enableInfluencersSection,
       enableInfluencersSection = _ref$enableInfluencer === void 0 ? true : _ref$enableInfluencer,
       _ref$enableAddOns = _ref.enableAddOns,
-      enableAddOns = _ref$enableAddOns === void 0 ? true : _ref$enableAddOns;
+      enableAddOns = _ref$enableAddOns === void 0 ? true : _ref$enableAddOns,
+      _ref$handleNotInvited = _ref.handleNotInvitedModalClose,
+      handleNotInvitedModalClose = _ref$handleNotInvited === void 0 ? _identity : _ref$handleNotInvited,
+      _ref$handleInvalidLin = _ref.handleInvalidLinkModalClose,
+      handleInvalidLinkModalClose = _ref$handleInvalidLin === void 0 ? _identity : _ref$handleInvalidLin;
 
   var _useState = useState({}),
       selectedTickets = _useState[0],
@@ -5479,6 +5567,14 @@ var TicketsContainer = function TicketsContainer(_ref) {
       error = _useState16[0],
       setError = _useState16[1];
 
+  var _useState17 = useState(''),
+      isNotInvitedError = _useState17[0],
+      setIsNotInvitedError = _useState17[1];
+
+  var _useState18 = useState(''),
+      isInvalidLinkError = _useState18[0],
+      setIsInvalidLinkError = _useState18[1];
+
   var ticketsContainerRef = useRef(null);
   useEffect(function () {
     if (typeof window !== 'undefined') {
@@ -5657,7 +5753,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
     var _ref4 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
       var _product_options, _product_options2, _ticket_types;
 
-      var ticket, optionName, ticketId, ticketQuantity, data, result, pageConfigsDataResponse, _pageConfigsData$skip, _pageConfigsData$name, _pageConfigsData$age_, _pageConfigsData$phon, _pageConfigsData$hide, _pageConfigsData$has_, pageConfigsData, skipBillingPage, nameIsRequired, ageIsRequired, phoneIsRequired, hidePhoneField, hasAddOn, hash, total, _isWindowDefined, userData, access_token, checkoutBody, checkoutResult;
+      var ticket, optionName, ticketId, ticketQuantity, data, result, pageConfigsDataResponse, _pageConfigsData$skip, _pageConfigsData$name, _pageConfigsData$age_, _pageConfigsData$phon, _pageConfigsData$hide, _pageConfigsData$has_, _pageConfigsData$free, _pageConfigsData$coll, _pageConfigsData$coll2, pageConfigsData, skipBillingPage, nameIsRequired, ageIsRequired, phoneIsRequired, hidePhoneField, hasAddOn, freeTicket, collectOptionalWalletAddress, collectMandatoryWalletAddress, hash, total, _isWindowDefined, userData, access_token, checkoutBody, checkoutResult, message, _isInvalidLinkError, _isNotInvitedError;
 
       return runtime_1.wrap(function _callee2$(_context2) {
         while (1) {
@@ -5714,7 +5810,7 @@ var TicketsContainer = function TicketsContainer(_ref) {
               pageConfigsDataResponse = _context2.t0;
 
               if (!(result.status === 200 && pageConfigsDataResponse.status === 200)) {
-                _context2.next = 45;
+                _context2.next = 48;
                 break;
               }
 
@@ -5725,13 +5821,16 @@ var TicketsContainer = function TicketsContainer(_ref) {
               phoneIsRequired = (_pageConfigsData$phon = pageConfigsData.phone_required) != null ? _pageConfigsData$phon : false;
               hidePhoneField = (_pageConfigsData$hide = pageConfigsData.hide_phone_field) != null ? _pageConfigsData$hide : false;
               hasAddOn = (_pageConfigsData$has_ = pageConfigsData.has_add_on) != null ? _pageConfigsData$has_ : false;
+              freeTicket = (_pageConfigsData$free = pageConfigsData.free_ticket) != null ? _pageConfigsData$free : false;
+              collectOptionalWalletAddress = (_pageConfigsData$coll = pageConfigsData.collect_optional_wallet_address) != null ? _pageConfigsData$coll : false;
+              collectMandatoryWalletAddress = (_pageConfigsData$coll2 = pageConfigsData.collect_mandatory_wallet_address) != null ? _pageConfigsData$coll2 : false;
               hash = '';
               total = '';
               _isWindowDefined = typeof window !== 'undefined';
               _isWindowDefined && window.localStorage.removeItem('add_ons');
 
               if (!(skipBillingPage && !hasAddOn)) {
-                _context2.next = 44;
+                _context2.next = 47;
                 break;
               }
 
@@ -5741,63 +5840,76 @@ var TicketsContainer = function TicketsContainer(_ref) {
               checkoutBody = createCheckoutDataBodyWithDefaultHolder(ticketQuantity, userData);
 
               if (!enableBillingInfoAutoCreate) {
-                _context2.next = 40;
+                _context2.next = 43;
                 break;
               }
 
-              _context2.next = 37;
+              _context2.next = 40;
               return postOnCheckout(checkoutBody, access_token);
 
-            case 37:
+            case 40:
               _context2.t1 = _context2.sent;
-              _context2.next = 41;
+              _context2.next = 44;
               break;
 
-            case 40:
+            case 43:
               _context2.t1 = null;
 
-            case 41:
+            case 44:
               checkoutResult = _context2.t1;
               hash = _get(checkoutResult, 'data.data.attributes.hash');
               total = _get(checkoutResult, 'data.data.attributes.total');
 
-            case 44:
+            case 47:
               onAddToCartSuccess({
                 skip_billing_page: skipBillingPage,
                 names_required: nameIsRequired,
                 phone_required: phoneIsRequired,
                 age_required: ageIsRequired,
                 hide_phone_field: hidePhoneField,
+                free_ticket: freeTicket,
+                collect_optional_wallet_address: collectOptionalWalletAddress,
+                collect_mandatory_wallet_address: collectMandatoryWalletAddress,
                 event_id: String(eventId),
                 hash: hash,
                 total: total,
                 hasAddOn: hasAddOn
               });
 
-            case 45:
-              _context2.next = 50;
+            case 48:
+              _context2.next = 53;
               break;
 
-            case 47:
-              _context2.prev = 47;
+            case 50:
+              _context2.prev = 50;
               _context2.t2 = _context2["catch"](6);
 
               if (axios.isAxiosError(_context2.t2)) {
                 onAddToCartError(_context2.t2);
-                setError(_get(_context2.t2, 'response.data.message'));
+                message = _get(_context2.t2, 'response.data.message', '');
+                _isInvalidLinkError = _includes(message, 'No more of this ticket type are available right now');
+                _isNotInvitedError = _includes(message, 'You must have been invited to this event to attend');
+
+                if (_isInvalidLinkError) {
+                  setIsInvalidLinkError(message);
+                } else if (_isNotInvitedError) {
+                  setIsNotInvitedError(message);
+                } else {
+                  setError(message);
+                }
               }
 
-            case 50:
-              _context2.prev = 50;
+            case 53:
+              _context2.prev = 53;
               setHandleBookIsLoading(false);
-              return _context2.finish(50);
+              return _context2.finish(53);
 
-            case 53:
+            case 56:
             case "end":
               return _context2.stop();
           }
         }
-      }, _callee2, null, [[6, 47, 50, 53]]);
+      }, _callee2, null, [[6, 50, 53, 56]]);
     }));
 
     return function handleBook() {
@@ -5863,6 +5975,17 @@ var TicketsContainer = function TicketsContainer(_ref) {
     return false;
   };
 
+  var _onClose = function onClose(value) {
+    if (value === 'notInvited') {
+      handleNotInvitedModalClose();
+    } else if (value === 'invalidLink') {
+      handleInvalidLinkModalClose();
+    }
+
+    setIsNotInvitedError('');
+    setIsInvalidLinkError('');
+  };
+
   return React.createElement(ThemeProvider$1, {
     theme: themeMui
   }, !isLoading && React.createElement(ReferralLogic, {
@@ -5870,7 +5993,25 @@ var TicketsContainer = function TicketsContainer(_ref) {
   }), React.createElement("div", {
     className: "get-tickets-page " + theme,
     style: contentStyle
-  }, error && React.createElement(Alert$1, {
+  }, isInvalidLinkError && React.createElement(ConfirmModal, {
+    message: isInvalidLinkError,
+    hideCancelBtn: true,
+    onClose: function onClose() {
+      return _onClose('invalidLink');
+    },
+    onConfirm: function onConfirm() {
+      return _onClose('invalidLink');
+    }
+  }), isNotInvitedError && React.createElement(ConfirmModal, {
+    hideCancelBtn: true,
+    message: isNotInvitedError,
+    onClose: function onClose() {
+      return _onClose('notInvited');
+    },
+    onConfirm: function onConfirm() {
+      return _onClose('notInvited');
+    }
+  }), error && React.createElement(Alert$1, {
     severity: "error",
     onClose: onErrorClose,
     variant: "filled",
@@ -6198,49 +6339,6 @@ var MyTicketsContainer = function MyTicketsContainer(_ref) {
   })));
 };
 
-var style$3 = {
-  position: 'absolute',
-  top: '50%',
-  left: '50%',
-  transform: 'translate(-50%, -50%)',
-  minWidth: 480,
-  backgroundColor: '#e3e3e3',
-  border: '1px solid white',
-  outline: 'none',
-  padding: '14px',
-  maxHeight: '85vh',
-  overflow: 'auto'
-};
-
-var ConfirmModal = function ConfirmModal(_ref) {
-  var _ref$message = _ref.message,
-      message = _ref$message === void 0 ? '' : _ref$message,
-      _ref$loading = _ref.loading,
-      loading = _ref$loading === void 0 ? false : _ref$loading,
-      _ref$onClose = _ref.onClose,
-      onClose = _ref$onClose === void 0 ? function () {} : _ref$onClose,
-      _ref$onConfirm = _ref.onConfirm,
-      onConfirm = _ref$onConfirm === void 0 ? function () {} : _ref$onConfirm;
-  return React.createElement(Modal$1, {
-    open: true,
-    onClose: onClose,
-    "aria-labelledby": "modal-modal-title",
-    "aria-describedby": "modal-modal-description",
-    className: 'confirm-modal'
-  }, React.createElement(Box$1, {
-    style: style$3
-  }, React.createElement("p", null, message), React.createElement("div", {
-    className: 'footer'
-  }, React.createElement(Button, {
-    onClick: onClose,
-    disabled: loading
-  }, "Cancel"), React.createElement(Button, {
-    onClick: onConfirm
-  }, loading ? React.createElement(CircularProgress, {
-    size: "22px"
-  }) : 'OK'))));
-};
-
 var _excluded$2 = ["label", "field", "theme", "disableDropdown"];
 var RadioField = function RadioField(_ref) {
   var label = _ref.label,