1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00

added action to perform send register request

This commit is contained in:
Fedor Katurov 2020-08-20 15:29:23 +07:00
parent 88ee0601c8
commit 3a11b01c99
6 changed files with 70 additions and 25 deletions

View file

@ -0,0 +1,13 @@
import React, { FC } from 'react';
import { Button } from '~/components/input/Button';
import styles from './styles.module.scss';
interface IProps {}
const LoginSocialRegisterButtons: FC<IProps> = () => (
<div className={styles.wrap}>
<Button stretchy>Зарегистрироваться</Button>
</div>
);
export { LoginSocialRegisterButtons };

View file

@ -0,0 +1,7 @@
.wrap {
padding: $gap $gap * 2;
button {
width: 100%;
}
}

View file

@ -1,4 +1,4 @@
import React, { FC, useEffect, useState } from 'react'; import React, { FC, FormEvent, useCallback, useEffect, useState } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { IDialogProps } from '~/redux/modal/constants'; import { IDialogProps } from '~/redux/modal/constants';
import { BetterScrollDialog } from '~/containers/dialogs/BetterScrollDialog'; import { BetterScrollDialog } from '~/containers/dialogs/BetterScrollDialog';
@ -10,11 +10,13 @@ import styles from './styles.scss';
import { selectAuthRegisterSocial } from '~/redux/auth/selectors'; import { selectAuthRegisterSocial } from '~/redux/auth/selectors';
import * as AUTH_ACTIONS from '~/redux/auth/actions'; import * as AUTH_ACTIONS from '~/redux/auth/actions';
import { useCloseOnEscape } from '~/utils/hooks'; import { useCloseOnEscape } from '~/utils/hooks';
import { LoginSocialRegisterButtons } from '~/containers/dialogs/LogianSocialRegisterButtons';
const mapStateToProps = selectAuthRegisterSocial; const mapStateToProps = selectAuthRegisterSocial;
const mapDispatchToProps = { const mapDispatchToProps = {
authSetRegisterSocialErrors: AUTH_ACTIONS.authSetRegisterSocialErrors, authSetRegisterSocialErrors: AUTH_ACTIONS.authSetRegisterSocialErrors,
authSetRegisterSocial: AUTH_ACTIONS.authSetRegisterSocial, authSetRegisterSocial: AUTH_ACTIONS.authSetRegisterSocial,
authSendRegisterSocial: AUTH_ACTIONS.authSendRegisterSocial,
}; };
type Props = ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & IDialogProps & {}; type Props = ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & IDialogProps & {};
@ -27,10 +29,19 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
authSetRegisterSocialErrors, authSetRegisterSocialErrors,
authSetRegisterSocial, authSetRegisterSocial,
authSendRegisterSocial,
}) => { }) => {
const [username, setUsername] = useState(''); const [username, setUsername] = useState('');
const [password, setPassword] = useState(''); const [password, setPassword] = useState('');
const onSubmit = useCallback(
(event: FormEvent) => {
event.preventDefault();
authSendRegisterSocial(username, password);
},
[username, password, authSendRegisterSocial]
);
useEffect(() => { useEffect(() => {
if (errors.username) authSetRegisterSocialErrors({ username: '' }); if (errors.username) authSetRegisterSocialErrors({ username: '' });
}, [username]); }, [username]);
@ -46,32 +57,39 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
useCloseOnEscape(onRequestClose); useCloseOnEscape(onRequestClose);
return ( return (
<BetterScrollDialog onClose={onRequestClose} width={300} error={error}> <form onSubmit={onSubmit}>
<Padder> <BetterScrollDialog
<div className={styles.wrap}> onClose={onRequestClose}
<Group> width={300}
<DialogTitle>Добро пожаловать в семью!</DialogTitle> error={error}
footer={<LoginSocialRegisterButtons />}
>
<Padder>
<div className={styles.wrap}>
<Group>
<DialogTitle>Добро пожаловать в семью!</DialogTitle>
<InputText handler={setUsername} value={token} title="Token" /> <InputText handler={setUsername} value={token} title="Token" />
<InputText <InputText
handler={setUsername} handler={setUsername}
value={username} value={username}
title="Юзернэйм" title="Юзернэйм"
error={errors.username} error={errors.username}
/> />
<InputText <InputText
handler={setPassword} handler={setPassword}
value={password} value={password}
title="Пароль" title="Пароль"
type="password" type="password"
error={errors.password} error={errors.password}
/> />
</Group> </Group>
</div> </div>
</Padder> </Padder>
</BetterScrollDialog> </BetterScrollDialog>
</form>
); );
}; };

View file

@ -150,3 +150,9 @@ export const authSetRegisterSocialErrors = (
type: AUTH_USER_ACTIONS.SET_REGISTER_SOCIAL_ERRORS, type: AUTH_USER_ACTIONS.SET_REGISTER_SOCIAL_ERRORS,
errors, errors,
}); });
export const authSendRegisterSocial = (username: string, password: string) => ({
type: AUTH_USER_ACTIONS.SEND_REGISTER_SOCIAL,
username,
password,
});

View file

@ -35,6 +35,7 @@ export const AUTH_USER_ACTIONS = {
SET_REGISTER_SOCIAL: 'SET_REGISTER_SOCIAL', SET_REGISTER_SOCIAL: 'SET_REGISTER_SOCIAL',
SET_REGISTER_SOCIAL_ERRORS: 'SET_REGISTER_SOCIAL_ERRORS', SET_REGISTER_SOCIAL_ERRORS: 'SET_REGISTER_SOCIAL_ERRORS',
SEND_REGISTER_SOCIAL: 'SEND_REGISTER_SOCIAL',
}; };
export const USER_ERRORS = { export const USER_ERRORS = {

View file

@ -1,4 +1,4 @@
// create-index.ts // create-index.tsx
import { Action } from 'redux'; import { Action } from 'redux';
type Handlers<State, Types extends string, Actions extends Action<Types>> = { type Handlers<State, Types extends string, Actions extends Action<Types>> = {