tf-checkout-react 1.2.15 → 1.2.18

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

@@ -1,9 +1,9 @@
-/// <reference types="react" />
 import './style.css';
 import { ThemeOptions } from '@mui/material';
 import { CSSProperties } from '@mui/styles';
 import { AxiosError } from 'axios';
 import { FormikHelpers, FormikValues } from 'formik';
+import React from 'react';
 import { IBillingInfoData } from '../../types';
 export interface IBillingInfoPage {
     data?: IBillingInfoData[];
@@ -49,4 +49,4 @@ export interface IBillingInfoPage {
     showSignUpButton?: boolean;
     brandOptIn?: 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, onForgotPasswordSuccess, onForgotPasswordError, shouldFetchCountries, onCountdownFinish, enableTimer, logo, showForgotPasswordButton, showSignUpButton, brandOptIn, }: IBillingInfoPage) => JSX.Element;
+export declare const BillingInfoContainer: React.MemoExoticComponent<({ 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, onForgotPasswordSuccess, onForgotPasswordError, shouldFetchCountries, onCountdownFinish, enableTimer, logo, showForgotPasswordButton, showSignUpButton, brandOptIn, }: IBillingInfoPage) => JSX.Element>;

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

@@ -7,5 +7,6 @@ export interface IPhoneNumberField {
     type: string;
     disableDropdown: boolean;
     fill: boolean;
+    setPhoneValidationIsLoading: (isLoading: boolean) => void;
 }
-export declare const PhoneNumberField: ({ label, field, form: { errors, touched, setFieldError, setStatus, values, initialValues, setFieldValue, setFieldTouched, }, disableDropdown, fill, }: IPhoneNumberField) => JSX.Element;
+export declare const PhoneNumberField: ({ label, field, form: { errors, touched, setFieldError, values, initialValues, setFieldValue, setFieldTouched, }, disableDropdown, fill, setPhoneValidationIsLoading, }: IPhoneNumberField) => JSX.Element;

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

@@ -1682,7 +1682,6 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
       errors = _ref$form.errors,
       touched = _ref$form.touched,
       setFieldError = _ref$form.setFieldError,
-      setStatus = _ref$form.setStatus,
       values = _ref$form.values,
       initialValues = _ref$form.initialValues,
       setFieldValue = _ref$form.setFieldValue,
@@ -1690,7 +1689,8 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
       _ref$disableDropdown = _ref.disableDropdown,
       disableDropdown = _ref$disableDropdown === void 0 ? true : _ref$disableDropdown,
       _ref$fill = _ref.fill,
-      fill = _ref$fill === void 0 ? false : _ref$fill;
+      fill = _ref$fill === void 0 ? false : _ref$fill,
+      setPhoneValidationIsLoading = _ref.setPhoneValidationIsLoading;
 
   var error = _get(errors, field.name);
 
