tf-checkout-react-native 1.0.37 → 1.0.40

package/lib/containers/billingInfo/Billing.js

@@ -1,1367 +0,0 @@
-import _every from 'lodash/every';
-import _find from 'lodash/find';
-import _forEach from 'lodash/forEach';
-import _map from 'lodash/map';
-import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
-import { ActivityIndicator, Alert, Image, Linking, Text, View, } from 'react-native';
-import DeviceCountry, { TYPE_ANY } from 'react-native-device-country';
-import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view';
-import Constants from '../../api/Constants';
-import { Button, CartTimer, Checkbox, DatePicker, DropdownMaterial, Input, Loading, Login, PhoneInput, } from '../../components';
-import { BillingCore, SessionHandle } from '../../core';
-import { Config } from '../../helpers/Config';
-import { getCountryDialCode } from '../../helpers/CountryCodes';
-import { useDebounced } from '../../helpers/Debounced';
-import { getData, LocalStorageKeys } from '../../helpers/LocalStorage';
-import { emptyPhone } from '../../helpers/StringsHelper';
-import { validateAge, validateDropDownEmpty, validateEmail, validateEmpty, validatePasswords, validatePhoneNumber, } from '../../helpers/Validators';
-import R from '../../res';
-import s from './styles';
-/*
-  Fields to hide when ticket is free
-  - Billing Street Address
-  - City
-  - State/County
-  - Post Code/Zip
-  - Country
-*/
-const Billing = forwardRef(({ styles, texts, cartProps: { isAgeRequired, isNameRequired, isPhoneRequired, minimumAge, isBillingRequired, isTicketFree, isPhoneHidden, }, loginBrandImages, skipBillingConfig, areAlertsEnabled = true, areLoadingIndicatorsEnabled = true, onLoadingChange, onLoginError, onLoginSuccess, onRegisterError, onRegisterSuccess, onCheckoutSuccess, onCheckoutError, onFetchUserProfileSuccess, onFetchUserProfileError, onFetchCartError, onFetchCartSuccess, onFetchCountriesError, onFetchCountriesSuccess, onFetchStatesError, onFetchStatesSuccess, onSkippingStatusChange, onLogoutSuccess, onLogoutError, onCartExpired, shouldCartTimerNotMinimizeOnTap, config = {
-    isCheckoutAlwaysButtonEnabled: false,
-    shouldHideTicketHolderSectionOnSingleTicket: false,
-}, }, ref) => {
-    var _a, _b;
-    //#region State
-    const [isLoading, setIsLoading] = useState(false);
-    const [isSubmittingData, setIsSubmittingData] = useState(false);
-    const [loggedUserFirstName, setLoggedUserFirstName] = useState('');
-    const [loginMessage, setLoginMessage] = useState('');
-    const [firstName, setFirstName] = useState('');
-    const [lastName, setLastName] = useState('');
-    const [email, setEmail] = useState('');
-    const [emailConfirmation, setEmailConfirmation] = useState('');
-    const [password, setPassword] = useState('');
-    const [passwordConfirmation, setPasswordConfirmation] = useState('');
-    const [isSubToTicketFairy, setIsSubToTicketFairy] = useState(false);
-    const [isSubToBrand, setIsSubToBrand] = useState(false);
-    const [phone, setPhone] = useState('');
-    const [street, setStreet] = useState('');
-    const [city, setCity] = useState('');
-    const [countryId, setCountryId] = useState('');
-    const [stateId, setStateId] = useState('');
-    const [postalCode, setPostalCode] = useState('');
-    const [dateOfBirth, setDateOfBirth] = useState(undefined);
-    const [selectedCountry, setSelectedCountry] = useState(undefined);
-    const [selectedState, setSelectedState] = useState(undefined);
-    const [ticketHoldersData, setTicketHoldersData] = useState([]);
-    const [numberOfTicketHolders, setNumberOfTicketHolders] = useState(0);
-    const [states, setStates] = useState([]);
-    const [countries, setCountries] = useState([]);
-    const [isLoginDialogVisible, setIsLoginDialogVisible] = useState(false);
-    const [skippingStatus, setSkippingStatus] = useState(undefined);
-    const [isTtfCheckboxHidden, setIsTtfCheckboxHidden] = useState(false);
-    //#endregion State
-    //#region Labels
-    const holderLabels = useMemo(() => {
-        var _a, _b, _c, _d, _e, _f, _g;
-        if (numberOfTicketHolders === 1 &&
-            config.shouldHideTicketHolderSectionOnSingleTicket) {
-            return null;
-        }
-        const optional = isNameRequired
-            ? ''
-            : ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.optional) || '(optional)';
-        return {
-            firstName: ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.holderFirstName)
-                ? `${texts.form.holderFirstName} ${optional}`
-                : `First Name ${optional}`,
-            lastName: ((_c = texts === null || texts === void 0 ? void 0 : texts.form) === null || _c === void 0 ? void 0 : _c.holderLastName)
-                ? `${texts.form.holderLastName} ${optional}`
-                : `Last Name ${optional}`,
-            email: ((_d = texts === null || texts === void 0 ? void 0 : texts.form) === null || _d === void 0 ? void 0 : _d.holderEmail)
-                ? `${texts.form.holderEmail} ${((_e = texts === null || texts === void 0 ? void 0 : texts.form) === null || _e === void 0 ? void 0 : _e.optional) || '(optional)'}`
-                : `Email ${optional}`,
-            phone: ((_f = texts === null || texts === void 0 ? void 0 : texts.form) === null || _f === void 0 ? void 0 : _f.holderPhone)
-                ? `${texts.form.holderPhone} ${((_g = texts === null || texts === void 0 ? void 0 : texts.form) === null || _g === void 0 ? void 0 : _g.optional) || '(optional)'}`
-                : `Phone ${optional}`,
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [isNameRequired, texts, numberOfTicketHolders]);
-    const brandCheckBoxText = ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.isSubToBrand) ||
-        'I would like to be updated on news, events and offers.';
-    const phoneLabel = useMemo(() => {
-        var _a, _b, _c;
-        const optionalPhone = isPhoneRequired
-            ? ''
-            : ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.optional) || ' (optional)';
-        return ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.phone)
-            ? `${(_c = texts === null || texts === void 0 ? void 0 : texts.form) === null || _c === void 0 ? void 0 : _c.phone} ${optionalPhone}`
-            : `Phone ${optionalPhone}`;
-    }, [isPhoneRequired, texts]);
-    const addressLabel = useMemo(() => {
-        var _a, _b;
-        const optionalAddress = Config.IS_BILLING_STREET_NAME_REQUIRED
-            ? ''
-            : ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.optional) || ' (optional)';
-        return ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.street)
-            ? `${texts.form.street} ${optionalAddress}`
-            : `Street ${optionalAddress}`;
-    }, [texts]);
-    //#endregion Labels
-    // Cart expiration timer
-    const [secondsLeft, setSecondsLeft] = React.useState(420);
-    //#region Errors state
-    const firstNameError = useDebounced(firstName, validateEmpty);
-    const lastNameError = useDebounced(lastName, validateEmpty);
-    const emailError = useDebounced(email, () => validateEmail(email, emailConfirmation));
-    const confirmEmailError = useDebounced(emailConfirmation, () => validateEmail(emailConfirmation, email));
-    const passwordError = useDebounced(password, () => validatePasswords(password, passwordConfirmation));
-    const confirmPasswordError = useDebounced(passwordConfirmation, () => validatePasswords(passwordConfirmation, password));
-    const [phoneError, setPhoneError] = useState('');
-    const streetError = useDebounced(street, validateEmpty);
-    const cityError = useDebounced(city, validateEmpty);
-    const postalCodeError = useDebounced(postalCode, validateEmpty);
-    const [ttfPrivacyPolicyError, setTtfPrivacyPolicyError] = useState('');
-    const [firstNameErrorState, setFirstNameErrorState] = useState('');
-    const [lastNameErrorState, setLastNameErrorState] = useState('');
-    const [streetErrorState, setStreetErrorState] = useState('');
-    const [dateOfBirthError, setDateOfBirthError] = useState('');
-    const [emailErrorState, setEmailErrorState] = useState('');
-    const [emailConfirmationErrorState, setEmailConfirmationErrorState] = useState('');
-    const [cityErrorState, setCityErrorState] = useState('');
-    const [postalCodeErrorState, setPostalCodeErrorState] = useState('');
-    const [countryErrorState, setCountryErrorState] = useState('');
-    const [stateErrorState, setStateErrorState] = useState('');
-    const [passwordErrorState, setPasswordErrorState] = useState('');
-    const [confirmPasswordErrorState, setConfirmPasswordErrorState] = useState('');
-    const requiredText = (texts === null || texts === void 0 ? void 0 : texts.required) || 'Required';
-    //#endregion Errors state
-    //#endregion
-    const getSkippingStatus = (numOfTickets) => {
-        // DO NOT SKIP IF
-        // * User is not logged in.
-        // * Event Collect_names is turned on and tickets are more than one.
-        // * Event validate_age is turned on.
-        // * phone_required is turned on and customer does not have a phone number.
-        if (isBillingRequired || skippingStatus === 'fail') {
-            return 'false';
-        }
-        if ((isNameRequired && numOfTickets > 1) || isAgeRequired) {
-            return 'false';
-        }
-        else {
-            return 'skipping';
-        }
-    };
-    //#region Refs
-    const storedToken = useRef('');
-    const storedProfileData = useRef({});
-    const phoneErrorCounter = useRef(0);
-    const billingCoreRef = useRef(null);
-    const sessionHandleRef = useRef(null);
-    const phoneCountryCode = useRef('');
-    const errorsRef = useRef({
-        firstName: '',
-        lastName: '',
-        email: '',
-        confirmEmail: '',
-        password: '',
-        confirmPassword: '',
-        dateOfBirth: '',
-        phone: '',
-        street: '',
-        city: '',
-        country: '',
-        zipCode: '',
-        state: '',
-        privacy: '',
-    });
-    //#endregion
-    //#region Imperative Handler
-    useImperativeHandle(ref, () => ({
-        async refreshAccessToken(refreshToken) {
-            if (!sessionHandleRef.current) {
-                return {
-                    accessTokenError: {
-                        message: 'Session Handle ref is not initialized',
-                    },
-                };
-            }
-            const { accessTokenError, accessTokenData } = await sessionHandleRef.current.refreshAccessToken(refreshToken);
-            if (!accessTokenError && (accessTokenData === null || accessTokenData === void 0 ? void 0 : accessTokenData.accessToken)) {
-                await fetchData();
-            }
-            return {
-                accessTokenData,
-                accessTokenError,
-            };
-        },
-        async reloadData() {
-            await fetchData();
-        },
-    }));
-    //#endregion Imperative Handler
-    //#region Handlers
-    const handleSetPhoneError = useCallback((error) => {
-        if (isPhoneRequired && phone.length > 0) {
-            setPhoneError(error);
-        }
-    }, [isPhoneRequired, phone.length]);
-    const handleOnChangePhoneNumber = (payload) => {
-        var _a, _b, _c, _d;
-        setPhone(payload.input);
-        if (payload.isValid) {
-            errorsRef.current.phone = '';
-            setPhoneError('');
-            return;
-        }
-        if (!payload.isValid && phoneErrorCounter.current > 0) {
-            errorsRef.current.phone =
-                ((_b = (_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.phoneInput) === null || _b === void 0 ? void 0 : _b.customError) || 'Invalid phone number';
-            return handleSetPhoneError(((_d = (_c = texts === null || texts === void 0 ? void 0 : texts.form) === null || _c === void 0 ? void 0 : _c.phoneInput) === null || _d === void 0 ? void 0 : _d.customError) || 'Invalid phone number');
-        }
-        phoneErrorCounter.current = phoneErrorCounter.current + 1;
-    };
-    const handleOnLoadingChange = useCallback((loading) => {
-        if (onLoadingChange) {
-            onLoadingChange(loading);
-        }
-    }, [onLoadingChange]);
-    const handleOnSkippingStatusChange = useCallback((status) => {
-        onSkippingStatusChange === null || onSkippingStatusChange === void 0 ? void 0 : onSkippingStatusChange(status);
-    }, [onSkippingStatusChange]);
-    const showAlert = (text) => {
-        if (areAlertsEnabled) {
-            Alert.alert('', text);
-        }
-    };
-    const showLoginDialog = () => setIsLoginDialogVisible(true);
-    const hideLoginDialog = () => setIsLoginDialogVisible(false);
-    const handleIsSubToBrandToggle = () => {
-        setIsSubToBrand(!isSubToBrand);
-    };
-    const handleIsSubToTicketFairyToggle = () => {
-        const newValue = !isSubToTicketFairy;
-        if (newValue) {
-            errorsRef.current.privacy = '';
-            setTtfPrivacyPolicyError('');
-        }
-        else {
-            errorsRef.current.privacy = requiredText;
-            setTtfPrivacyPolicyError(requiredText);
-        }
-        setIsSubToTicketFairy(newValue);
-    };
-    const handleOpenPrivacyLink = async () => {
-        const canOpenLink = await Linking.canOpenURL(Constants.PRIVACY_POLICY_LINK);
-        if (canOpenLink) {
-            await Linking.openURL(Constants.PRIVACY_POLICY_LINK);
-        }
-    };
-    const handleSetFormDataFromUserProfile = (userProfile, accessToken) => {
-        storedProfileData.current = userProfile;
-        setFirstName(userProfile.firstName);
-        setLastName(userProfile.lastName);
-        setEmail(userProfile.email);
-        setEmailConfirmation(userProfile.email);
-        setPhone(userProfile.phone);
-        setStreet(userProfile.streetAddress);
-        setCity(userProfile.city);
-        setPostalCode(userProfile.zipCode);
-        setCountryId(userProfile.countryId);
-        setStateId(userProfile.stateId);
-        setLoggedUserFirstName(userProfile.firstName);
-        let dob;
-        if (userProfile.dateOfBirth) {
-            const dobSplitted = userProfile.dateOfBirth.split('-');
-            dob = new Date(parseInt(dobSplitted[0], 10), parseInt(dobSplitted[1], 10) - 1, parseInt(dobSplitted[2], 10));
-            handleOnSelectDate(dob);
-        }
-        const thData = [...ticketHoldersData];
-        thData.forEach((th, index) => {
-            th.firstName = index === 0 ? userProfile.firstName : '';
-            th.lastName = index === 0 ? userProfile.lastName : '';
-            th.email = index === 0 ? userProfile.email : '';
-            th.phone = index === 0 ? userProfile.phone : '';
-        });
-        setTicketHoldersData(thData);
-        if (accessToken) {
-            storedToken.current = accessToken;
-        }
-        showErrorMessages({
-            firstName: userProfile.firstName,
-            lastName: userProfile.lastName,
-            email: userProfile.email,
-            confirmEmail: userProfile.email,
-            street: userProfile.streetAddress,
-            city: userProfile.city,
-            selectedCountry: userProfile.countryId
-                ? {
-                    label: '',
-                    value: userProfile.countryId,
-                }
-                : undefined,
-            selectedState: userProfile.stateId
-                ? {
-                    label: '',
-                    value: userProfile.stateId,
-                }
-                : undefined,
-            postalCode: userProfile.zipCode,
-            dateOfBirth: dob,
-            phoneNumber: userProfile.phone,
-            isRegistering: !loggedUserFirstName && !storedToken.current,
-            ticketHolderData: ticketHoldersData,
-        });
-    };
-    const clearFormErrors = () => {
-        setFirstNameErrorState('');
-        setLastNameErrorState('');
-        setEmailErrorState('');
-        setEmailConfirmationErrorState('');
-        setDateOfBirthError('');
-        setPhoneError('');
-        setStreetErrorState('');
-        setCityErrorState('');
-        setCountryErrorState('');
-        setPostalCodeErrorState('');
-        setStateErrorState('');
-        setTtfPrivacyPolicyError('');
-        errorsRef.current = {
-            firstName: '',
-            lastName: '',
-            email: '',
-            confirmEmail: '',
-            password: '',
-            confirmPassword: '',
-            dateOfBirth: '',
-            phone: '',
-            street: '',
-            city: '',
-            country: '',
-            zipCode: '',
-            state: '',
-            privacy: '',
-        };
-    };
-    const handleOnLoginSuccess = async ({ userProfile, accessTokenData, }) => {
-        var _a, _b, _c;
-        clearFormErrors();
-        let countryCode = 'US';
-        const accessToken = await getData(LocalStorageKeys.ACCESS_TOKEN);
-        const usrProfile = { ...userProfile };
-        onLoginSuccess === null || onLoginSuccess === void 0 ? void 0 : onLoginSuccess({
-            userProfile,
-            accessTokenData,
-        });
-        try {
-            const deviceCountry = await DeviceCountry.getCountryCode(TYPE_ANY);
-            countryCode = deviceCountry.code.toUpperCase();
-        }
-        catch (err) {
-            countryCode = 'US';
-        }
-        if (!userProfile.phone) {
-            usrProfile.phone = '';
-        }
-        else {
-            if (!((_a = usrProfile.phone) === null || _a === void 0 ? void 0 : _a.includes('+'))) {
-                usrProfile.phone = `${getCountryDialCode(countryCode)}${usrProfile.phone}`;
-            }
-        }
-        if (!isBillingRequired && skippingStatus === 'fail') {
-            setSkippingStatus('skipping');
-            const phoneValidError = validatePhoneNumber({
-                phoneNumber: userProfile.phone,
-                customError: (_c = (_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.phoneInput) === null || _c === void 0 ? void 0 : _c.customError,
-            });
-            if (phoneValidError && isPhoneRequired) {
-                setIsLoading(false);
-                handleSetPhoneError((texts === null || texts === void 0 ? void 0 : texts.invalidPhoneNumberError) ||
-                    'Please enter a valid phone number');
-            }
-            await performCheckout(getCheckoutBodyWhenSkipping({
-                userProfile: usrProfile,
-                ticketsQuantity: numberOfTicketHolders || 1,
-            }));
-        }
-        handleSetFormDataFromUserProfile(usrProfile, accessToken);
-    };
-    const handleOnLoginError = (error) => {
-        onLoginError === null || onLoginError === void 0 ? void 0 : onLoginError(error);
-    };
-    const handleOnLogoutSuccess = async () => {
-        var _a, _b;
-        setFirstName('');
-        setLastName('');
-        setEmail('');
-        setEmailConfirmation('');
-        setPhone('');
-        setStreet('');
-        setCity('');
-        setPostalCode('');
-        setPassword('');
-        setPasswordConfirmation('');
-        setCountryId('');
-        setStateId('');
-        handleOnSelectDate(undefined);
-        setSelectedCountry({
-            value: '-1',
-            label: ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.country) || 'Country',
-            code: '__',
-        });
-        setStates([
-            {
-                value: '-1',
-                label: ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.state) || 'State/County',
-            },
-        ]);
-        setIsSubToTicketFairy(false);
-        setIsSubToBrand(false);
-        storedToken.current = '';
-        setLoggedUserFirstName('');
-        const thData = [...ticketHoldersData];
-        thData.forEach((th) => {
-            th.firstName = '';
-            th.lastName = '';
-            th.email = '';
-            th.phone = '';
-            th.firstNameError = '';
-            th.lastNameError = '';
-        });
-        setTicketHoldersData(thData);
-        onLogoutSuccess === null || onLogoutSuccess === void 0 ? void 0 : onLogoutSuccess();
-    };
-    //#region Handlers input changed
-    const handleOnSelectDate = (newDate) => {
-        setDateOfBirth(newDate);
-        if (dateOfBirthError.length > 0 && newDate) {
-            setDateOfBirthError('');
-        }
-        if (minimumAge) {
-            const ageError = validateAge(newDate, minimumAge);
-            setDateOfBirthError(ageError);
-        }
-        else {
-            if (!newDate) {
-                setDateOfBirthError(requiredText);
-            }
-        }
-    };
-    const handleOnStreetChanged = (text) => {
-        if (streetErrorState.length > 0 && text.length > 0) {
-            setStreetErrorState('');
-        }
-        setStreet(text);
-    };
-    const handleOnCityChanged = (text) => {
-        if (cityErrorState.length > 0 && text.length > 0) {
-            setCityErrorState('');
-        }
-        setCity(text);
-    };
-    const handleOnFirstNameChanged = (text) => {
-        if (firstNameErrorState.length > 0 && text.length > 0) {
-            setFirstNameErrorState('');
-        }
-        setFirstName(text);
-    };
-    const handleOnLastNameChanged = (text) => {
-        if (lastNameErrorState.length > 0 && text.length > 0) {
-            setLastNameErrorState('');
-        }
-        setLastName(text);
-    };
-    const handleOnEmailChanged = (text) => {
-        if (emailErrorState.length > 0 && text.length > 0) {
-            setEmailErrorState('');
-        }
-        setEmail(text);
-    };
-    const handleOnEmailConfirmationChanged = (text) => {
-        if (emailConfirmationErrorState.length > 0 && text.length > 0) {
-            setEmailConfirmationErrorState('');
-        }
-        setEmailConfirmation(text);
-    };
-    const handleOnPostalCodeChanged = (text) => {
-        if (postalCodeErrorState.length > 0 && text.length > 0) {
-            setPostalCodeErrorState('');
-        }
-        setPostalCode(text);
-    };
-    const handleOnStateChanged = (itm) => {
-        if (stateErrorState.length > 0 && itm.value !== '-1') {
-            setStateErrorState('');
-        }
-        else if (itm.value === '-1') {
-            setStateErrorState(requiredText);
-        }
-        setSelectedState(itm);
-    };
-    const handleOnCountryChanged = (itm) => {
-        if (countryErrorState.length > 0 && itm.value !== '-1') {
-            setCountryErrorState('');
-        }
-        else if (itm.value === '-1') {
-            setCountryErrorState(requiredText);
-        }
-        setSelectedCountry(itm);
-    };
-    const handleOnPasswordChanged = (text) => {
-        if (passwordErrorState.length > 0 && text.length > 0) {
-            setPasswordErrorState('');
-        }
-        setPassword(text);
-    };
-    const handleOnConfirmPasswordChanged = (text) => {
-        if (confirmPasswordErrorState.length > 0 && text.length > 0) {
-            setConfirmPasswordErrorState('');
-        }
-        setPasswordConfirmation(text);
-    };
-    //#endregion Handlers input changed
-    //#endregion
-    //#region Form validation
-    const checkIsStoredPhoneNumberFormat = (storedPhoneNumber) => {
-        if (!storedPhoneNumber) {
-            handleSetPhoneError((texts === null || texts === void 0 ? void 0 : texts.invalidPhoneNumberError) || 'Please enter a valid phone number');
-            return false;
-        }
-        if (!storedPhoneNumber.includes('+')) {
-            handleSetPhoneError((texts === null || texts === void 0 ? void 0 : texts.invalidPhoneNumberError) || 'Please enter a valid phone number');
-            return false;
-        }
-        return true;
-    };
-    const showErrorMessages = (data) => {
-        var _a, _b, _c, _d, _e, _f;
-        if (secondsLeft === 0) {
-            return false;
-        }
-        const validateFirstName = validateEmpty(data.firstName);
-        const validateLastName = validateEmpty(data.lastName);
-        const validateEmails = validateEmail(data.email, data.confirmEmail);
-        const validateEmailsConfirmation = validateEmail(data.confirmEmail, data.email);
-        if (isTicketFree) {
-            setFirstNameErrorState(validateFirstName);
-            setLastNameErrorState(validateLastName);
-            errorsRef.current.firstName = validateFirstName;
-            errorsRef.current.lastName = validateLastName;
-            setEmailErrorState(validateEmails);
-            setEmailConfirmationErrorState(validateEmailsConfirmation);
-            errorsRef.current.email = validateEmails;
-            errorsRef.current.confirmEmail = validateEmailsConfirmation;
-            if (data.isRegistering) {
-                const validatePassword = validatePasswords(data.password, data.confirmPassword);
-                const validatePasswordConfirmation = validatePasswords(data.confirmPassword, data.password);
-                setPasswordErrorState(validatePassword);
-                setConfirmPasswordErrorState(validatePasswordConfirmation);
-                errorsRef.current.password = validatePassword;
-                errorsRef.current.confirmPassword = validatePasswordConfirmation;
-            }
-            if (isAgeRequired) {
-                if (minimumAge) {
-                    const birthdayValidation = validateAge(data.dateOfBirth, minimumAge);
-                    setDateOfBirthError(birthdayValidation);
-                    errorsRef.current.dateOfBirth = birthdayValidation;
-                }
-                else {
-                    setDateOfBirthError(data.dateOfBirth ? '' : requiredText);
-                    errorsRef.current.dateOfBirth = data.dateOfBirth ? '' : requiredText;
-                }
-            }
-            if (isPhoneRequired && !isPhoneHidden) {
-                const validatePhone = validatePhoneNumber({
-                    phoneNumber: data.phoneNumber,
-                    customError: (_b = (_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.phoneInput) === null || _b === void 0 ? void 0 : _b.customError,
-                    countryCode: phoneCountryCode.current,
-                });
-                setPhoneError(validatePhone);
-                errorsRef.current.phone = validatePhone;
-            }
-            errorsRef.current.privacy = isSubToTicketFairy ? '' : requiredText;
-            if (isNameRequired) {
-                const ticketHoldersDataCopy = [...data.ticketHolderData];
-                _map(data.ticketHolderData, (th, index) => {
-                    if (isNameRequired) {
-                        ticketHoldersDataCopy[index].firstNameError = validateEmpty(th.firstName);
-                        ticketHoldersDataCopy[index].lastNameError = validateEmpty(th.lastName);
-                    }
-                });
-                setTicketHoldersData(ticketHoldersDataCopy);
-            }
-            return;
-        } // end of Ticket Free
-        const validateStreet = validateEmpty(data.street);
-        const validateCity = validateEmpty(data.city);
-        const validatePostalCode = validateEmpty(data.postalCode);
-        setStreetErrorState(validateStreet);
-        setCityErrorState(validateCity);
-        setPostalCodeErrorState(validatePostalCode);
-        setFirstNameErrorState(validateFirstName);
-        setLastNameErrorState(validateLastName);
-        setEmailErrorState(validateEmails);
-        setEmailConfirmationErrorState(validateEmailsConfirmation);
-        errorsRef.current.street = validateStreet;
-        errorsRef.current.city = validateCity;
-        errorsRef.current.zipCode = validatePostalCode;
-        errorsRef.current.firstName = validateFirstName;
-        errorsRef.current.lastName = validateLastName;
-        errorsRef.current.email = validateEmails;
-        errorsRef.current.confirmEmail = validateEmailsConfirmation;
-        if (data.isRegistering) {
-            const validatePassword = validatePasswords(data.password, data.confirmPassword);
-            const validatePasswordConfirmation = validatePasswords(data.confirmPassword, data.password);
-            setPasswordErrorState(validatePassword);
-            setConfirmPasswordErrorState(validatePasswordConfirmation);
-            errorsRef.current.password = validatePassword;
-            errorsRef.current.confirmPassword = validatePasswordConfirmation;
-        }
-        const countryValidation = validateDropDownEmpty((_c = data.selectedCountry) === null || _c === void 0 ? void 0 : _c.value);
-        setCountryErrorState(countryValidation);
-        errorsRef.current.country = countryValidation;
-        if (isAgeRequired) {
-            if (minimumAge) {
-                const birthdayValidation = validateAge(data.dateOfBirth, minimumAge);
-                setDateOfBirthError(birthdayValidation);
-                errorsRef.current.dateOfBirth = birthdayValidation;
-            }
-            else {
-                setDateOfBirthError(data.dateOfBirth ? '' : requiredText);
-                errorsRef.current.dateOfBirth = data.dateOfBirth ? '' : requiredText;
-            }
-        }
-        const validateState = validateDropDownEmpty((_d = data.selectedState) === null || _d === void 0 ? void 0 : _d.value);
-        setStateErrorState(validateState);
-        errorsRef.current.state = validateState;
-        if (isPhoneRequired && !isPhoneHidden) {
-            const validatePhone = validatePhoneNumber({
-                phoneNumber: data.phoneNumber,
-                customError: (_f = (_e = texts === null || texts === void 0 ? void 0 : texts.form) === null || _e === void 0 ? void 0 : _e.phoneInput) === null || _f === void 0 ? void 0 : _f.customError,
-                countryCode: phoneCountryCode.current,
-            });
-            setPhoneError(validatePhone);
-            errorsRef.current.phone = validatePhone;
-        }
-        //setTtfPrivacyPolicyError(isSubToTicketFairy ? '' : requiredText)
-        errorsRef.current.privacy = isSubToTicketFairy ? '' : requiredText;
-        if (isNameRequired) {
-            const ticketHoldersDataCopy = [...data.ticketHolderData];
-            _map(data.ticketHolderData, (th, index) => {
-                if (isNameRequired) {
-                    ticketHoldersDataCopy[index].firstNameError = validateEmpty(th.firstName);
-                    ticketHoldersDataCopy[index].lastNameError = validateEmpty(th.lastName);
-                }
-            });
-            setTicketHoldersData(ticketHoldersDataCopy);
-        }
-    };
-    const checkBasicDataValid = () => {
-        if (secondsLeft === 0) {
-            return false;
-        }
-        if (isTicketFree) {
-            if (errorsRef.current.firstName ||
-                errorsRef.current.lastName ||
-                errorsRef.current.email ||
-                errorsRef.current.confirmEmail) {
-                return false;
-            }
-        }
-        else {
-            if (errorsRef.current.firstName ||
-                errorsRef.current.lastName ||
-                errorsRef.current.email ||
-                errorsRef.current.confirmEmail ||
-                errorsRef.current.city ||
-                errorsRef.current.zipCode ||
-                errorsRef.current.state ||
-                errorsRef.current.country ||
-                errorsRef.current.street) {
-                return false;
-            }
-        }
-        if (isPhoneRequired && !isPhoneHidden && errorsRef.current.phone) {
-            if (isLoading) {
-                setIsLoading(false);
-            }
-            return false;
-        }
-        return true;
-    };
-    const fillAllRequiredFieldsAlert = ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.fillAllRequiredFieldsAlert) ||
-        'You must fill all Ticket Holder required fields';
-    const checkExtraDataValid = () => {
-        var _a;
-        if (!isTtfCheckboxHidden && !isSubToTicketFairy) {
-            setTtfPrivacyPolicyError(((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.ttfPrivacyPolicyRequiredError) || requiredText);
-            return 'Please review the errors';
-        }
-        if (isAgeRequired) {
-            if (!dateOfBirth) {
-                setDateOfBirthError(requiredText);
-                return 'Please enter your date of birth';
-            }
-            if (minimumAge) {
-                const ageValidationMessage = validateAge(dateOfBirth, minimumAge);
-                if (ageValidationMessage) {
-                    setDateOfBirthError(ageValidationMessage);
-                    return ageValidationMessage;
-                }
-            }
-        }
-        if (!isNameRequired) {
-            return '';
-        }
-        if (ticketHoldersData.length === 1 &&
-            config.shouldHideTicketHolderSectionOnSingleTicket) {
-            return '';
-        }
-        return _every(_map(ticketHoldersData, (th) => validateEmpty(th.firstName) || validateEmpty(th.lastName)), (itm) => itm === '')
-            ? ''
-            : fillAllRequiredFieldsAlert;
-    };
-    //#endregion
-    //#region Submit form
-    const handleOnRegisterFail = (rawError) => {
-        onRegisterError === null || onRegisterError === void 0 ? void 0 : onRegisterError(rawError);
-    };
-    const performCheckout = async (checkoutBodyWhenSkipping) => {
-        if (!billingCoreRef.current) {
-            return onCheckoutError === null || onCheckoutError === void 0 ? void 0 : onCheckoutError({ message: 'BillingCore is not ready' });
-        }
-        const checkoutBody = checkoutBodyWhenSkipping || getCheckoutBody();
-        setIsSubmittingData(true);
-        const { error: checkoutError, data: checkoutData } = await billingCoreRef.current.checkoutOrder(checkoutBody);
-        setIsLoading(false);
-        setIsSubmittingData(false);
-        if (checkoutError) {
-            onCheckoutError === null || onCheckoutError === void 0 ? void 0 : onCheckoutError(checkoutError);
-            setSkippingStatus('false');
-            return showAlert(checkoutError.message);
-        }
-        if (!checkoutData) {
-            onCheckoutError === null || onCheckoutError === void 0 ? void 0 : onCheckoutError({ message: 'Checkout returned not data' });
-            setSkippingStatus('false');
-            return showAlert('Checkout returned not data');
-        }
-        setSkippingStatus('success');
-        billingCoreRef.current.stopCartTimer();
-        onCheckoutSuccess(checkoutData);
-    };
-    const getRegisterFormData = (data) => {
-        const bodyFormData = new FormData();
-        _forEach(data.attributes, (item, key) => {
-            bodyFormData.append(key, item);
-        });
-        return bodyFormData;
-    };
-    const performNewUserRegister = async () => {
-        if (!billingCoreRef.current) {
-            showAlert('BillingCore is not ready');
-            return onRegisterError === null || onRegisterError === void 0 ? void 0 : onRegisterError({ message: 'BillingCore is not initialized' });
-        }
-        setIsSubmittingData(true);
-        const registerUserBody = getRegisterNewUserBody();
-        const registerForm = getRegisterFormData(registerUserBody);
-        const { registerNewUserResponseData, registerNewUserResponseError } = await billingCoreRef.current.registerNewUser(registerForm);
-        if (registerNewUserResponseError) {
-            setIsSubmittingData(false);
-            if (registerNewUserResponseError.isAlreadyRegistered) {
-                setLoginMessage(registerNewUserResponseError.message);
-                showLoginDialog();
-                return handleOnRegisterFail(registerNewUserResponseError.raw);
-            }
-            handleOnRegisterFail(registerNewUserResponseError.raw);
-            return showAlert(registerNewUserResponseError.message);
-        }
-        if (!registerNewUserResponseData) {
-            setIsSubmittingData(false);
-            handleOnRegisterFail('Register user returned no data');
-            return showAlert('Register user returned no data');
-        }
-        storedToken.current =
-            registerNewUserResponseData.accessTokenData.accessToken;
-        onRegisterSuccess === null || onRegisterSuccess === void 0 ? void 0 : onRegisterSuccess(registerNewUserResponseData);
-        await performCheckout();
-    };
-    const getRegisterNewUserBody = () => {
-        const phoneNumber = isPhoneRequired ? phone : emptyPhone(phone);
-        const body = isTicketFree
-            ? {
-                attributes: {
-                    email: email,
-                    first_name: firstName,
-                    last_name: lastName,
-                    password: password,
-                    phone: phoneNumber,
-                    password_confirmation: passwordConfirmation,
-                    client_id: Config.CLIENT_ID,
-                    client_secret: Config.CLIENT_SECRET,
-                    check_cart_expiration: true,
-                },
-            }
-            : {
-                attributes: {
-                    city: city,
-                    country: parseInt(selectedCountry.value, 10),
-                    email: email,
-                    first_name: firstName,
-                    last_name: lastName,
-                    password: password,
-                    phone: phoneNumber,
-                    state: parseInt(selectedState.value, 10),
-                    street_address: street,
-                    zip: postalCode,
-                    password_confirmation: passwordConfirmation,
-                    client_id: Config.CLIENT_ID,
-                    client_secret: Config.CLIENT_SECRET,
-                    check_cart_expiration: true,
-                },
-            };
-        if (body.attributes.phone === undefined) {
-            delete body.attributes.phone;
-        }
-        if (isAgeRequired && dateOfBirth) {
-            body.attributes.dob_day = dateOfBirth.getDate();
-            body.attributes.dob_month = dateOfBirth.getMonth() + 1;
-            body.attributes.dob_year = dateOfBirth.getFullYear();
-        }
-        return body;
-    };
-    const getCheckoutBody = () => {
-        let parsedTicketHolders = [];
-        if (config.shouldHideTicketHolderSectionOnSingleTicket &&
-            numberOfTicketHolders) {
-            parsedTicketHolders.push({
-                first_name: firstName,
-                last_name: lastName,
-                phone: phone,
-                email: email,
-            });
-        }
-        else {
-            for (let i = 0; i <= numberOfTicketHolders - 1; i++) {
-                const individualHolder = {
-                    first_name: ticketHoldersData[i].firstName || '',
-                    last_name: ticketHoldersData[i].lastName || '',
-                    phone: ticketHoldersData[i].phone || '',
-                    email: ticketHoldersData[i].email || '',
-                };
-                parsedTicketHolders.push(individualHolder);
-            }
-        }
-        const formattedPhone = isPhoneRequired ? phone : emptyPhone(phone);
-        const checkoutBody = isTicketFree
-            ? {
-                attributes: {
-                    confirm_email: emailConfirmation,
-                    email: email,
-                    first_name: firstName,
-                    last_name: lastName,
-                    password: password,
-                    phone: formattedPhone,
-                    ticket_holders: parsedTicketHolders,
-                    ttf_opt_in: isSubToTicketFairy,
-                    brand_opt_in: isSubToBrand,
-                },
-            }
-            : {
-                attributes: {
-                    city: city,
-                    confirm_email: emailConfirmation,
-                    country: parseInt(selectedCountry.value, 10),
-                    email: email,
-                    first_name: firstName,
-                    last_name: lastName,
-                    password: password,
-                    phone: formattedPhone,
-                    state: parseInt(selectedState.value, 10),
-                    street_address: street,
-                    zip: postalCode,
-                    ticket_holders: parsedTicketHolders,
-                    ttf_opt_in: isSubToTicketFairy,
-                    brand_opt_in: isSubToBrand,
-                },
-            };
-        if (isAgeRequired && dateOfBirth) {
-            checkoutBody.attributes.dob_day = dateOfBirth.getDate();
-            checkoutBody.attributes.dob_month = dateOfBirth.getMonth() + 1;
-            checkoutBody.attributes.dob_year = dateOfBirth.getFullYear();
-        }
-        if (checkoutBody.attributes.phone === undefined) {
-            delete checkoutBody.attributes.phone;
-        }
-        return checkoutBody;
-    };
-    const getCheckoutBodyWhenSkipping = ({ userProfile, ticketsQuantity, }) => {
-        let parsedTicketHolders = [];
-        const hFirstName = userProfile.firstName;
-        const hLastName = userProfile.lastName;
-        const hPhone = userProfile.phone;
-        const hEmail = userProfile.email;
-        for (let i = 0; i <= ticketsQuantity - 1; i++) {
-            const individualHolder = i
-                ? {
-                    first_name: '',
-                    last_name: '',
-                    phone: '',
-                    email: '',
-                }
-                : {
-                    first_name: hFirstName,
-                    last_name: hLastName,
-                    phone: hPhone,
-                    email: hEmail,
-                };
-            parsedTicketHolders.push(individualHolder);
-        }
-        const checkoutBody = isTicketFree
-            ? {
-                attributes: {
-                    confirm_email: userProfile.email,
-                    email: userProfile.email,
-                    first_name: userProfile.firstName,
-                    last_name: userProfile.lastName,
-                    phone: userProfile.phone,
-                    ticket_holders: parsedTicketHolders,
-                    ttf_opt_in: isSubToTicketFairy,
-                    brand_opt_in: isSubToBrand,
-                    password: password,
-                },
-            }
-            : {
-                attributes: {
-                    city: userProfile.city,
-                    confirm_email: userProfile.email,
-                    country: parseInt(userProfile.countryId, 10),
-                    email: userProfile.email,
-                    first_name: userProfile.firstName,
-                    last_name: userProfile.lastName,
-                    phone: userProfile.phone,
-                    state: parseInt(userProfile.stateId, 10),
-                    street_address: userProfile.streetAddress,
-                    zip: userProfile.zipCode,
-                    ticket_holders: parsedTicketHolders,
-                    ttf_opt_in: isSubToTicketFairy,
-                    brand_opt_in: isSubToBrand,
-                    password: password,
-                },
-            };
-        if (checkoutBody.attributes.phone === undefined) {
-            delete checkoutBody.attributes.phone;
-        }
-        return checkoutBody;
-    };
-    const onSubmit = async () => {
-        showErrorMessages({
-            firstName: firstName,
-            lastName: lastName,
-            email: email,
-            confirmEmail: emailConfirmation,
-            password: password,
-            confirmPassword: passwordConfirmation,
-            street: street,
-            city: city,
-            selectedCountry: selectedCountry,
-            selectedState: selectedState,
-            postalCode: postalCode,
-            dateOfBirth: dateOfBirth,
-            phoneNumber: phone,
-            isRegistering: !loggedUserFirstName && !storedToken.current,
-            ticketHolderData: ticketHoldersData,
-        });
-        const isBasicDataValid = checkBasicDataValid();
-        const isExtraDataValidErrors = checkExtraDataValid();
-        if (isExtraDataValidErrors || !isBasicDataValid) {
-            return;
-        }
-        if (loggedUserFirstName && storedToken.current) {
-            await performCheckout();
-        }
-        else {
-            await performNewUserRegister();
-        }
-    };
-    //#endregion
-    const setCountryByEvent = async () => {
-        const eventCountry = await getData(LocalStorageKeys.EVENT_COUNTRY);
-        if (!eventCountry) {
-            return;
-        }
-        if (countries.length > 1 && eventCountry) {
-            const selectedCountryItem = _find(countries, (item) => {
-                const stringValue = item.code;
-                return stringValue.toUpperCase() === (eventCountry === null || eventCountry === void 0 ? void 0 : eventCountry.toUpperCase());
-            });
-            setSelectedCountry(selectedCountryItem);
-        }
-    };
-    //#region Fetch Initial Data
-    const fetchData = async () => {
-        var _a, _b;
-        if (!billingCoreRef.current) {
-            onFetchCartError === null || onFetchCartError === void 0 ? void 0 : onFetchCartError({ message: 'BillingCoreRef not initialized' });
-            return showAlert('BillingCoreRef not initialized');
-        }
-        setIsLoading(true);
-        let usrPrfl;
-        const usrTkn = await getData(LocalStorageKeys.ACCESS_TOKEN);
-        let skippingStatusInner;
-        const { countriesData, countriesError } = await billingCoreRef.current.getCountries();
-        if (countriesError) {
-            setSkippingStatus('fail');
-            setIsLoading(false);
-            onFetchCountriesError === null || onFetchCountriesError === void 0 ? void 0 : onFetchCountriesError(countriesError);
-            return showAlert(countriesError.message || 'Error fetching countries');
-        }
-        onFetchCountriesSuccess === null || onFetchCountriesSuccess === void 0 ? void 0 : onFetchCountriesSuccess(countriesData);
-        const parsedCountries = _map(countriesData, (item) => {
-            return { label: item.name, value: item.id, code: item.code };
-        });
-        if (usrTkn) {
-            storedToken.current = usrTkn;
-            const { userProfileError, userProfileData } = await billingCoreRef.current.getUserProfile();
-            if (userProfileError || !userProfileData) {
-                setSkippingStatus('fail');
-                setIsLoading(false);
-                onFetchUserProfileError === null || onFetchUserProfileError === void 0 ? void 0 : onFetchUserProfileError(userProfileError);
-                return showAlert((userProfileError === null || userProfileError === void 0 ? void 0 : userProfileError.message) || 'Error fetching user profile');
-            }
-            onFetchUserProfileSuccess === null || onFetchUserProfileSuccess === void 0 ? void 0 : onFetchUserProfileSuccess({
-                firstName: userProfileData.firstName,
-                lastName: userProfileData.lastName,
-            });
-            usrPrfl = userProfileData;
-        }
-        else {
-            skippingStatusInner = 'fail';
-            parsedCountries.unshift({
-                value: '-1',
-                label: ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.country) || 'Country',
-                code: '__',
-            });
-            setSelectedCountry({
-                value: '-1',
-                label: ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.country) || 'Country',
-                code: '__',
-            });
-        }
-        const { cartData, cartError } = await billingCoreRef.current.getCart();
-        if (cartError || !cartData) {
-            setSkippingStatus('fail');
-            setIsLoading(false);
-            onFetchCartError === null || onFetchCartError === void 0 ? void 0 : onFetchCartError(cartError || { message: 'Error fetching cart' });
-            return showAlert((cartError === null || cartError === void 0 ? void 0 : cartError.message) || 'Error fetching cart');
-        }
-        onFetchCartSuccess === null || onFetchCartSuccess === void 0 ? void 0 : onFetchCartSuccess();
-        if (skippingStatusInner === 'fail') {
-            setSkippingStatus('fail');
-        }
-        else {
-            setSkippingStatus(getSkippingStatus(cartData.quantity));
-        }
-        setNumberOfTicketHolders(cartData.quantity);
-        setIsSubToBrand(cartData.isMarketingOptedIn);
-        setIsSubToTicketFairy(cartData.isTfOptIn || false);
-        setIsTtfCheckboxHidden(cartData.isTfOptInHidden || false);
-        if (cartData.expiresAt) {
-            setSecondsLeft(cartData.expiresAt);
-        }
-        const tHolders = [];
-        for (let i = 0; i < cartData.quantity; i++) {
-            tHolders.push({
-                firstName: i === 0 && usrPrfl ? usrPrfl.firstName : '',
-                lastName: i === 0 && usrPrfl ? usrPrfl.lastName : '',
-                email: i === 0 && usrPrfl ? usrPrfl.email : '',
-                phone: i === 0 && usrPrfl ? usrPrfl.phone : '',
-                firstNameError: '',
-                lastNameError: '',
-            });
-        }
-        let phoneCountry = 'US';
-        let phoneCountryDialCode = '+1';
-        const eventCountry = await getData(LocalStorageKeys.EVENT_COUNTRY);
-        if (eventCountry) {
-            phoneCountry = eventCountry.toUpperCase();
-            phoneCountryDialCode = getCountryDialCode(phoneCountry);
-        }
-        else {
-            try {
-                const deviceCountry = await DeviceCountry.getCountryCode(TYPE_ANY);
-                phoneCountry = deviceCountry.code.toUpperCase();
-                phoneCountryDialCode = getCountryDialCode(phoneCountry);
-            }
-            catch (err) {
-                phoneCountry = 'US';
-            }
-        }
-        if (usrPrfl) {
-            if (!isPhoneHidden && isPhoneRequired) {
-                if (!checkIsStoredPhoneNumberFormat(usrPrfl.phone)) {
-                    setPhoneError((texts === null || texts === void 0 ? void 0 : texts.invalidPhoneNumberError) ||
-                        'Please enter a valid phone number');
-                    skippingStatusInner = 'fail';
-                    setSkippingStatus('fail');
-                    setIsLoading(false);
-                }
-                else {
-                    // We can perform Checkout process since phone is valid
-                    if (!isBillingRequired && usrTkn && cartData) {
-                        const checkoutBody = getCheckoutBodyWhenSkipping({
-                            userProfile: usrPrfl,
-                            ticketsQuantity: cartData.quantity,
-                        });
-                        return await performCheckout(checkoutBody);
-                    }
-                    else {
-                        if (skippingStatusInner === 'skipping') {
-                            setSkippingStatus('fail');
-                        }
-                    }
-                }
-            }
-            else {
-                // We can perform Checkout process since phone is valid
-                if (!isBillingRequired && usrTkn && cartData) {
-                    const checkoutBody = getCheckoutBodyWhenSkipping({
-                        userProfile: usrPrfl,
-                        ticketsQuantity: cartData.quantity,
-                    });
-                    return await performCheckout(checkoutBody);
-                }
-                else {
-                    if (skippingStatusInner === 'skipping') {
-                        setSkippingStatus('fail');
-                    }
-                }
-            }
-            const userPhone = usrPrfl.phone === null ? phoneCountryDialCode : usrPrfl.phone;
-            if (userPhone.length <= 5) {
-                phoneCountryCode.current = userPhone;
-            }
-            handleSetFormDataFromUserProfile({
-                ...usrPrfl,
-                phone: userPhone,
-            });
-        }
-        else {
-            // There is no user profile data
-            phoneCountryCode.current = phoneCountryDialCode;
-            setPhone(phoneCountryDialCode);
-        }
-        setCountries(parsedCountries);
-        setTicketHoldersData(tHolders);
-        setIsSubmittingData(false);
-        setIsLoading(false);
-    };
-    //#endregion Fetch Initial Data
-    //#region Effects
-    useEffect(() => {
-        handleOnLoadingChange(isLoading);
-    }, [isLoading, handleOnLoadingChange]);
-    useEffect(() => {
-        handleOnSkippingStatusChange(skippingStatus);
-    }, [handleOnSkippingStatusChange, skippingStatus]);
-    useEffect(() => {
-        if (countryId) {
-            if (countries.length > 1) {
-                const selectedCountryItem = _find(countries, (item) => item.value === countryId);
-                setSelectedCountry(selectedCountryItem);
-            }
-        }
-        else {
-            setCountryByEvent();
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [countries, countryId]);
-    useEffect(() => {
-        const getStates = async () => {
-            if (!selectedCountry) {
-                return;
-            }
-            if (!billingCoreRef.current) {
-                onFetchCartError === null || onFetchCartError === void 0 ? void 0 : onFetchCartError({ message: 'BillingCoreRef not initialized' });
-                return showAlert('BillingCoreRef not initialized');
-            }
-            const { statesData, statesError } = await billingCoreRef.current.getStates(selectedCountry.value.toString());
-            if (statesError) {
-                onFetchStatesError === null || onFetchStatesError === void 0 ? void 0 : onFetchStatesError(statesError);
-                return showAlert((statesError === null || statesError === void 0 ? void 0 : statesError.message) || 'Error fetching states');
-            }
-            const parsedStates = _map(statesData, (item, index) => {
-                return { label: item, value: index };
-            });
-            onFetchStatesSuccess === null || onFetchStatesSuccess === void 0 ? void 0 : onFetchStatesSuccess();
-            setStates(parsedStates);
-        };
-        if (selectedCountry && selectedCountry.value !== '-1') {
-            getStates();
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [selectedCountry]);
-    useEffect(() => {
-        var _a, _b;
-        if (states.length > 1 && stateId) {
-            const selectedStateItem = _find(states, (item) => item.value === stateId);
-            if (!selectedStateItem) {
-                return setSelectedState({
-                    value: '-1',
-                    label: ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.state) || 'State/County',
-                });
-            }
-            setSelectedState(selectedStateItem);
-        }
-        else {
-            setSelectedState({
-                value: '-1',
-                label: ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.state) || 'State/County',
-            });
-        }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [stateId, states]);
-    useEffect(() => {
-        var _a, _b;
-        setCountries([
-            {
-                value: '-1',
-                label: ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.country) || 'Country',
-            },
-        ]);
-        setStates([
-            {
-                value: '-1',
-                label: ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.state) || 'State/County',
-            },
-        ]);
-        fetchData();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    //#endregion
-    const isDataValid = checkBasicDataValid();
-    const isButtonDisabled = config.isCheckoutAlwaysButtonEnabled
-        ? false
-        : !isDataValid;
-    //#region RENDER
-    const renderTicketHolders = () => {
-        var _a, _b;
-        if (!numberOfTicketHolders ||
-            !holderLabels ||
-            ticketHoldersData.length === 0) {
-            return null;
-        }
-        let tHolders = [];
-        for (let i = 0; i < numberOfTicketHolders; i++) {
-            const thItemTitle = ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.ticketHolderItem) || 'Ticket Holder';
-            tHolders.push(React.createElement(View, { key: `ticketHolder.${i}` },
-                React.createElement(Text, { style: styles === null || styles === void 0 ? void 0 : styles.ticketHolderItemHeader },
-                    thItemTitle,
-                    " ",
-                    i + 1),
-                React.createElement(Input, { label: holderLabels.firstName, value: ticketHoldersData[i].firstName, onChangeText: (text) => {
-                        const copyTicketHolders = [...ticketHoldersData];
-                        copyTicketHolders[i].firstName = text;
-                        copyTicketHolders[i].firstNameError = validateEmpty(text);
-                        setTicketHoldersData(copyTicketHolders);
-                    }, error: ticketHoldersData[i].firstNameError, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles }),
-                React.createElement(Input, { label: holderLabels.lastName, value: ticketHoldersData[i].lastName, onChangeText: (text) => {
-                        const copyTicketHolders = [...ticketHoldersData];
-                        copyTicketHolders[i].lastName = text;
-                        copyTicketHolders[i].lastNameError = validateEmpty(text);
-                        setTicketHoldersData(copyTicketHolders);
-                    }, error: ticketHoldersData[i].lastNameError, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles }),
-                React.createElement(Input, { label: holderLabels.email, value: ticketHoldersData[i].email, onChangeText: (text) => {
-                        const copyTicketHolders = [...ticketHoldersData];
-                        copyTicketHolders[i].email = text;
-                        setTicketHoldersData(copyTicketHolders);
-                    }, keyboardType: 'email-address', styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles, autoCapitalize: 'none' }),
-                React.createElement(Input, { label: holderLabels.phone, value: ticketHoldersData[i].phone, onChangeText: (text) => {
-                        const copyTicketHolders = [...ticketHoldersData];
-                        copyTicketHolders[i].phone = text;
-                        setTicketHoldersData(copyTicketHolders);
-                    }, keyboardType: 'phone-pad', styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles })));
-        }
-        return (React.createElement(React.Fragment, null,
-            React.createElement(Text, { style: styles === null || styles === void 0 ? void 0 : styles.ticketHoldersTitle }, ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.ticketHoldersTitle) || 'Ticket Holders'),
-            tHolders));
-    };
-    const renderCheckingOut = () => {
-        var _a, _b;
-        const skippingStyles = skipBillingConfig === null || skipBillingConfig === void 0 ? void 0 : skipBillingConfig.styles;
-        return (React.createElement(View, { style: [s.skippingRootContainer, skippingStyles === null || skippingStyles === void 0 ? void 0 : skippingStyles.rootContainer] },
-            React.createElement(View, { style: [s.skippingDialogContainer, skippingStyles === null || skippingStyles === void 0 ? void 0 : skippingStyles.dialogContainer] },
-                React.createElement(Image, { source: (skipBillingConfig === null || skipBillingConfig === void 0 ? void 0 : skipBillingConfig.brandImage) || R.images.brand, style: [s.skippingBrandImage, skippingStyles === null || skippingStyles === void 0 ? void 0 : skippingStyles.brandImage] }),
-                React.createElement(Text, { style: [s.skippingMessage, skippingStyles === null || skippingStyles === void 0 ? void 0 : skippingStyles.text] }, (texts === null || texts === void 0 ? void 0 : texts.skippingMessage) || 'Checking out...'),
-                !!(skipBillingConfig === null || skipBillingConfig === void 0 ? void 0 : skipBillingConfig.isActivityIndicatorVisible) && (React.createElement(ActivityIndicator, { color: ((_a = skippingStyles === null || skippingStyles === void 0 ? void 0 : skippingStyles.activityIndicator) === null || _a === void 0 ? void 0 : _a.color) || R.colors.black, size: ((_b = skippingStyles === null || skippingStyles === void 0 ? void 0 : skippingStyles.activityIndicator) === null || _b === void 0 ? void 0 : _b.size) || 'large' })))));
-    };
-    const renderContent = () => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
-        return (React.createElement(React.Fragment, null,
-            React.createElement(KeyboardAwareScrollView, { extraScrollHeight: 32 },
-                React.createElement(View, { style: styles === null || styles === void 0 ? void 0 : styles.rootContainer },
-                    React.createElement(Login, { onLoginSuccessful: handleOnLoginSuccess, onLoginError: handleOnLoginError, onLogoutSuccess: handleOnLogoutSuccess, onLogoutError: onLogoutError, isLoginDialogVisible: isLoginDialogVisible, showLoginDialog: showLoginDialog, hideLoginDialog: hideLoginDialog, userFirstName: loggedUserFirstName, texts: { ...texts === null || texts === void 0 ? void 0 : texts.loginTexts, message: loginMessage }, styles: styles === null || styles === void 0 ? void 0 : styles.loginStyles, brandImages: loginBrandImages }),
-                    React.createElement(Text, { style: styles === null || styles === void 0 ? void 0 : styles.screenTitle }, ((_a = texts === null || texts === void 0 ? void 0 : texts.form) === null || _a === void 0 ? void 0 : _a.getYourTicketsTitle) || 'Get Your Tickets'),
-                    React.createElement(Input, { label: ((_b = texts === null || texts === void 0 ? void 0 : texts.form) === null || _b === void 0 ? void 0 : _b.firstName) || 'First name', value: firstName, onChangeText: handleOnFirstNameChanged, error: firstNameError || firstNameErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles }),
-                    React.createElement(Input, { label: ((_c = texts === null || texts === void 0 ? void 0 : texts.form) === null || _c === void 0 ? void 0 : _c.lastName) || 'Last name', value: lastName, onChangeText: handleOnLastNameChanged, error: lastNameError || lastNameErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles }),
-                    React.createElement(Text, { style: styles === null || styles === void 0 ? void 0 : styles.texts }, ((_d = texts === null || texts === void 0 ? void 0 : texts.form) === null || _d === void 0 ? void 0 : _d.emailsAdvice) ||
-                        `IMPORTANT: Please double check that your email address is correct.\nIt's where we send your confirmation and e-tickets to!`),
-                    React.createElement(Input, { label: ((_e = texts === null || texts === void 0 ? void 0 : texts.form) === null || _e === void 0 ? void 0 : _e.email) || 'Email', value: email, onChangeText: handleOnEmailChanged, keyboardType: 'email-address', error: emailError || emailErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles, autoCapitalize: 'none' }),
-                    React.createElement(Input, { label: ((_f = texts === null || texts === void 0 ? void 0 : texts.form) === null || _f === void 0 ? void 0 : _f.confirmEmail) || 'Confirm email', value: emailConfirmation, onChangeText: handleOnEmailConfirmationChanged, keyboardType: 'email-address', error: confirmEmailError || emailConfirmationErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles, autoCapitalize: 'none' }),
-                    isAgeRequired && (React.createElement(DatePicker, { text: ((_g = texts === null || texts === void 0 ? void 0 : texts.form) === null || _g === void 0 ? void 0 : _g.dateOfBirth) || 'Date of Birth', onSelectDate: handleOnSelectDate, selectedDate: dateOfBirth, styles: styles === null || styles === void 0 ? void 0 : styles.datePicker, error: dateOfBirthError })),
-                    !loggedUserFirstName && (React.createElement(React.Fragment, null,
-                        React.createElement(Text, { style: styles === null || styles === void 0 ? void 0 : styles.passwordTitle }, ((_h = texts === null || texts === void 0 ? void 0 : texts.form) === null || _h === void 0 ? void 0 : _h.choosePassword) ||
-                            'Choose a password for your new TICKETFAIRY account'),
-                        React.createElement(Input, { label: ((_j = texts === null || texts === void 0 ? void 0 : texts.form) === null || _j === void 0 ? void 0 : _j.password) || 'Password', isSecure: true, onChangeText: handleOnPasswordChanged, error: passwordError || passwordErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles, autoCapitalize: 'none', secureTextEntry: true, textContentType: 'oneTimeCode' }),
-                        React.createElement(Input, { label: ((_k = texts === null || texts === void 0 ? void 0 : texts.form) === null || _k === void 0 ? void 0 : _k.confirmPassword) || 'Confirm password', isSecure: true, onChangeText: handleOnConfirmPasswordChanged, error: confirmPasswordError || confirmPasswordErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles, autoCapitalize: 'none', secureTextEntry: true, textContentType: 'oneTimeCode' }))),
-                    !isPhoneHidden && (React.createElement(PhoneInput, { phoneNumber: phone, onChangePhoneNumber: handleOnChangePhoneNumber, styles: styles === null || styles === void 0 ? void 0 : styles.phoneInput, error: phoneError, texts: {
-                            label: phoneLabel,
-                            ...(_l = texts === null || texts === void 0 ? void 0 : texts.form) === null || _l === void 0 ? void 0 : _l.phoneInput,
-                        } })),
-                    !isTicketFree && (React.createElement(React.Fragment, null,
-                        React.createElement(Input, { label: addressLabel, value: street, onChangeText: handleOnStreetChanged, error: streetError || streetErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles }),
-                        React.createElement(Input, { label: ((_m = texts === null || texts === void 0 ? void 0 : texts.form) === null || _m === void 0 ? void 0 : _m.city) || 'City', value: city, onChangeText: handleOnCityChanged, error: cityError || cityErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles }),
-                        React.createElement(DropdownMaterial, { items: countries, onSelectItem: handleOnCountryChanged, selectedOption: selectedCountry, styles: styles === null || styles === void 0 ? void 0 : styles.dropdownMaterialStyles, materialInputProps: {
-                                label: ((_o = texts === null || texts === void 0 ? void 0 : texts.form) === null || _o === void 0 ? void 0 : _o.country) || 'Country',
-                                error: countryErrorState,
-                            } }),
-                        React.createElement(Input, { label: ((_p = texts === null || texts === void 0 ? void 0 : texts.form) === null || _p === void 0 ? void 0 : _p.zipCode) || 'Postal Code / Zip Code', value: postalCode, onChangeText: handleOnPostalCodeChanged, error: postalCodeError || postalCodeErrorState, styles: styles === null || styles === void 0 ? void 0 : styles.inputStyles }),
-                        React.createElement(DropdownMaterial, { items: states, onSelectItem: handleOnStateChanged, selectedOption: selectedState, styles: styles === null || styles === void 0 ? void 0 : styles.dropdownMaterialStyles, materialInputProps: {
-                                label: ((_q = texts === null || texts === void 0 ? void 0 : texts.form) === null || _q === void 0 ? void 0 : _q.state) || 'State',
-                                error: stateErrorState,
-                            } }))),
-                    React.createElement(Checkbox, { onPress: handleIsSubToBrandToggle, text: brandCheckBoxText, isActive: isSubToBrand, styles: styles === null || styles === void 0 ? void 0 : styles.checkboxStyles }),
-                    !isTtfCheckboxHidden && (React.createElement(Checkbox, { onPress: handleIsSubToTicketFairyToggle, isActive: isSubToTicketFairy, customTextComp: React.createElement(Text, { style: [
-                                (_r = styles === null || styles === void 0 ? void 0 : styles.customCheckbox) === null || _r === void 0 ? void 0 : _r.text,
-                                !!ttfPrivacyPolicyError && {
-                                    color: (_s = styles === null || styles === void 0 ? void 0 : styles.customCheckbox) === null || _s === void 0 ? void 0 : _s.errorColor,
-                                },
-                            ] },
-                            ((_t = texts === null || texts === void 0 ? void 0 : texts.form) === null || _t === void 0 ? void 0 : _t.isSubToTicketFairy) ||
-                                `I agree that The Ticket Fairy may use the personal data that have provided for marketing purposes, such as recommending events that I might be interested in, in accordance with its `,
-                            React.createElement(Text, { style: styles === null || styles === void 0 ? void 0 : styles.privacyPolicyLinkStyle, onPress: handleOpenPrivacyLink }, ((_u = texts === null || texts === void 0 ? void 0 : texts.form) === null || _u === void 0 ? void 0 : _u.privacyPolicy) || 'Privacy Policy'),
-                            "."), styles: { error: s.ttfPolicyError, ...styles === null || styles === void 0 ? void 0 : styles.checkboxStyles }, error: ttfPrivacyPolicyError })),
-                    renderTicketHolders(),
-                    React.createElement(Button, { onPress: onSubmit, text: (texts === null || texts === void 0 ? void 0 : texts.checkoutButton) || 'CHECKOUT', isDisabled: isButtonDisabled, isLoading: isSubmittingData, styles: isButtonDisabled
-                            ? {
-                                button: s.submitButtonDisabled,
-                                ...styles === null || styles === void 0 ? void 0 : styles.checkoutButtonDisabled,
-                            }
-                            : {
-                                container: [
-                                    s.submitButton,
-                                    (_v = styles === null || styles === void 0 ? void 0 : styles.checkoutButton) === null || _v === void 0 ? void 0 : _v.container,
-                                ],
-                                text: (_w = styles === null || styles === void 0 ? void 0 : styles.checkoutButton) === null || _w === void 0 ? void 0 : _w.text,
-                                button: (_x = styles === null || styles === void 0 ? void 0 : styles.checkoutButton) === null || _x === void 0 ? void 0 : _x.button,
-                            } })),
-                areLoadingIndicatorsEnabled && isLoading && React.createElement(Loading, null)),
-            React.createElement(CartTimer, { secondsLeft: secondsLeft, styles: styles === null || styles === void 0 ? void 0 : styles.cartTimer, texts: texts === null || texts === void 0 ? void 0 : texts.cartTimer, shouldNotMinimize: shouldCartTimerNotMinimizeOnTap })));
-    };
-    return (React.createElement(BillingCore, { ref: billingCoreRef, onSecondsLeftChange: setSecondsLeft, onCartExpired: onCartExpired },
-        React.createElement(SessionHandle, { ref: sessionHandleRef }, skippingStatus === 'skipping' && areLoadingIndicatorsEnabled
-            ? renderCheckingOut()
-            : renderContent())));
-    //#endregion
-});
-export default Billing;
-//# sourceMappingURL=Billing.js.map