w-aura/src/components/EmailEnterPage/index.tsx
2023-05-04 20:56:34 +06:00

49 lines
1.5 KiB
TypeScript

import { useEffect, useState } from 'react'
import { useNavigate } from 'react-router-dom'
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 navigate = useNavigate()
const [email, setEmail] = useState('')
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) => {
setEmail(email)
setIsDisabled(false)
}
const handleClick = () => navigate(routes.client.subscription())
useEffect(() => {
console.log('email', email)
}, [email])
return (
<section className='page'>
<Title variant='h2' className='mt-24'>
We will email you a copy of your wallpaper for easy access.
</Title>
<EmailInput
name="email"
value={email}
placeholder="Your Email"
onValid={handleValidEmail}
onInvalid={() => setIsDisabled(true)}
/>
<p>We don't share any personal information.</p>
<Policy links={links} sizing='medium'>
By clicking "Continue" below, you agree to our EULA and Privacy Policy.
</Policy>
<MainButton label='Continue' onClick={handleClick} disabled={isDisabled} />
</section>
)
}
export default EmailEnterPage