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.
64 lines
1.5 KiB
64 lines
1.5 KiB
import React from 'react'
|
|
|
|
import { formIds } from 'config/form'
|
|
|
|
import { T9n } from 'features/T9n'
|
|
import { Input, ButtonSolid } from 'features/Common'
|
|
import { Error } from 'features/Common/Input/styled'
|
|
import {
|
|
BlockTitle,
|
|
ButtonsBlock,
|
|
Form,
|
|
} from 'features/Login/styled'
|
|
import { FormStore } from 'features/FormStore'
|
|
|
|
import { useRegistrationForm } from './hooks'
|
|
|
|
const labelWidth = 76
|
|
|
|
const Registration = () => {
|
|
const {
|
|
handleSubmit,
|
|
onEmailBlur,
|
|
readFormError,
|
|
readFormValue,
|
|
updateFormValue,
|
|
} = useRegistrationForm()
|
|
|
|
return (
|
|
<Form onSubmit={handleSubmit} forRegPage>
|
|
<BlockTitle>
|
|
<T9n t='step_title_registration' />
|
|
</BlockTitle>
|
|
<Input
|
|
value={readFormValue(formIds.email)}
|
|
error={readFormError(formIds.email)}
|
|
type='email'
|
|
labelLexic='form_email'
|
|
labelWidth={labelWidth}
|
|
onChange={updateFormValue(formIds.email)}
|
|
onBlur={onEmailBlur}
|
|
/>
|
|
<Input
|
|
value={readFormValue(formIds.password)}
|
|
error={readFormError(formIds.password)}
|
|
type='password'
|
|
labelLexic='form_password'
|
|
labelWidth={labelWidth}
|
|
onChange={updateFormValue(formIds.password)}
|
|
/>
|
|
<ButtonsBlock>
|
|
<ButtonSolid type='submit'>
|
|
<T9n t='next' />
|
|
</ButtonSolid>
|
|
<Error t={readFormError(formIds.formError) || ''} />
|
|
</ButtonsBlock>
|
|
</Form>
|
|
)
|
|
}
|
|
|
|
export const RegistrationStep = () => (
|
|
<FormStore>
|
|
<Registration />
|
|
</FormStore>
|
|
)
|
|
|