import { Fragment, useEffect, useState, MouseEvent, useMemo, } from 'react' import isNull from 'lodash/isNull' import { MDASH } from 'config' import { payments } from 'config/payments' import { client } from 'config/clients' import { CountryCodeType, getCountryCode } from 'requests/getCountryCode' import { CloseButton, HeaderActions } from 'features/PopupComponents' import { T9n } from 'features/T9n' import { Name } from 'features/Name' import { useCardsStore } from 'features/CardsStore' import { ArrowLoader } from 'features/ArrowLoader' import { Arrow } from 'features/HeaderFilters/components/DateFilter/styled' import { useAuthStore } from 'features/AuthStore' import { IframePayment } from '../IframePayment' import { useBuyMatchPopupStore } from '../../store' import { SelectedCard } from '../SelectedCard' import { Packages } from '../Packages' import { Wrapper, Body, Footer, Button, ButtonPrevious, Header, HeaderTitle, } from '../../styled' export const PackageSelectionStep = () => { const { cards, fetchCards, } = useCardsStore() const [isOpenIframe, setIsOpenIframe] = useState(false) const [countryCode, setCountryCode] = useState(null) const { logout, setSearch, user, } = useAuthStore() const { close, disabledBuyBtn, goBack, hasPreviousStep, lastSelectedPackage, loader, match, onBuyClick, selectedPackage, selectedSubscription, setDisabledBuyBtn, setLastSelectedPackage, } = useBuyMatchPopupStore() useEffect(() => { getUserCountry() if (isNull(cards)) { fetchCards() } }, [cards, fetchCards]) const paymentSystem = useMemo(() => { switch (countryCode?.country_code) { case 'BR': return payments.brasil default: return payments[client.name] } }, [countryCode]) const isIframePayment = useMemo(() => { switch (countryCode?.country_code) { case 'BR': // тунис временно заморожен // case 'TN': return true default: return false } }, [countryCode]) if (!match) return null const getUserCountry = () => { getCountryCode().then(setCountryCode) } const onHandleClick = (e?: MouseEvent) => { cards?.length && lastSelectedPackage === selectedPackage?.id && setDisabledBuyBtn(true) if (isIframePayment) { setIsOpenIframe(true) } else { onBuyClick(e) } setLastSelectedPackage(selectedPackage?.id || '') } return (

{hasPreviousStep && ( )} {hasPreviousStep && selectedSubscription ? ( ) : ( {` ${MDASH} `} )}

{!isIframePayment && } {selectedPackage && isIframePayment && ( )} ) }