You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
spa_instat_tv/src/features/BuyMatchPopup/components/BrazilPayment/index.tsx

66 lines
1.3 KiB

import { Loader } from 'features/Loader'
import { MatchPackage, Match } from 'features/BuyMatchPopup/types'
import { T9n } from 'features/T9n'
import { useBrazilPayment } from './hooks'
import {
LoaderWrapper,
ScButton,
ScModal,
} from './styled'
import { Button } from '../../styled'
export type Props = {
match: Match,
open: boolean,
selectedPackage: MatchPackage,
setIsOpenBrasilian: (open: boolean) => void,
}
export const BrazilPayment = ({
match,
open,
selectedPackage,
setIsOpenBrasilian,
}: Props) => {
const {
closePopup,
error,
matchLink,
src,
} = useBrazilPayment({
match,
open,
selectedPackage,
setIsOpenBrasilian,
})
return (
<ScModal isOpen={open} withCloseButton close={closePopup}>
{src && open ? (
<>
<iframe title='BrazilPayment' src={src} height={600} width='100%' />
<ScButton>
<Button>
<a href={matchLink} style={{ color: 'white' }}>
<T9n t='watch_match' />
</a>
</Button>
</ScButton>
</>
) : (
<>
{error ? (
<T9n t={error} />
) : (
<LoaderWrapper>
<Loader color='#515151' />
</LoaderWrapper>
)}
</>
)}
</ScModal>
)
}