46 lines
1.5 KiB
TypeScript
46 lines
1.5 KiB
TypeScript
import { useState } from 'react'
|
|
import { useNavigate } from 'react-router-dom'
|
|
import { useTranslation } from 'react-i18next'
|
|
import { useDispatch, useSelector } from 'react-redux'
|
|
import { actions, RootState } from '../../store'
|
|
import Title from '../Title'
|
|
import Policy from '../Policy'
|
|
import EmailInput from '../EmailInput'
|
|
import MainButton from '../MainButton'
|
|
import routes from '../../routes'
|
|
|
|
function EmailEnterPage(): JSX.Element {
|
|
const { t } = useTranslation()
|
|
const dispatch = useDispatch()
|
|
const navigate = useNavigate()
|
|
const email = useSelector((state: RootState) => state.email)
|
|
const [isDisabled, setIsDisabled] = useState(true)
|
|
const links = [
|
|
{ text: 'EULA', href: 'https://aura.wit.life/terms' },
|
|
{ text: 'Privacy Policy', href: 'https://aura.wit.life/privacy' },
|
|
]
|
|
const handleValidEmail = (email: string) => {
|
|
dispatch(actions.email.update(email))
|
|
setIsDisabled(false)
|
|
}
|
|
const handleClick = () => navigate(routes.client.subscription())
|
|
|
|
return (
|
|
<section className='page'>
|
|
<Title variant='h2' className='mt-24'>{t('weWillEmailYou')}</Title>
|
|
<EmailInput
|
|
name="email"
|
|
value={email}
|
|
placeholder={t('yourEmail')}
|
|
onValid={handleValidEmail}
|
|
onInvalid={() => setIsDisabled(true)}
|
|
/>
|
|
<p>{t('weDontShare')}</p>
|
|
<Policy links={links} sizing='medium'>{t('continueAgree')}</Policy>
|
|
<MainButton label={t('continue')} onClick={handleClick} disabled={isDisabled} />
|
|
</section>
|
|
)
|
|
}
|
|
|
|
export default EmailEnterPage
|