added action to perform send register request

src/containers/dialogs/LogianSocialRegisterButtons/index.tsx

@@ -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 };

src/containers/dialogs/LogianSocialRegisterButtons/styles.scss

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

src/containers/dialogs/LoginSocialRegisterDialog/index.tsx

@@ -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 { IDialogProps } from '~/redux/modal/constants';
 import { BetterScrollDialog } from '~/containers/dialogs/BetterScrollDialog';
@@ -10,11 +10,13 @@ import styles from './styles.scss';
 import { selectAuthRegisterSocial } from '~/redux/auth/selectors';
 import * as AUTH_ACTIONS from '~/redux/auth/actions';
 import { useCloseOnEscape } from '~/utils/hooks';
+import { LoginSocialRegisterButtons } from '~/containers/dialogs/LogianSocialRegisterButtons';
 
 const mapStateToProps = selectAuthRegisterSocial;
 const mapDispatchToProps = {
   authSetRegisterSocialErrors: AUTH_ACTIONS.authSetRegisterSocialErrors,
   authSetRegisterSocial: AUTH_ACTIONS.authSetRegisterSocial,
+  authSendRegisterSocial: AUTH_ACTIONS.authSendRegisterSocial,
 };
 
 type Props = ReturnType<typeof mapStateToProps> & typeof mapDispatchToProps & IDialogProps & {};
@@ -27,10 +29,19 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
 
   authSetRegisterSocialErrors,
   authSetRegisterSocial,
+  authSendRegisterSocial,
 }) => {
   const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
 
+  const onSubmit = useCallback(
+    (event: FormEvent) => {
+      event.preventDefault();
+      authSendRegisterSocial(username, password);
+    },
+    [username, password, authSendRegisterSocial]
+  );
+
   useEffect(() => {
     if (errors.username) authSetRegisterSocialErrors({ username: '' });
   }, [username]);
@@ -46,7 +57,13 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
   useCloseOnEscape(onRequestClose);
 
   return (
-    <BetterScrollDialog onClose={onRequestClose} width={300} error={error}>
+    <form onSubmit={onSubmit}>
+      <BetterScrollDialog
+        onClose={onRequestClose}
+        width={300}
+        error={error}
+        footer={<LoginSocialRegisterButtons />}
+      >
         <Padder>
           <div className={styles.wrap}>
             <Group>
@@ -72,6 +89,7 @@ const LoginSocialRegisterDialogUnconnected: FC<Props> = ({
           </div>
         </Padder>
       </BetterScrollDialog>
+    </form>
   );
 };
 

src/redux/auth/actions.ts

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

src/redux/auth/constants.ts

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

src/utils/reducer.ts

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