@@ -1700,34 +1700,25 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
     return void cb();
   }, 1000), []);
   React.useEffect(function () {
-    if (field.value === '+') {
-      setFieldError(field.name, '');
-      setFieldTouched(field.name, false);
-      return;
-    }
-
     if (field.value) {
-      var _setStatus;
-
-      setStatus((_setStatus = {}, _setStatus[field.name] = true, _setStatus));
+      setPhoneValidationIsLoading(true);
     }
 
     debounceCb( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee() {
-      var message, _setStatus2;
-
+      var message;
       return runtime_1.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
               _context.prev = 0;
 
-              if (!field.value) {
+              if (!values[field.name]) {
                 _context.next = 4;
                 break;
               }
 
               _context.next = 4;
-              return validatePhoneNumber(field.value);
+              return validatePhoneNumber(values[field.name]);
 
             case 4:
               setFieldError(field.name, '');
@@ -1738,11 +1729,14 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
               _context.prev = 7;
               _context.t0 = _context["catch"](0);
               message = _get(_context.t0, 'response.data.message', 'Invalid phone number');
-              setFieldError(field.name, message);
+
+              if (values[field.name]) {
+                setFieldError(field.name, message);
+              }
 
             case 11:
               _context.prev = 11;
-              setStatus((_setStatus2 = {}, _setStatus2[field.name] = false, _setStatus2));
+              setPhoneValidationIsLoading(false);
               return _context.finish(11);
 
             case 14:
@@ -1755,14 +1749,14 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
   }, [field.value]);
   return React__default.createElement(React__default.Fragment, null, React__default.createElement(MuiPhoneNumber, {
     name: field.name,
-    value: fill ? values.phone : initialValues.phone,
+    value: fill ? values[field.name] : initialValues[field.name],
     onChange: function onChange(value, country) {
-      if ("+" + (country == null ? void 0 : country.dialCode) !== value) {
-        setFieldTouched(field.name, true);
-        setFieldValue(field.name, value);
-      } else {
+      if ("+" + (country == null ? void 0 : country.dialCode) === value || value === '+') {
         setFieldValue(field.name, '');
         setFieldError(field.name, '');
+      } else {
+        setFieldTouched(field.name, true);
+        setFieldValue(field.name, value);
       }
     },
     variant: "outlined",
@@ -2764,7 +2758,7 @@ var LogicRunner = function LogicRunner(_ref) {
   return null;
 };
 
-var BillingInfoContainer = function BillingInfoContainer(_ref3) {
+var BillingInfoContainer = /*#__PURE__*/React__default.memo(function (_ref3) {
   var _ref3$data = _ref3.data,
       data = _ref3$data === void 0 ? [] : _ref3$data,
       _ref3$ticketHoldersFi = _ref3.ticketHoldersFields,
@@ -2781,34 +2775,34 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       _ref3$theme = _ref3.theme,
       theme = _ref3$theme === void 0 ? 'light' : _ref3$theme,
       _ref3$onRegisterSucce = _ref3.onRegisterSuccess,
-      onRegisterSuccess = _ref3$onRegisterSucce === void 0 ? function () {} : _ref3$onRegisterSucce,
+      onRegisterSuccess = _ref3$onRegisterSucce === void 0 ? _identity : _ref3$onRegisterSucce,
       _ref3$onRegisterError = _ref3.onRegisterError,
-      onRegisterError = _ref3$onRegisterError === void 0 ? function () {} : _ref3$onRegisterError,
+      onRegisterError = _ref3$onRegisterError === void 0 ? _identity : _ref3$onRegisterError,
       _ref3$onSubmitError = _ref3.onSubmitError,
-      onSubmitError = _ref3$onSubmitError === void 0 ? function () {} : _ref3$onSubmitError,
+      onSubmitError = _ref3$onSubmitError === void 0 ? _identity : _ref3$onSubmitError,
       _ref3$onGetCartSucces = _ref3.onGetCartSuccess,
-      onGetCartSuccess = _ref3$onGetCartSucces === void 0 ? function () {} : _ref3$onGetCartSucces,
+      onGetCartSuccess = _ref3$onGetCartSucces === void 0 ? _identity : _ref3$onGetCartSucces,
       _ref3$onGetCartError = _ref3.onGetCartError,
-      onGetCartError = _ref3$onGetCartError === void 0 ? function () {} : _ref3$onGetCartError,
+      onGetCartError = _ref3$onGetCartError === void 0 ? _identity : _ref3$onGetCartError,
       _ref3$onGetCountriesS = _ref3.onGetCountriesSuccess,
-      onGetCountriesSuccess = _ref3$onGetCountriesS === void 0 ? function () {} : _ref3$onGetCountriesS,
+      onGetCountriesSuccess = _ref3$onGetCountriesS === void 0 ? _identity : _ref3$onGetCountriesS,
       _ref3$onGetCountriesE = _ref3.onGetCountriesError,
-      onGetCountriesError = _ref3$onGetCountriesE === void 0 ? function () {} : _ref3$onGetCountriesE,
+      onGetCountriesError = _ref3$onGetCountriesE === void 0 ? _identity : _ref3$onGetCountriesE,
       _ref3$onGetStatesSucc = _ref3.onGetStatesSuccess,
-      onGetStatesSuccess = _ref3$onGetStatesSucc === void 0 ? function () {} : _ref3$onGetStatesSucc,
+      onGetStatesSuccess = _ref3$onGetStatesSucc === void 0 ? _identity : _ref3$onGetStatesSucc,
       _ref3$onGetStatesErro = _ref3.onGetStatesError,
-      onGetStatesError = _ref3$onGetStatesErro === void 0 ? function () {} : _ref3$onGetStatesErro,
+      onGetStatesError = _ref3$onGetStatesErro === void 0 ? _identity : _ref3$onGetStatesErro,
       _ref3$onGetProfileDat = _ref3.onGetProfileDataSuccess,
-      _onGetProfileDataSuccess = _ref3$onGetProfileDat === void 0 ? function () {} : _ref3$onGetProfileDat,
+      _onGetProfileDataSuccess = _ref3$onGetProfileDat === void 0 ? _identity : _ref3$onGetProfileDat,
       _ref3$onGetProfileDat2 = _ref3.onGetProfileDataError,
-      onGetProfileDataError = _ref3$onGetProfileDat2 === void 0 ? function () {} : _ref3$onGetProfileDat2,
+      onGetProfileDataError = _ref3$onGetProfileDat2 === void 0 ? _identity : _ref3$onGetProfileDat2,
       _ref3$onAuthorizeSucc = _ref3.onAuthorizeSuccess,
-      onAuthorizeSuccess = _ref3$onAuthorizeSucc === void 0 ? function () {} : _ref3$onAuthorizeSucc,
+      onAuthorizeSuccess = _ref3$onAuthorizeSucc === void 0 ? _identity : _ref3$onAuthorizeSucc,
       _ref3$onAuthorizeErro = _ref3.onAuthorizeError,
-      onAuthorizeError = _ref3$onAuthorizeErro === void 0 ? function () {} : _ref3$onAuthorizeErro,
+      onAuthorizeError = _ref3$onAuthorizeErro === void 0 ? _identity : _ref3$onAuthorizeErro,
       onLogin = _ref3.onLogin,
       _ref3$onLoginSuccess = _ref3.onLoginSuccess,
-      onLoginSuccess = _ref3$onLoginSuccess === void 0 ? function () {} : _ref3$onLoginSuccess,
+      onLoginSuccess = _ref3$onLoginSuccess === void 0 ? _identity : _ref3$onLoginSuccess,
       _ref3$isLoggedIn = _ref3.isLoggedIn,
       pIsLoggedIn = _ref3$isLoggedIn === void 0 ? false : _ref3$isLoggedIn,
       _ref3$accountInfoTitl = _ref3.accountInfoTitle,
@@ -2816,23 +2810,23 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       hideLogo = _ref3.hideLogo,
       themeOptions = _ref3.themeOptions,
       _ref3$onErrorClose = _ref3.onErrorClose,
-      onErrorClose = _ref3$onErrorClose === void 0 ? function () {} : _ref3$onErrorClose,
+      onErrorClose = _ref3$onErrorClose === void 0 ? _identity : _ref3$onErrorClose,
       _ref3$hideErrorsAlert = _ref3.hideErrorsAlertSection,
       hideErrorsAlertSection = _ref3$hideErrorsAlert === void 0 ? false : _ref3$hideErrorsAlert,
       _ref3$onSkipBillingPa = _ref3.onSkipBillingPage,
-      onSkipBillingPage = _ref3$onSkipBillingPa === void 0 ? function () {} : _ref3$onSkipBillingPa,
+      onSkipBillingPage = _ref3$onSkipBillingPa === void 0 ? _identity : _ref3$onSkipBillingPa,
       _ref3$skipPage = _ref3.skipPage,
       skipPage = _ref3$skipPage === void 0 ? false : _ref3$skipPage,
       _ref3$canSkipHolderNa = _ref3.canSkipHolderNames,
       canSkipHolderNames = _ref3$canSkipHolderNa === void 0 ? false : _ref3$canSkipHolderNa,
       _ref3$onForgotPasswor = _ref3.onForgotPasswordSuccess,
-      onForgotPasswordSuccess = _ref3$onForgotPasswor === void 0 ? function () {} : _ref3$onForgotPasswor,
+      onForgotPasswordSuccess = _ref3$onForgotPasswor === void 0 ? _identity : _ref3$onForgotPasswor,
       _ref3$onForgotPasswor2 = _ref3.onForgotPasswordError,
-      onForgotPasswordError = _ref3$onForgotPasswor2 === void 0 ? function () {} : _ref3$onForgotPasswor2,
+      onForgotPasswordError = _ref3$onForgotPasswor2 === void 0 ? _identity : _ref3$onForgotPasswor2,
       _ref3$shouldFetchCoun = _ref3.shouldFetchCountries,
       shouldFetchCountries = _ref3$shouldFetchCoun === void 0 ? true : _ref3$shouldFetchCoun,
       _ref3$onCountdownFini = _ref3.onCountdownFinish,
-      onCountdownFinish = _ref3$onCountdownFini === void 0 ? function () {} : _ref3$onCountdownFini,
+      onCountdownFinish = _ref3$onCountdownFini === void 0 ? _identity : _ref3$onCountdownFini,
       _ref3$enableTimer = _ref3.enableTimer,
       enableTimer = _ref3$enableTimer === void 0 ? false : _ref3$enableTimer,
       logo = _ref3.logo,
@@ -2920,6 +2914,10 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       error = _useState14[0],
       setError = _useState14[1];
 
+  var _useState15 = React.useState(false),
+      phoneValidationIsLoading = _useState15[0],
+      setPhoneValidationIsLoading = _useState15[1];
+
   var emailLogged = _get(userData, 'email', '') || _get(userValues, 'email', '');
 
   var firstNameLogged = _get(userData, 'first_name', '') || _get(userValues, 'first_name', '');
@@ -3125,6 +3123,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
 
   React.useEffect(function () {
     fetchUserData(access_token);
+    fetchCart();
   }, [access_token, isLoggedIn]);
   React.useEffect(function () {
     var collectPaymentData = /*#__PURE__*/function () {
@@ -3521,7 +3520,8 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
             }, element.onValidate ? element.onValidate : function () {
               return props.errors[element.name + "-" + index];
             }),
-            disableDropdown: element.disableDropdown
+            disableDropdown: element.disableDropdown,
+            setPhoneValidationIsLoading: setPhoneValidationIsLoading
           }));
         })));
       }));
@@ -3531,7 +3531,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
       type: "submit",
       variant: "contained",
       className: "login-register-button",
-      disabled: props.isSubmitting
+      disabled: props.isSubmitting || phoneValidationIsLoading
     }, props.isSubmitting ? React__default.createElement(material.CircularProgress, {
       size: 26
     }) : buttonName))));
@@ -3586,7 +3586,7 @@ var BillingInfoContainer = function BillingInfoContainer(_ref3) {
     onForgotPasswordSuccess: onForgotPasswordSuccess,
     onForgotPasswordError: onForgotPasswordError
   }));
-};
+});
 
 var currencyNormalizerCreator = function currencyNormalizerCreator(value, currency) {
   return !value ? '' : "" + getCurrencySymbolByCurrency(currency) + value;